nestiq-component-library 1.1.169 → 1.1.170

package/src/components/PropertyImageList/PropertyImageList.tsx

@@ -14,6 +14,11 @@ import FloorPlanPopup from "../FloorPlanPopup/FloorPlanPopup";
 interface PopupProps {
   pictureUrls: { title: string; url: string }[];
   floorPlanUrl: string;
+  property: {
+    selectedFloorPlan?: string;
+    pictures: { contentUrl: string; pictureType: { id: number } }[];
+  };
+  baseUrl: string;
 }
 export default function PropertyImageList(prop: PopupProps) {
   const [currentImageIndex, setCurrentImageIndex] = useState(0);
@@ -26,29 +31,45 @@ export default function PropertyImageList(prop: PopupProps) {
 
     setCurrentImageIndex((prevIndex) => {
       let newIndex;
+
       if (direction === "left") {
         newIndex =
           (prevIndex - 1 + prop.pictureUrls.length) % prop.pictureUrls.length;
-      } else if (direction === "right") {
+      } else {
         newIndex = (prevIndex + 1) % prop.pictureUrls.length;
       }
+
+      if (imageListRef.current) {
+        imageListRef.current.scrollTo({
+          left: newIndex * 150,
+          behavior: "smooth",
+        });
+      }
       return newIndex || 0;
     });
+  };
+
+  const floorPlanImages =
+    prop.property.pictures
+      ?.filter((p) => p.pictureType?.id === 1)
+      .map((p, index) => ({
+        url: prop.baseUrl + p.contentUrl,
+        title: `Floor Plan ${index + 1}`,
+      })) || [];
 
-    imageListRef.current!.scrollTo({
-      left: currentImageIndex * (direction === "left" ? -150 : 150),
-      behavior: "smooth",
+  if (prop.property.selectedFloorPlan) {
+    floorPlanImages.push({
+      url: prop.property.selectedFloorPlan,
+      title: "Selected Floor Plan",
     });
-  };
+  }
 
   const toggleAllPhotos = () => {
     setIsImagePopupOpen(!isImagePopupOpen);
   };
 
   const floorPlanClickHandler = () => {
-    if (prop.floorPlanUrl) {
-      setIsFloorPlanPopupOpen(true);
-    }
+    setIsFloorPlanPopupOpen(true);
   };
 
   const floorPlanPopupCloseHandler = () => {
@@ -208,9 +229,9 @@ export default function PropertyImageList(prop: PopupProps) {
 
       {/* Popup for floor plan */}
       {isFloorPlanPopupOpen && (
-        <FloorPlanPopup
-          contentUrl={prop.floorPlanUrl}
-          onCloseClick={floorPlanPopupCloseHandler}
+        <ImageListPopup
+          pictureUrls={floorPlanImages}
+          onClose={() => setIsFloorPlanPopupOpen(false)}
         />
       )}
     </div>