+971
diff --git a/src/components/complexWingPage/FloorSidebar/ApartmentDescription.tsx b/src/components/complexWingPage/FloorSidebar/ApartmentDescription.tsx
new file mode 100644
index 0000000..f603592
--- /dev/null
+++ b/src/components/complexWingPage/FloorSidebar/ApartmentDescription.tsx
@@ -0,0 +1,22 @@
+interface ApartmentDescriptionProps {
+ isVisible?: boolean;
+}
+
+const ApartmentDescription = ({
+ isVisible = true,
+}: ApartmentDescriptionProps) => {
+ return (
+
+
+ 1 bedroom, 609 Sqft
+
+
AED 1,668,888
+
+ );
+};
+
+export default ApartmentDescription;
diff --git a/src/components/complexWingPage/FloorSidebar/FloorEastWingLayout.tsx b/src/components/complexWingPage/FloorSidebar/FloorEastWingLayout.tsx
index cfba6bf..c15bdf2 100644
--- a/src/components/complexWingPage/FloorSidebar/FloorEastWingLayout.tsx
+++ b/src/components/complexWingPage/FloorSidebar/FloorEastWingLayout.tsx
@@ -1,55 +1,473 @@
function FloorEastWingLayout() {
return (
);
}
diff --git a/src/components/complexWingPage/FloorSidebar/FloorSidebar.tsx b/src/components/complexWingPage/FloorSidebar/FloorSidebar.tsx
index fce692a..ddc0d56 100644
--- a/src/components/complexWingPage/FloorSidebar/FloorSidebar.tsx
+++ b/src/components/complexWingPage/FloorSidebar/FloorSidebar.tsx
@@ -1,5 +1,4 @@
import { IDesctiptionFloor } from "../../../types/descriptionFloor";
-import FloorEastWingLayout from "./FloorEastWingLayout";
import FloorWestWingLayout from "./FloorWestWingLayout";
interface IFloorSidebarProps {
@@ -9,7 +8,7 @@ interface IFloorSidebarProps {
const FloorSidebar = ({ currentFloor, onMouseEnter }: IFloorSidebarProps) => {
return (
@@ -45,12 +44,15 @@ const FloorSidebar = ({ currentFloor, onMouseEnter }: IFloorSidebarProps) => {
2 Bedroom
-
+ {/*
{currentFloor?.wing === "West Wing" ? (
) : (
)}
+
*/}
+
+
);
diff --git a/src/components/complexWingPage/FloorSidebar/FloorWestWingHighlighting.tsx b/src/components/complexWingPage/FloorSidebar/FloorWestWingHighlighting.tsx
new file mode 100644
index 0000000..2306cd4
--- /dev/null
+++ b/src/components/complexWingPage/FloorSidebar/FloorWestWingHighlighting.tsx
@@ -0,0 +1,440 @@
+import { useEffect, useState } from "react";
+import ApartmentDescription from "./ApartmentDescription";
+import { createPortal } from "react-dom";
+import { div } from "three/examples/jsm/nodes/Nodes.js";
+
+const FloorWestWingHighlighting = () => {
+ const [mousePos, setMousePos] = useState
([0, 0]);
+ const [isDescVisible, setisDescVisible] = useState(true);
+
+ function handleMouseMove(e: MouseEvent) {
+ const top = window.innerWidth / 2 - window.innerHeight / 2;
+ setMousePos([e.clientX, e.clientY]);
+ }
+
+ useEffect(() => {
+ window.addEventListener("mousemove", handleMouseMove);
+ return () => {
+ window.removeEventListener("mousemove", handleMouseMove);
+ };
+ }, []);
+
+ function handleOnMouseOut(
+ event: MouseEvent
+ ): void {
+ throw new Error("Function not implemented.");
+ }
+ function handleOnMouseOver(
+ event: MouseEvent
+ ): void {
+ console.log("event", event);
+ }
+
+ return (
+ <>
+
+ ,
+ {/* {createPortal(
+ document.body
+ )} */}
+
+
+ );
+};
+
+export default FloorWestWingHighlighting;
diff --git a/src/components/complexWingPage/FloorSidebar/FloorWestWingLayout.tsx b/src/components/complexWingPage/FloorSidebar/FloorWestWingLayout.tsx
index 89ae45e..372faa8 100644
--- a/src/components/complexWingPage/FloorSidebar/FloorWestWingLayout.tsx
+++ b/src/components/complexWingPage/FloorSidebar/FloorWestWingLayout.tsx
@@ -1,55 +1,461 @@
+import FloorWestWingHighlighting from "./FloorWestWingHighlighting";
+
function FloorWestWingLayout() {
return (
-
+ fill="#F0F0E9"
+ d="M1.246 146.952v15.187h141.468V257.7h70.793v-95.561h375.844v-24.076H144.315L6.229 140.227l-4.983 6.725z"
+ >
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
);
}
diff --git a/src/data/appartments.json b/src/data/appartments.json
index 7502c93..0ae6c7f 100644
--- a/src/data/appartments.json
+++ b/src/data/appartments.json
@@ -1,6 +1,6 @@
[
{
- "id": "appartments-studio-1",
+ "id": "apartments-studio-1",
"spheres": [
{
"id": "studio-1_sp-01",