Dwinzo_dev/app/src/pages/Project.tsx

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 SimulationUI from "../modules/simulation/simulationUI";

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("/");
    }
  }, [])

  return (
    <div className="project-main">
      <ModuleToggle />
      <SideBarLeft />
      <SideBarRight />
      {activeModule === "visualization" && <RealTimeVisulization />}
      <Tools />
      <Scene />
      <SimulationUI />
    </div>
  );
};

export default Project;