deletepanel added

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

@@ -6,6 +6,7 @@ import {
 } from "../../icons/RealTimeVisulationIcons";
 import { panelData } from "../../../services/realTimeVisulization/zoneData/panel";
 import { AddIcon } from "../../icons/ExportCommonIcons";
+import { deletePanelApi } from "../../../services/realTimeVisulization/zoneData/deletePanel";
 
 // Define the type for `Side`
 type Side = "top" | "bottom" | "left" | "right";
@@ -34,7 +35,7 @@ interface ButtonsProps {
       zoneName: string;
       activeSides: Side[];
       panelOrder: Side[];
-  
+
       lockedPanels: Side[];
       zoneId: string;
       zoneViewPortTarget: number[];
@@ -103,8 +104,11 @@ const AddButtons: React.FC<ButtonsProps> = ({
   };
 
   // Function to handle "+" button click
-  const handlePlusButtonClick = (side: Side) => {
+  const handlePlusButtonClick = async (side: Side) => {
+
     if (selectedZone.activeSides.includes(side)) {
+      const email = localStorage.getItem("email") || "";
+      const organization = email?.split("@")[1]?.split(".")[0]; // Fallback value
       // If the panel is already active, remove all widgets and close the panel
       const cleanedWidgets = selectedZone.widgets.filter(
         (widget) => widget.panel !== side
@@ -118,8 +122,14 @@ const AddButtons: React.FC<ButtonsProps> = ({
         panelOrder: newActiveSides,
       };
 
+      let response = await deletePanelApi(selectedZone.zoneId, side, organization)
+
+      if (response.message === 'Panel deleted successfully') {
+
+        setSelectedZone(updatedZone);
+      }
+
       // Delete the selectedZone state
-      setSelectedZone(updatedZone);
     } else {
       const updatePanelData = async () => {
         try {
@@ -140,13 +150,15 @@ const AddButtons: React.FC<ButtonsProps> = ({
 
           // API call
           const response = await panelData(organization, selectedZone.zoneId, newActiveSides);
-          
+
+          if (response.message === 'Panels created successfully') {
+            setSelectedZone(updatedZone);
+          }
 
           // Update state
-          
+
-          setSelectedZone(updatedZone);
         } catch (error) {
-          
+
         }
       };
 

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

@@ -152,7 +152,6 @@ const DisplayZone: React.FC<DisplayZoneProps> = ({
   async function handleSelect2dZoneData(zoneId: string, zoneName: string) {
     try {
       if (selectedZone?.zoneId === zoneId) {
-
         return;
       }
       const email = localStorage.getItem("email") || "";
@@ -161,6 +160,7 @@ const DisplayZone: React.FC<DisplayZoneProps> = ({
       let response = await getSelect2dZoneData(zoneId, organization);
       console.log('response: ', response);
       let res = await getFloatingZoneData(zoneId, organization);
+      console.log('res: ', res);
       setFloatingWidget(res)
       // Set the selected zone in the store
       useDroppedObjectsStore.getState().setZone(zoneName, zoneId);

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

@@ -96,7 +96,7 @@ const DroppedObjects: React.FC = () => {
       console.log('res: ', res);
 
       if (res.message === "FloatingWidget deleted successfully") {
-        deleteObject(zoneName, index); // Call the deleteObject method from the store
+        deleteObject(zoneName,id, index); // Call the deleteObject method from the store
       }
     } catch (error) {
       console.error("Error deleting floating widget:", error);
@@ -255,6 +255,7 @@ const DroppedObjects: React.FC = () => {
         ...zone.objects[draggingIndex.index],
         position: boundedPosition,
       });
+      console.log('response: ', response);
 
       if (response.message === "Widget updated successfully") {
         updateObjectPosition(zoneName, draggingIndex.index, boundedPosition);
@@ -386,10 +387,13 @@ const DroppedObjects: React.FC = () => {
               <FleetEfficiencyComponent object={obj} />
             </>
           ) : null}
-          {renderObjectContent(obj)}
+          {/* {renderObjectContent(obj)} */}
           <div
             className="icon kebab"
-            onClick={(event) => handleKebabClick(obj.id, event)}
+            onClick={(event) => {
+              event.stopPropagation();
+              handleKebabClick(obj.id, event)
+            }}
           >
             <KebabIcon />
           </div>

app/src/services/realTimeVisulization/zoneData/add3dWidget.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 export const adding3dWidgets = async (
   zoneId: string,
   organization: string,

app/src/services/realTimeVisulization/zoneData/addFloatingWidgets.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 
 export const addingFloatingWidgets = async (
   zoneId: string,

app/src/services/realTimeVisulization/zoneData/addWidgets.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 export const addingWidgets = async (
   zoneId: string,
   organization: string,

app/src/services/realTimeVisulization/zoneData/deleteFloatingWidget.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 
 export const deleteFloatingWidgetApi = async (
   floatWidgetID: string,

app/src/services/realTimeVisulization/zoneData/deletePanel.ts

@@ -0,0 +1,34 @@
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+
+export const deletePanelApi = async (
+  zoneId: string,
+  panelName: string,
+  organization: string
+) => {
+  console.log('panelName: ', panelName);
+  console.log('organization: ', organization);
+  console.log('zoneId: ', zoneId);
+  try {
+    const response = await fetch(`${url_Backend_dwinzo}/api/v2/panel/delete`, {
+      method: "PATCH",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({ organization, zoneId, panelName }),
+    });
+
+    if (!response.ok) {
+      throw new Error("Failed to delete widget in the zone");
+    }
+
+    const result = await response.json();
+    return result;
+  } catch (error) {
+    if (error instanceof Error) {
+      throw new Error(error.message);
+    } else {
+      throw new Error("An unknown error occurred");
+    }
+  }
+};

app/src/services/realTimeVisulization/zoneData/deleteTemplate.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 
 export const deleteTemplateApi = async (
   templateID: string,

app/src/services/realTimeVisulization/zoneData/deleteWidgetApi.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 
 export const deleteWidgetApi = async (
   widgetID: string,

app/src/services/realTimeVisulization/zoneData/duplicateWidget.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 export const duplicateWidgetApi = async (
   zoneId: string,
   organization: string,

app/src/services/realTimeVisulization/zoneData/get3dWidgetData.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 export const get3dWidgetZoneData = async (
   ZoneId?: string,
   organization?: string

app/src/services/realTimeVisulization/zoneData/getFloatingData.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 export const getFloatingZoneData = async (
   ZoneId?: string,
   organization?: string

app/src/services/realTimeVisulization/zoneData/getSelect2dZoneData.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 
 export const getSelect2dZoneData = async (
   ZoneId?: string,

app/src/services/realTimeVisulization/zoneData/getTemplate.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 export const getTemplateData = async (organization?: string) => {
   try {
     const response = await fetch(

app/src/services/realTimeVisulization/zoneData/getZoneData.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 export const getZone2dData = async (organization?: string) => {
   try {
     const response = await fetch(

app/src/services/realTimeVisulization/zoneData/getZones.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 
 export const getZoneData = async (zoneId: string, organization: string) => {
   console.log("organization: ", organization);

app/src/services/realTimeVisulization/zoneData/loadTemplate.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 export const loadTempleteApi = async (
   templateID: string,
   zoneId: string,

app/src/services/realTimeVisulization/zoneData/panel.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 type Side = "top" | "bottom" | "left" | "right";
 
 export const panelData = async (

app/src/services/realTimeVisulization/zoneData/saveTempleteApi.ts

@@ -1,5 +1,5 @@
-let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
+// let url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}`;
-// let url_Backend_dwinzo = `http://192.168.0.102:5000`;
+let url_Backend_dwinzo = `http://192.168.0.102:5000`;
 export const saveTemplateApi = async (organization: string, template: {}) => {
     console.log('template: ', template);
   try {

app/src/store/useDroppedObjectsStore.ts

@@ -36,7 +36,7 @@ type DroppedObjectsState = {
       bottom: number | "auto";
     }
   ) => void;
-  deleteObject: (zoneName: string, index: number) => void; // Add this line
+  deleteObject: (zoneName: string, id: string, index: number) => void; // Add this line
   duplicateObject: (zoneName: string, index: number) => void; // Add this line
 };
 
@@ -77,15 +77,16 @@ export const useDroppedObjectsStore = create<DroppedObjectsState>((set) => ({
       };
     }),
 
-  deleteObject: (zoneName: string, index: number) =>
+  deleteObject: (zoneName: string, id: string, index: number) =>
     set((state) => {
       const zone = state.zones[zoneName];
+      console.log("zone: ", zone);
       if (!zone) return state;
       return {
         zones: {
           [zoneName]: {
             ...zone,
-            objects: zone.objects.filter((_, i) => i !== index), // Remove object at the given index
+            objects: zone.objects.filter((obj) => obj.id !== id), // Remove object at the given index
           },
         },
       };