added pannel hide and EditWidgetOption component

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

@@ -18,6 +18,9 @@ import { getZone2dData } from "../../../services/realTimeVisulization/zoneData/g
 import { generateUniqueId } from "../../../functions/generateUniqueId";
 import { determinePosition } from "./functions/determinePosition";
 import { addingFloatingWidgets } from "../../../services/realTimeVisulization/zoneData/addFloatingWidgets";
+import EditWidgetOption from "../menu/EditWidgetOption";
+import RenderOverlay from "../../templates/Overlay";
+import ConfirmationPopup from "../../layout/confirmationPopup/ConfirmationPopup";
 
 type Side = "top" | "bottom" | "left" | "right";
 
@@ -51,6 +54,9 @@ const RealTimeVisulization: React.FC = () => {
   const [zonesData, setZonesData] = useState<FormattedZoneData>({});
   const { selectedZone, setSelectedZone } = useSelectedZoneStore();
   const { zones } = useZones();
+
+  const [openConfirmationPopup, setOpenConfirmationPopup] = useState(false);
+
   const [floatingWidgets, setFloatingWidgets] = useState<
     Record<string, { zoneName: string; zoneId: string; objects: any[] }>
   >({});
@@ -63,6 +69,7 @@ const RealTimeVisulization: React.FC = () => {
       const organization = email?.split("@")[1]?.split(".")[0];
       try {
         const response = await getZone2dData(organization);
+        // console.log('response: ', response);
 
         if (!Array.isArray(response)) {
           return;
@@ -184,6 +191,20 @@ const RealTimeVisulization: React.FC = () => {
         left: isPlaying || activeModule !== "visualization" ? "0%" : "",
       }}
     >
+      {/* <RenderOverlay>
+        <EditWidgetOption
+          options={["Dublicate", "Vertical Move", "Horizontal Move", "Delete"]}
+        />
+      </RenderOverlay> */}
+      {openConfirmationPopup && (
+        <RenderOverlay>
+          <ConfirmationPopup
+            message={"Are you sure want to delete?"}
+            onConfirm={() => console.log("confirm")}
+            onCancel={() => setOpenConfirmationPopup(false)}
+          />
+        </RenderOverlay>
+      )}
       <div
         className="scene-container"
         style={{
@@ -195,7 +216,7 @@ const RealTimeVisulization: React.FC = () => {
         onDrop={(event) => handleDrop(event)}
         onDragOver={(event) => event.preventDefault()}
       >
-        <Scene />
+        {/* <Scene /> */}
       </div>
       {activeModule === "visualization" && selectedZone.zoneName !== "" && (
         <DroppedObjects />