Merge branch 'ui' of http://185.100.212.76:7776/Dwinzo-Beta/Dwinzo_dev into ui

app/src/components/ui/componets/RealTimeVisulization.tsx

@@ -8,7 +8,6 @@ import Scene from "../../../modules/scene/scene";
 import useModuleStore from "../../../store/useModuleStore";
 import { getZonesApi } from "../../../services/realTimeVisulization/zoneData/getZones";
 
-
 type Side = "top" | "bottom" | "left" | "right";
 
 type FormattedZoneData = Record<
@@ -41,7 +40,87 @@ const RealTimeVisulization: React.FC = () => {
   const { isPlaying } = usePlayButtonStore();
   const { activeModule } = useModuleStore();
 
-  const [zonesData, setZonesData] = useState<FormattedZoneData>({});
+  const [zonesData, setZonesData] = useState<{
+    [key: string]: {
+      activeSides: Side[];
+      panelOrder: Side[];
+      lockedPanels: Side[];
+      widgets: Widget[];
+    };
+  }>({
+    "Manufacturing unit": {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    "Assembly unit": {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    "Packing unit": {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    Warehouse: {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    Inventory: {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    "Inventory 1": {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    "Inventory 2": {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    "Inventory 3": {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    "Inventory 4": {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    "Inventory 5": {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    "Inventory 6": {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+    "Inventory 7": {
+      activeSides: [],
+      panelOrder: [],
+      lockedPanels: [],
+      widgets: [],
+    },
+  });
   const { selectedZone, setSelectedZone } = useSelectedZoneStore();
 
   useEffect(() => {
@@ -73,10 +152,7 @@ const RealTimeVisulization: React.FC = () => {
     GetZoneData();
   }, []);
 
-  useEffect(() => {
-
-    console.log('zonesData: ', zonesData);
-  }, [zonesData]);
+  useEffect(() => {}, [zonesData]);
 
   // useEffect(() => {
   //   setZonesData((prev) => {
@@ -111,7 +187,8 @@ const RealTimeVisulization: React.FC = () => {
         style={{
           height: "100%",
           width: "100%",
-          borderRadius: isPlaying || activeModule !== "visualization" ? "" : "6px",
+          borderRadius:
+            isPlaying || activeModule !== "visualization" ? "" : "6px",
         }}
       >
         <Scene />
@@ -137,6 +214,7 @@ const RealTimeVisulization: React.FC = () => {
             selectedZone={selectedZone}
             setSelectedZone={setSelectedZone}
             hiddenPanels={hiddenPanels}
+            setZonesData={setZonesData}
           />
         </>
       )}