filters server + filter client

2024-06-19 18:26:17 +05:00
parent 960e502db2
commit 9630f42a08
44 changed files with 817 additions and 126 deletions
@@ -0,0 +1,17 @@
+import { apartmentsApi } from "./urls";
+import ky from "ky";
+
+async function getApartments(token: string | null) {
+  // const token =
+  //   "1000.04c54423a172cff4f2075ef60dc46403.b4a66d1663ed3b39fa86c9b28dbed2fa";
+
+  const res = await ky.get(apartmentsApi, {
+    headers: {
+      Authorization: `Zoho-oauthtoken ${token}`,
+    },
+  });
+
+  return res.json();
+}
+
+export { getApartments };
@@ -0,0 +1,19 @@
+import ky from "ky";
+import { updateAccessTokenApi } from "./urls";
+import { IUpdateAccessToken } from "../types/updateAccessToken";
+
+async function updateAccessToken() {
+  try {
+    const res = await ky.get(updateAccessTokenApi);
+
+    res.json().then((data) => {
+      const accessToken = (data as IUpdateAccessToken).accessToken;
+
+      localStorage.setItem("ACCESS_TOKEN", accessToken);
+    });
+  } catch (error) {
+    console.log("error", error);
+  }
+}
+
+export { updateAccessToken };
@@ -0,0 +1,7 @@
+const serverApi = "http://192.168.56.1:3000";
+
+const apartmentsApi = `${serverApi}/apartments`;
+
+const updateAccessTokenApi = `${serverApi}/updateAccessToken`;
+
+export { apartmentsApi, updateAccessTokenApi };
@@ -3,8 +3,6 @@ import { IDesctiptionFloor } from "../../../types/descriptionFloor";
 import ApartmentDescription from "./ApartmentDescription";
 import FloorWestWingHighlighting from "./FloorWestWingHighlighting";
 import FloorWestWingLayout from "./FloorWestWingLayout";
-import { useNavigate } from "react-router-dom";
-import useWingSidebar from "../../../store/useWingSidebar";
 import FloorEastWingHighlighting from "./FloorEastWingHighlighting";
 import FloorEastWingLayout from "./FloorEastWingLayout";
 import useModal from "../../../store/useModal";
