updated ui

app/src/pages/Project.tsx

@@ -1,21 +1,62 @@
-import React from "react";
+import React, { useEffect } from "react";
 import ModuleToggle from "../components/ui/ModuleToggle";
 import SideBarLeft from "../components/layout/sidebarLeft/SideBarLeft";
 import SideBarRight from "../components/layout/sidebarRight/SideBarRight";
 import useModuleStore from "../store/useModuleStore";
 import RealTimeVisulization from "../components/ui/componets/RealTimeVisulization";
 import Tools from "../components/ui/Tools";
+import Scene from "../modules/scene/scene";
+import {
+  useSocketStore,
+  useFloorItems,
+  useOrganization,
+  useUserName,
+  useWallItems,
+  useZones,
+} from "../store/store";
+import { useNavigate } from "react-router-dom";
+import { usePlayButtonStore } from "../store/usePlayButtonStore";
 
 const Project: React.FC = () => {
+  let navigate = useNavigate();
   const { activeModule } = useModuleStore();
 
+  const { userName, setUserName } = useUserName();
+  const { organization, setOrganization } = useOrganization();
+  const { setFloorItems } = useFloorItems();
+  const { setWallItems } = useWallItems();
+  const { setZones } = useZones();
+
+  useEffect(() => {
+    setFloorItems([]);
+    setWallItems([]);
+    setZones([]);
+    const email = localStorage.getItem("email");
+    if (email) {
+      useSocketStore.getState().initializeSocket(email);
+      const Organization = email!.split("@")[1].split(".")[0];
+      const name = localStorage.getItem("userName");
+      if (Organization && name) {
+        setOrganization(Organization);
+        setUserName(name);
+      }
+    } else {
+      navigate("/");
+    }
+  }, []);
+  const { isPlaying } = usePlayButtonStore();
+
   return (
     <div className="project-main">
       <ModuleToggle />
-      <SideBarLeft />
-      <SideBarRight />
+
+      {!isPlaying && <SideBarLeft />}
+      {!isPlaying && <SideBarRight />}
       {activeModule === "visualization" && <RealTimeVisulization />}
+      {activeModule !== "visualization" && <Scene />}
       <Tools />
+
+      {/* <Scene /> */}
     </div>
   );
 };