fixed duplication bug

app/src/modules/visualization/widgets/2d/DraggableWidget.tsx

@@ -193,12 +193,18 @@ export const DraggableWidget = ({
       };
       
       if (visualizationSocket) {
-        visualizationSocket.emit("v2:viz-widget:add", duplicateWidget);
+        console.log('duplicated');
+        
+        visualizationSocket.emit("v2:viz-widget:add", duplicateWidget, (res: any)=> {
+          if (res.success) {
+            setSelectedZone((prevZone: any) => ({
+              ...prevZone,
+              widgets: [...prevZone.widgets, duplicatedWidget],
+            }));
+          }
+        });
       }
-      setSelectedZone((prevZone: any) => ({
+      
-        ...prevZone,
-        widgets: [...prevZone.widgets, duplicatedWidget],
-      }));
 
       // const response = await duplicateWidgetApi(selectedZone.zoneId, organization, duplicatedWidget);
 
@@ -350,13 +356,14 @@ export const DraggableWidget = ({
         {/* Render charts based on widget type */}
 
         {widget.type === "progress 1" && (
-          <ProgressCard1 title={widget.title} id={widget.id} />
+          <ProgressCard1 key={widget.id} title={widget.title} id={widget.id} />
         )}
         {widget.type === "progress 2" && (
-          <ProgressCard2 title={widget.title} id={widget.id} />
+          <ProgressCard2 key={widget.id} title={widget.title} id={widget.id} />
         )}
         {widget.type === "line" && (
           <LineGraphComponent
+            key={widget.id}
             id={widget.id}
             type={widget.type}
             title={widget.title}
@@ -366,6 +373,7 @@ export const DraggableWidget = ({
         )}
         {widget.type === "bar" && (
           <BarGraphComponent
+            key={widget.id}
             id={widget.id}
             type={widget.type}
             title={widget.title}
@@ -375,6 +383,7 @@ export const DraggableWidget = ({
         )}
         {widget.type === "pie" && (
           <PieGraphComponent
+            key={widget.id}
             id={widget.id}
             type={widget.type}
             title={widget.title}
@@ -384,6 +393,7 @@ export const DraggableWidget = ({
         )}
         {widget.type === "doughnut" && (
           <DoughnutGraphComponent
+            key={widget.id}
             id={widget.id}
             type={widget.type}
             title={widget.title}
@@ -393,6 +403,7 @@ export const DraggableWidget = ({
         )}
         {widget.type === "polarArea" && (
           <PolarAreaGraphComponent
+            key={widget.id}
             id={widget.id}
             type={widget.type}
             title={widget.title}

app/src/modules/visualization/widgets/3d/Dropped3dWidget.tsx

@@ -273,7 +273,13 @@ export default function Dropped3dWidgets() {
                     zoneId: selectedZone.zoneId,
                 };
                 if (visualizationSocket) {
-                    visualizationSocket.emit("v2:viz-3D-widget:add", adding3dWidget);
+                    visualizationSocket.emit("v2:viz-3D-widget:add", adding3dWidget,(res:any)=>{
+                        if (res.success) {
+                            addWidget(selectedZone.zoneId, newWidget);
+                            setRightSelect(null);
+                            setRightClickSelected(null); 
+                        }
+                    });
                 }
                 // let response = await adding3dWidgets(selectedZone.zoneId, organization, newWidget)
                 //

app/src/store/useDroppedObjectsStore.ts

@@ -132,7 +132,6 @@ export const useDroppedObjectsStore = create<DroppedObjectsState>((set) => ({
             : originalObject.position.left,
       },
     };
-    console.log("duplicated object",duplicatedObject);
     
     let duplicateFloatingWidget = {
       organization: organization,
@@ -144,18 +143,23 @@ export const useDroppedObjectsStore = create<DroppedObjectsState>((set) => ({
     if (visualizationSocket) {
       visualizationSocket.emit(
         "v2:viz-float:addDuplicate",
-        duplicateFloatingWidget
+        duplicateFloatingWidget,
+        (res:any)=>{
+          if (res.success) {
+            useDroppedObjectsStore.setState((state) => ({
+              zones: {
+                ...state.zones,
+                [zoneName]: {
+                  ...state.zones[zoneName],
+                  objects: [...state.zones[zoneName].objects, duplicatedObject], // Append duplicated object
+                },
+              },
+            }));
+          }
+        }
       );
     }
-    useDroppedObjectsStore.setState((state) => ({
+    
-      zones: {
-        ...state.zones,
-        [zoneName]: {
-          ...state.zones[zoneName],
-          objects: [...state.zones[zoneName].objects, duplicatedObject], // Append duplicated object
-        },
-      },
-    }));
 
     // Make async API call outside of Zustand set function
     // let response = await addingFloatingWidgets(