@@ -23,11 +21,8 @@ const FloorSidebar = ({ currentFloor, onMouseEnter }: IFloorSidebarProps) => {
  const [mousePos, setMousePos] = useState<number[]>([0, 0]);
  const [isDescVisible, setIsDescVisible] = useState(false);
  const [is3DTourAvailable] = useState(true);
-  const { setIsSidebar } = useWingSidebar();
  const { setModal } = useModal();

-  const navigate = useNavigate();
-
  function handleOnApartmentClick(
    event: React.MouseEvent<SVGSVGElement, MouseEvent>
  ) {
@@ -37,7 +32,6 @@ const FloorSidebar = ({ currentFloor, onMouseEnter }: IFloorSidebarProps) => {
      setModal(<AboutComplexModal apartment={apartment} />);
      setIsDescVisible(false);
    }
-    // console.log("e", apartments);
  }

  function handleMouseMove(e: MouseEvent) {
@@ -1,23 +1,25 @@
 import { useNavigate } from "react-router-dom";
-import { ILayoutCard } from "../../types/layoutCard";
-import { formatNumber } from "../../calc/formatNumber";
+import Button from "../Button";
+import HeartIcon from "../icons/Heart";
+import { IAparmentRes } from "../../types/apartmentsRes";

 interface LayoutCardProps {
-  layoutCard: ILayoutCard;
+  apartmentCard: IAparmentRes;
 }

-const LayoutCard = ({ layoutCard }: LayoutCardProps) => {
+const LayoutCard = ({ apartmentCard }: LayoutCardProps) => {
  const {
-    floorEnd,
-    floorStart,
-    apartmentType,
-    roveHome,
-    wing,
-    units,
-    square,
-    cost,
+    Project_Name: projectName,
+    Floor: floor,
    id,
-  } = layoutCard;
+    Unit_No: unit,
+    Unit_Type: unitType,
+    Total_Area_Sqft: _totalArea,
+  } = apartmentCard;
+  const wing = unit.split("-")[0] === "E" ? "East" : "West";
+  const unitNumber = unit.split("-")[1];
+  const totalArea = `${_totalArea}`.split(".").join(",");
+
  const navigate = useNavigate();

  const handleOnClick = () => {
@@ -26,35 +28,41 @@ const LayoutCard = ({ layoutCard }: LayoutCardProps) => {

  return (
    <div
-      className="bg-white flex flex-col p-4 rounded-2xl gap-4 cursor-pointer select-none"
+      className="bg-white flex flex-col p-4 rounded-2xl cursor-pointer select-none"
      onClick={handleOnClick}
    >
-      <div className="flex gap-4  justify-between">
+      <div className="flex gap-4 justify-between">
        <div className="flex gap-1 flex-col">
-          <p className="text-[#00BED7] text-s leading-5">
-            Rove Home {roveHome}
-          </p>
+          <p className="text-[#00BED7] text-s leading-5">{projectName}</p>
          <div className="text-[#73787C] flex gap-2 items-center w-fit">
-            <p className="text-caption-m font-semibold leading-4">{wing}</p>
+            <p className="text-caption-m font-semibold leading-4">
+              {wing} Wing
+            </p>
            <div className="w-1 h-1 bg-[#E2E2DC] rounded-full"></div>
            <p className="text-caption-m font-semibold leading-4">
-              Floor {floorStart}-{floorEnd}
+              Floor {floor}
+            </p>
+            <div className="w-1 h-1 bg-[#E2E2DC] rounded-full"></div>
+            <p className="text-caption-m font-semibold leading-4">
+              № {unitNumber}
            </p>
          </div>
        </div>
-        <div className="bg-[#00BED7] text-white text-caption-m font-semibold rounded-full py-[3px] px-2 self-start text-nowrap">
-          {units} units
-        </div>
+        <Button
+          icon={<HeartIcon isFilled={false} />}
+          buttonType="favorite"
+          isCircleRounded
+        />
      </div>
-      <div className="w-full  aspect-square rounded-lg">
+      <div className="w-full  aspect-square rounded-lg pt-6">
        <img src="/images/layout-1.png" alt="" className="h-full" />
      </div>
-      <div className="flex flex-col">
-        <p className="text[#0D1922] text-s">
-          {apartmentType}, {square} Sqft
+      <div className="flex flex-col gap-1 pt-6">
+        <p className="text-[#0D1922] text-s">
+          {unitType}, {totalArea} Sqft
        </p>
-        <p className="text-[#00BED7] text-m font-bold">
-          AED {formatNumber(cost, ",", 3, 1)}
+        <p className="text-[#00BED7] text-subheadline-s font-semibold">
+          Unavailable
        </p>
      </div>
    </div>
@@ -1,19 +1,24 @@
 import { useEffect, useState } from "react";
 import LayoutCard from "./LayoutCard";
 import SortButton from "./SortButton";
-import useSearchFilters from "../../store/useSearchFilters";
-import { initialSortList, layoutsCards } from "../../consts/initialSearchPage";
+import { initialSortList } from "../../consts/initialSearchPage";
 import SearchIcon from "../icons/SearchIcon";
-import { sortCardBy } from "../../calc/sortCard";
 import Button from "../Button";
 import FilterIcon from "../icons/FilterIcon";
 import useModal from "../../store/useModal";
 import { MobileModalWrapper } from "../modals/mobile/MobileModalWrapper";
 import SearchFiltersModal from "../modals/mobile/SearchFiltersModal";
+import { getApartments } from "../../api/apartments";
+import { IApartmentsRes, InfoRes } from "../../types/apartmentsRes";
+import { updateAccessToken } from "../../api/updateAccessToken";
+import useApartments from "../../store/useApartments";
+import useSearchFilters from "../../store/useSearchFilters";

 const LayoutOptions = () => {
  const [sortList, setSortList] = useState(initialSortList);
-  const [cards, setCards] = useState(layoutsCards);
+  const { apartments, setApartments } = useApartments();
+  const [infoRes, setInfoRes] = useState<InfoRes>(null);
+
  const { setModal } = useModal();
  const { roveHomeTypeCheckboxes, apartmentTypeCheckboxes, multirangeSliders } =
    useSearchFilters();
@@ -35,22 +40,49 @@ const LayoutOptions = () => {
  };

  useEffect(() => {
-    const sortedCards = sortCardBy(sortList, layoutsCards);
+    const zohoToken = localStorage.getItem("ACCESS_TOKEN");

-    setCards(sortedCards);
+    getApartments(zohoToken)
+      .then((data) => {
+        const apartmentsData = (data as IApartmentsRes).apartments;
+        console.log("apartmentsData", apartmentsData);
+        setApartments(apartmentsData);
+      })
+      .catch((error) => {
+        const errorStatus = error.response.status;
+
+        if (errorStatus === 401) {
+          updateAccessToken();
+          const zohoToken = localStorage.getItem("ACCESS_TOKEN");
+
+          getApartments(zohoToken).then((data) => {
+            const apartmentsData = (data as unknown as IApartmentsRes)
+              .apartments;
+
+            setApartments(apartmentsData);
+          });
+        }
+      });
+  }, [setApartments]);
+
+  useEffect(() => {
+    console.log("apartments", apartments);
  }, [
-    sortList,
    roveHomeTypeCheckboxes,
    apartmentTypeCheckboxes,
    multirangeSliders,
+    apartments,
  ]);
+
  return (
    <section className="w-full p-6 flex flex-col">
      <div className="flex justify-between items-center border-b">
        <div className="flex w-full justify-between pb-4 lg:flex-row lg:items-center flex-col">
          <div className="flex gap-4 font-semibold text-subheadline-s leading-7 py-[6px]">
            <h2 className="text-[#0D1922]">Units</h2>
-            <p className="text-[#73787C]">145</p>
+            <p className="text-[#73787C]">
+              {apartments ? apartments.length : 0}
+            </p>
          </div>
          <SortButton sortList={sortList} onClick={handleOnSortClick} />
        </div>
@@ -64,9 +96,10 @@ const LayoutOptions = () => {
        </div>
      </div>
      <div className="grid 2xl:grid-cols-4 xl:grid-cols-3 grid-cols-2 gap-4 pt-6">
-        {cards.map((layoutsCard) => (
-          <LayoutCard layoutCard={layoutsCard} />
-        ))}
+        {apartments &&
+          apartments.map((apartment) => (
+            <LayoutCard apartmentCard={apartment} key={apartment.id} />
+          ))}
      </div>
      <div className="bg-white rounded-lg mt-4 py-[10px] flex justify-center select-none cursor-pointer items-center gap-2">
        <SearchIcon /> Show 12 more apartments
@@ -41,7 +41,7 @@ const initialApartmentTypeCheckboxes: ICheckbox[] = [
 const initialRoveHomeCheckboxes: ICheckbox[] = [
  { title: "Downtown", id: "1", disabled: false, selected: false },
  { title: "Marasi Drive", id: "2", selected: false },
-  { title: "Dubai Marina", id: "3", selected: false, disabled: true },
+  { title: "Dubai Marina", id: "3", selected: false },
 ];

 const initialSwitchers: ISwitcher[] = [
@@ -388,5 +388,460 @@
        ]
      }
    ]
+  },
+  {
+    "id": "apartments-studio-4",
+    "map": "/images/virtual-tour/BDR-2-B_21/map.jpg",
+    "spheres": [
+      {
+        "id": "studio-3_sp-01",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_010000.jpg",
+        "roomType": "entrance 1",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [120, 220],
+        "links": [
+          {
+            "id": "studio-3_sp-07",
+            "type": "default",
+            "labelPosition": [-12.16, 0, 20.11]
+          },
+          {
+            "id": "studio-3_sp-014",
+            "type": "default",
+            "labelPosition": [-30.16, 0, 230.11]
+          },
+          {
+            "id": "studio-3_sp-02",
+            "type": "default",
+            "labelPosition": [100.16, 0, 30.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-014",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_030000.jpg",
+        "roomType": "bathroom 2",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [188, 220],
+        "links": [
+          {
+            "id": "studio-3_sp-01",
+            "type": "default",
+            "labelPosition": [-13, 0, 1.11]
+          },
+          {
+            "id": "studio-3_sp-010",
+            "type": "default",
+            "labelPosition": [40, 0, 22.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-010",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_040000.jpg",
+        "roomType": "bedroom 3",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [188, 144],
+        "links": [
+          {
+            "id": "studio-3_sp-014",
+            "type": "default",
+            "labelPosition": [-45, 0, 20.11]
+          },
+          {
+            "id": "studio-3_sp-02",
+            "type": "default",
+            "labelPosition": [-15, 0, 3.11]
+          },
+          {
+            "id": "studio-3_sp-013",
+            "type": "default",
+            "labelPosition": [-5, 0, 23.31]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-013",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_050000.jpg",
+        "roomType": "bedroom 4",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [188, 80],
+        "links": [
+          {
+            "id": "studio-3_sp-010",
+            "type": "default",
+            "labelPosition": [-45, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-12, 0, -50.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [120, 0, 20.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-02",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_060000.jpg",
+        "roomType": "living room 5",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [128, 155],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-0.16, 0, 21.11]
+          },
+          {
+            "id": "studio-3_sp-010",
+            "type": "default",
+            "labelPosition": [-14.16, 0, 40.11]
+          },
+          {
+            "id": "studio-3_sp-01",
+            "type": "default",
+            "labelPosition": [-45, 0, 24.11]
+          },
+          {
+            "id": "studio-3_sp-07",
+            "type": "default",
+            "labelPosition": [-80, 0, -40.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-07",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_070000.jpg",
+        "roomType": "kitchen 6",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [65, 205],
+        "links": [
+          {
+            "id": "studio-3_sp-01",
+            "type": "default",
+            "labelPosition": [-60, 0, 60.11]
+          },
+          {
+            "id": "studio-3_sp-02",
+            "type": "default",
+            "labelPosition": [0, 0, 35.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-04",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_080000.jpg",
+        "roomType": "glass doors 7",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 60],
+        "links": [
+          {
+            "id": "studio-3_sp-021",
+            "type": "default",
+            "labelPosition": [90.16, 0, 30.11]
+          },
+          {
+            "id": "studio-3_sp-013",
+            "type": "default",
+            "labelPosition": [-15, 0, 120.11]
+          },
+          {
+            "id": "studio-3_sp-02",
+            "type": "default",
+            "labelPosition": [-45, 0, 40.11]
+          }
+        ]
+      },
+
+      {
+        "id": "studio-3_sp-016",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_090000.jpg",
+        "roomType": "balcony 8",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [155, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-013",
+            "type": "default",
+            "labelPosition": [-45, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-018",
+            "type": "default",
+            "labelPosition": [-10, 0, -60.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-018",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_100000.jpg",
+        "roomType": "balcony 9",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-019",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_110000.jpg",
+        "roomType": "balcony 10",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-020",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_120000.jpg",
+        "roomType": "balcony 11",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-021",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_130000.jpg",
+        "roomType": "balcony 12",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-022",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_140000.jpg",
+        "roomType": "balcony 13",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-023",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_150000.jpg",
+        "roomType": "balcony 14",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-024",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_160000.jpg",
+        "roomType": "balcony 15",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-025",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_170000.jpg",
+        "roomType": "balcony 16",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-026",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_180000.jpg",
+        "roomType": "balcony 17",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-027",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_190000.jpg",
+        "roomType": "balcony 18",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-028",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_200000.jpg",
+        "roomType": "balcony 19",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-029",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_210000.jpg",
+        "roomType": "balcony 20",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-030",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_220000.jpg",
+        "roomType": "balcony 21",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      },
+      {
+        "id": "studio-3_sp-031",
+        "sphereImage": "/images/virtual-tour/BDR-2-B_21/BDR-2-B_21_230000.jpg",
+        "roomType": "balcony 22",
+        "position": [-14.16, 0, 24.11],
+        "mapPosition": [85, 20],
+        "links": [
+          {
+            "id": "studio-3_sp-04",
+            "type": "default",
+            "labelPosition": [-70, 0, 25.11]
+          },
+          {
+            "id": "studio-3_sp-016",
+            "type": "default",
+            "labelPosition": [-10, 0, 100.11]
+          }
+        ]
+      }
+    ]
  }
 ]
@@ -0,0 +1,14 @@
+import { create } from "zustand";
+import { IAparmentRes } from "../types/apartmentsRes";
+
+interface ApartmentsStore {
+  apartments: IAparmentRes[];
+  setApartments: (apartments: IAparmentRes[]) => void;
+}
+
+const useApartments = create<ApartmentsStore>((set) => ({
+  apartments: [],
+  setApartments: (apartments) => set(() => ({ apartments: apartments })),
+}));
+
+export default useApartments;
@@ -0,0 +1,34 @@
+interface IAparmentRes {
+  Floor: number;
+  Property_Status: string;
+  Unit_Type: string;
+  Project_Name: string;
+  Suite_Area_Sqft: number;
+  Balcony_Area_Sqft: number;
+  No_Of_Bedrooms: number;
+  Unit_No: string;
+  id: string;
+  Total_Area_Sqft: number;
+  No_of_Bathrooms: number;
+  Property_Name: string;
+  Unit_View: string;
+}
+
+type InfoRes = null | {
+  per_page: number;
+  next_page_token: string;
+  count: number;
+  sort_by: string;
+  page: number;
+  previous_page_token: string | null;
+  page_token_expiry: string;
+  sort_order: string;
+  more_records: boolean;
+};
+
+interface IApartmentsRes {
+  message: string;
+  apartments: IAparmentRes[];
+}
+
+export type { IApartmentsRes, IAparmentRes, InfoRes };
@@ -0,0 +1,6 @@
+interface IError {
+  code: number;
+  message: string;
+}
+
+export type { IError };
@@ -0,0 +1,5 @@
+interface IUpdateAccessToken {
+  accessToken: string;
+}
+
+export type { IUpdateAccessToken };