app/src/components/footer/Footer.tsx

@@ -8,7 +8,7 @@ import {
   CurserRightIcon,
 } from "../icons/LogIcons";
 import ShortcutHelper from "./shortcutHelper";
-import { useShortcutStore } from "../../store/store";
+import { useShortcutStore } from "../../store/builder/store";
 import { usePlayButtonStore } from "../../store/usePlayButtonStore";
 
 const Footer: React.FC = () => {

app/src/components/layout/sidebarLeft/Assets.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import Search from "../../ui/inputs/Search";
 import { getCategoryAsset } from "../../../services/factoryBuilder/assest/assets/getCategoryAsset";
 import { fetchAssets } from "../../../services/marketplace/fetchAssets";
-import { useSelectedItem } from "../../../store/store";
+import { useSelectedItem } from "../../../store/builder/store";
 
 // images -------------------
 import vehicle from "../../../assets/image/categories/vehicles.png";

app/src/components/layout/sidebarLeft/visualization/widgets/Widgets.tsx

@@ -2,7 +2,7 @@ import ToggleHeader from "../../../../ui/inputs/ToggleHeader";
 import Widgets2D from "./Widgets2D";
 import Widgets3D from "./Widgets3D";
 import WidgetsFloating from "./WidgetsFloating";
-import { useWidgetSubOption } from "../../../../../store/store";
+import { useWidgetSubOption } from "../../../../../store/builder/store";
 
 const Widgets = () => {
   const { widgetSubOption, setWidgetSubOption } = useWidgetSubOption();

app/src/components/layout/sidebarLeft/visualization/widgets/Widgets3D.tsx

@@ -2,7 +2,7 @@ import widget1 from "../../../../../assets/image/3D/ProductionCapacity.png";
 import widget2 from "../../../../../assets/image/3D/ReturnOfInvestment.png";
 import widget3 from "../../../../../assets/image/3D/StateWorking.png";
 import widget4 from "../../../../../assets/image/3D/Throughput.png";
-import { useAsset3dWidget } from "../../../../../store/store";
+import { useAsset3dWidget } from "../../../../../store/builder/store";
 const Widgets3D = () => {
   const widgets = [
     { name: "Widget 1", img: widget1 },

app/src/components/layout/sidebarRight/Header.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from "react";
 import orgImg from "../../../assets/image/orgTemp.png";
-import { useActiveUsers, useCamMode } from "../../../store/store";
+import { useActiveUsers, useCamMode } from "../../../store/builder/store";
 import { ActiveUser } from "../../../types/users";
 import CollaborationPopup from "../../templates/CollaborationPopup";
 import { getAvatarColor } from "../../../modules/collaboration/functions/getAvatarColor";

app/src/components/layout/sidebarRight/SideBarRight.tsx

@@ -15,7 +15,7 @@ import Analysis from "./analysis/Analysis";
 import Simulations from "./simulation/Simulations";
 import useVersionHistoryStore, {
   useSelectedFloorItem,
-} from "../../../store/store";
+} from "../../../store/builder/store";
 import {
   useSelectedEventData,
   useSelectedEventSphere,

app/src/components/layout/sidebarRight/properties/AssetProperties.tsx

@@ -4,7 +4,7 @@ import InputWithDropDown from "../../../ui/inputs/InputWithDropDown";
 import { RemoveIcon } from "../../../icons/ExportCommonIcons";
 import PositionInput from "../customInput/PositionInputs";
 import RotationInput from "../customInput/RotationInput";
-import { useSelectedFloorItem, useObjectPosition, useObjectRotation } from "../../../../store/store";
+import { useSelectedFloorItem, useObjectPosition, useObjectRotation } from "../../../../store/builder/store";
 
 interface UserData {
   id: number; // Unique identifier for the user data

app/src/components/layout/sidebarRight/properties/GlobalProperties.tsx

@@ -16,7 +16,7 @@ import {
   useTileDistance,
   useToggleView,
   useWallVisibility,
-} from "../../../../store/store";
+} from "../../../../store/builder/store";
 import { setEnvironment } from "../../../../services/factoryBuilder/environment/setEnvironment";
 import * as CONSTANTS from "../../../../types/world/worldConstants";
 import { validateBBox } from "@turf/helpers";

app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx

@@ -7,7 +7,7 @@ import {
   usezonePosition,
   useZones,
   usezoneTarget,
-} from "../../../../store/store";
+} from "../../../../store/builder/store";
 import { zoneCameraUpdate } from "../../../../services/visulization/zone/zoneCameraUpdation";
 
 const ZoneProperties: React.FC = () => {

app/src/components/templates/CollaborationPopup.tsx

@@ -5,7 +5,7 @@ import { AccessOption, User } from "../../types/users";
 import RegularDropDown from "../ui/inputs/RegularDropDown";
 import { access } from "fs";
 import MultiEmailInvite from "../ui/inputs/MultiEmailInvite";
-import { useActiveUsers } from "../../store/store";
+import { useActiveUsers } from "../../store/builder/store";
 
 interface UserListTemplateProps {
   user: User;

app/src/components/templates/FollowPerson.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import RenderOverlay from "./Overlay";
 import { useSelectedUserStore } from "../../store/useCollabStore";
-import { useCamMode } from "../../store/store";
+import { useCamMode } from "../../store/builder/store";
 
 const FollowPerson: React.FC = () => {
   // Get the selected user from the store

app/src/components/ui/ModuleToggle.tsx

@@ -7,7 +7,7 @@ import {
   VisualizationIcon,
 } from "../icons/ExportModuleIcons";
 import useToggleStore from "../../store/useUIToggleStore";
-import useVersionHistoryStore from "../../store/store";
+import useVersionHistoryStore from "../../store/builder/store";
 
 const ModuleToggle: React.FC = () => {
   const { activeModule, setActiveModule } = useModuleStore();

app/src/components/ui/Tools.tsx

@@ -31,7 +31,7 @@ import {
   useToolMode,
   useActiveSubTool,
   useShortcutStore,
-} from "../../store/store";
+} from "../../store/builder/store";
 import useToggleStore from "../../store/useUIToggleStore";
 import {
   use3DWidget,

app/src/components/ui/list/DropDownList.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import List from "./List";
 import { AddIcon, ArrowIcon, FocusIcon } from "../../icons/ExportCommonIcons";
 import KebabMenuListMultiSelect from "./KebebMenuListMultiSelect";
-import { useFloorItems, useZones } from "../../../store/store";
+import { useFloorItems, useZones } from "../../../store/builder/store";
 
 interface DropDownListProps {
   value?: string; // Value to display in the DropDownList

app/src/components/ui/list/List.tsx

@@ -12,7 +12,7 @@ import {
   LockIcon,
   RemoveIcon,
 } from "../../icons/ExportCommonIcons";
-import { useFloorItems, useZoneAssetId, useZones } from "../../../store/store";
+import { useFloorItems, useZoneAssetId, useZones } from "../../../store/builder/store";
 import { zoneCameraUpdate } from "../../../services/visulization/zone/zoneCameraUpdation";
 import { setFloorItemApi } from "../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi";
 

app/src/components/ui/menu/menu.tsx

@@ -2,7 +2,7 @@ import React, { useState } from "react";
 import { useNavigate } from "react-router-dom";
 import { ArrowIcon } from "../../icons/ExportCommonIcons";
 import { toggleTheme } from "../../../utils/theme";
-import useVersionHistoryStore, { useShortcutStore } from "../../../store/store";
+import useVersionHistoryStore, { useShortcutStore } from "../../../store/builder/store";
 import { useSubModuleStore } from "../../../store/useModuleStore";
 
 interface MenuBarProps {

app/src/components/ui/simulation/simulationPlayer.tsx

@@ -1,6 +1,6 @@
 import React, { useState, useRef, useEffect } from "react";
 import { ExitIcon, PlayStopIcon, ResetIcon } from "../../icons/SimulationIcons";
-import { useActiveTool } from "../../../store/store";
+import { useActiveTool } from "../../../store/builder/store";
 import {
   useAnimationPlaySpeed,
   usePauseButtonStore,

app/src/modules/builder/builder.tsx

@@ -24,7 +24,7 @@ import {
     useRefTextUpdate,
     useRenderDistance,
     useLimitDistance,
-} from "../../store/store";
+} from "../../store/builder/store";
 
 //////////  3D Function Imports  //////////
 

app/src/modules/builder/csg/csg.tsx

@@ -1,6 +1,6 @@
 import * as THREE from "three";
 import { Geometry, Base, Subtraction } from "@react-three/csg";
-import { useDeleteTool } from "../../../store/store";
+import { useDeleteTool } from "../../../store/builder/store";
 import { useRef } from "react";
 
 export interface CsgProps {

app/src/modules/builder/geomentries/lines/distanceText/distanceText.tsx

@@ -7,7 +7,7 @@ import {
   useNewLines,
   useRoomsState,
   useToggleView,
-} from "../../../../../store/store";
+} from "../../../../../store/builder/store";
 import objectLinesToArray from "../lineConvertions/objectLinesToArray";
 import { Html } from "@react-three/drei";
 import { Vector2 } from "three";

app/src/modules/builder/geomentries/lines/distanceText/referenceDistanceText.tsx

@@ -1,7 +1,7 @@
 import * as THREE from "three";
 import { Html } from "@react-three/drei";
 import { useState, useEffect } from "react";
-import { useActiveLayer } from "../../../../../store/store";
+import { useActiveLayer } from "../../../../../store/builder/store";
 
 const ReferenceDistanceText = ({ line }: { line: any }) => {
   interface TextState {

app/src/modules/builder/groups/calculateAreaGroup.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from 'react';
-import { useRoomsState, useToggleView } from '../../../store/store';
+import { useRoomsState, useToggleView } from '../../../store/builder/store';
 import { computeArea } from '../functions/computeArea';
 import { Html } from '@react-three/drei';
 import * as CONSTANTS from "../../../types/world/worldConstants";

app/src/modules/builder/groups/floorGroup.tsx

@@ -6,7 +6,7 @@ import {
   useToggleView,
   useWallVisibility,
   useUpdateScene,
-} from "../../../store/store";
+} from "../../../store/builder/store";
 import hideRoof from "../geomentries/roofs/hideRoof";
 import hideWalls from "../geomentries/walls/hideWalls";
 import addAndUpdateReferencePillar from "../geomentries/pillars/addAndUpdateReferencePillar";

app/src/modules/builder/groups/floorGroupAisle.tsx

@@ -2,7 +2,7 @@ import * as THREE from 'three';
 import * as  Types from '../../../types/world/worldTypes';
 import * as CONSTANTS from '../../../types/world/worldConstants';
 import { useThree } from "@react-three/fiber";
-import { useToggleView, useActiveLayer, useSocketStore, useDeletePointOrLine, useUpdateScene, useNewLines, useToolMode } from "../../../store/store";
+import { useToggleView, useActiveLayer, useSocketStore, useDeletePointOrLine, useUpdateScene, useNewLines, useToolMode } from "../../../store/builder/store";
 import { useEffect } from "react";
 import removeSoloPoint from "../geomentries/points/removeSoloPoint";
 import removeReferenceLine from "../geomentries/lines/removeReferenceLine";

app/src/modules/builder/groups/floorItemsGroup.tsx

@@ -11,7 +11,7 @@ import {
     useSelectedItem,
     useSocketStore,
     useToggleView,
-} from "../../../store/store";
+} from "../../../store/builder/store";
 import { useEffect } from "react";
 import * as THREE from "three";
 import * as Types from "../../../types/world/worldTypes";

app/src/modules/builder/groups/floorPlanGroup.tsx

@@ -1,6 +1,6 @@
 import { useEffect } from "react";
 import * as Types from '../../../types/world/worldTypes';
-import { useActiveLayer, useDeletedLines, useDeletePointOrLine, useToolMode, useNewLines, useRemovedLayer, useSocketStore, useToggleView, useUpdateScene } from "../../../store/store";
+import { useActiveLayer, useDeletedLines, useDeletePointOrLine, useToolMode, useNewLines, useRemovedLayer, useSocketStore, useToggleView, useUpdateScene } from "../../../store/builder/store";
 import Layer2DVisibility from "../geomentries/layers/layer2DVisibility";
 import { useFrame, useThree } from "@react-three/fiber";
 import DeletableLineorPoint from "../functions/deletableLineOrPoint";

app/src/modules/builder/groups/wallItemsGroup.tsx

@@ -8,7 +8,7 @@ import {
     useSocketStore,
     useWallItems,
     useSelectedItem,
-} from "../../../store/store";
+} from "../../../store/builder/store";
 import { Csg } from "../csg/csg";
 import * as Types from "../../../types/world/worldTypes";
 import * as CONSTANTS from "../../../types/world/worldConstants";

app/src/modules/builder/groups/wallsAndWallItems.tsx

@@ -5,7 +5,7 @@ import {
     useToggleView,
     useWallItems,
     useWalls,
-} from "../../../store/store";
+} from "../../../store/builder/store";
 import handleMeshDown from "../eventFunctions/handleMeshDown";
 import handleMeshMissed from "../eventFunctions/handleMeshMissed";
 import WallsMesh from "./wallsMesh";

app/src/modules/builder/groups/wallsMesh.tsx

@@ -3,7 +3,7 @@ import * as Types from "../../../types/world/worldTypes";
 import * as CONSTANTS from "../../../types/world/worldConstants";
 import { Base } from "@react-three/csg";
 import { MeshDiscardMaterial } from "@react-three/drei";
-import { useUpdateScene, useWalls } from "../../../store/store";
+import { useUpdateScene, useWalls } from "../../../store/builder/store";
 import React, { useEffect, useState } from "react";
 import { getLines } from "../../../services/factoryBuilder/lines/getLinesApi";
 import objectLinesToArray from "../geomentries/lines/lineConvertions/objectLinesToArray";

app/src/modules/builder/groups/zoneGroup.tsx

@@ -12,7 +12,7 @@ import {
   useRemovedLayer,
   useZones,
   useZonePoints,
-} from "../../../store/store";
+} from "../../../store/builder/store";
 import { getZonesApi } from "../../../services/factoryBuilder/zones/getZonesApi";
 
 import * as CONSTANTS from "../../../types/world/worldConstants";

app/src/modules/collaboration/camera/collabCams.tsx

@@ -4,7 +4,7 @@ import { useFrame } from "@react-three/fiber";
 import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
 import camModel from "../../../assets/gltf-glb/camera face 2.gltf";
 import getActiveUsersData from "../../../services/factoryBuilder/collab/getActiveUsers";
-import { useActiveUsers, useSocketStore } from "../../../store/store";
+import { useActiveUsers, useSocketStore } from "../../../store/builder/store";
 import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader";
 import { useNavigate } from "react-router-dom";
 import { Html } from "@react-three/drei";

app/src/modules/collaboration/camera/collabUserIcon.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import CustomAvatar from "../users/Avatar";
 import { useSelectedUserStore } from "../../../store/useCollabStore";
-import { useCamMode } from "../../../store/store";
+import { useCamMode } from "../../../store/builder/store";
 
 interface CollabUserIconProps {
   userName: string;

app/src/modules/collaboration/collaboration.tsx

@@ -3,7 +3,7 @@ import CamModelsGroup from "./camera/collabCams";
 import { useSelectedUserStore } from "../../store/useCollabStore";
 import { useThree } from "@react-three/fiber";
 import setCameraView from "./functions/setCameraView";
-import { useCamMode } from "../../store/store";
+import { useCamMode } from "../../store/builder/store";
 
 const Collaboration: React.FC = () => {
   const { selectedUser } = useSelectedUserStore();

app/src/modules/collaboration/socket/socketResponses.dev.tsx

@@ -15,7 +15,7 @@ import {
     useNewLines,
     useZonePoints,
     useZones,
-} from "../../../store/store";
+} from "../../../store/builder/store";
 
 import * as Types from "../../../types/world/worldTypes";
 import * as CONSTANTS from "../../../types/world/worldConstants";

app/src/modules/scene/camera/camMode.tsx

@@ -1,7 +1,7 @@
 import { useFrame, useThree } from "@react-three/fiber";
 import React, { useEffect, useState } from "react";
 import * as CONSTANTS from "../../../types/world/worldConstants";
-import { useCamMode, useToggleView } from "../../../store/store";
+import { useCamMode, useToggleView } from "../../../store/builder/store";
 import { useKeyboardControls } from "@react-three/drei";
 import switchToThirdPerson from "./switchToThirdPerson";
 import switchToFirstPerson from "./switchToFirstPerson";

app/src/modules/scene/camera/switchView.tsx

@@ -1,6 +1,6 @@
 import * as THREE from "three";
 import { useEffect, useRef } from "react";
-import { useToggleView } from "../../../store/store";
+import { useToggleView } from "../../../store/builder/store";
 import { useThree } from "@react-three/fiber";
 import { getCamera } from "../../../services/factoryBuilder/camera/getCameraApi";
 import * as CONSTANTS from '../../../types/world/worldConstants';

app/src/modules/scene/controls/controls.tsx

@@ -4,7 +4,7 @@ import { useThree } from "@react-three/fiber";
 import * as THREE from "three";
 import * as CONSTANTS from '../../../types/world/worldConstants';
 
-import { useSocketStore, useToggleView, useResetCamera } from "../../../store/store";
+import { useSocketStore, useToggleView, useResetCamera } from "../../../store/builder/store";
 import { getCamera } from "../../../services/factoryBuilder/camera/getCameraApi";
 import updateCamPosition from "../camera/updateCameraPosition";
 import CamMode from "../camera/camMode";

app/src/modules/scene/controls/selectionControls/boundingBoxHelper.tsx

@@ -1,7 +1,7 @@
 import { Line } from "@react-three/drei";
 import { useMemo } from "react";
 import * as THREE from "three";
-import { useSelectedAssets } from "../../../../store/store";
+import { useSelectedAssets } from "../../../../store/builder/store";
 
 const BoundingBox = ({ boundingBoxRef }: any) => {
     const { selectedAssets } = useSelectedAssets();

app/src/modules/scene/controls/selectionControls/copyPasteControls.tsx

@@ -1,7 +1,7 @@
 import * as THREE from "three";
 import { useEffect, useMemo } from "react";
 import { useFrame, useThree } from "@react-three/fiber";
-import { useFloorItems, useSelectedAssets, useSocketStore, useToggleView } from "../../../../store/store";
+import { useFloorItems, useSelectedAssets, useSocketStore, useToggleView } from "../../../../store/builder/store";
 // import { setFloorItemApi } from '../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi';
 import * as Types from "../../../../types/world/worldTypes";
 import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";

app/src/modules/scene/controls/selectionControls/duplicationControls.tsx

@@ -1,7 +1,7 @@
 import * as THREE from "three";
 import { useEffect, useMemo } from "react";
 import { useFrame, useThree } from "@react-three/fiber";
-import { useFloorItems, useSelectedAssets, useSocketStore, useToggleView } from "../../../../store/store";
+import { useFloorItems, useSelectedAssets, useSocketStore, useToggleView } from "../../../../store/builder/store";
 // import { setFloorItemApi } from '../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi';
 import * as Types from "../../../../types/world/worldTypes";
 import { setFloorItemApi } from "../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi";

app/src/modules/scene/controls/selectionControls/moveControls.tsx

@@ -6,7 +6,7 @@ import {
     useSelectedAssets,
     useSocketStore,
     useToggleView,
-} from "../../../../store/store";
+} from "../../../../store/builder/store";
 // import { setFloorItemApi } from '../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi';
 import * as Types from "../../../../types/world/worldTypes";
 import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";

app/src/modules/scene/controls/selectionControls/rotateControls.tsx

@@ -1,7 +1,7 @@
 import * as THREE from "three";
 import { useEffect, useMemo, useRef } from "react";
 import { useFrame, useThree } from "@react-three/fiber";
-import { useFloorItems, useSelectedAssets, useSocketStore, useToggleView } from "../../../../store/store";
+import { useFloorItems, useSelectedAssets, useSocketStore, useToggleView } from "../../../../store/builder/store";
 // import { setFloorItemApi } from '../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi';
 import * as Types from "../../../../types/world/worldTypes";
 import { useEventsStore } from "../../../../store/simulation/useEventsStore";

app/src/modules/scene/controls/selectionControls/selectionControls.tsx

@@ -3,7 +3,7 @@ import { useEffect, useMemo, useRef, useState } from "react";
 import { SelectionBox } from "three/examples/jsm/interactive/SelectionBox";
 import { SelectionHelper } from "./selectionHelper";
 import { useFrame, useThree } from "@react-three/fiber";
-import { useFloorItems, useSelectedAssets, useSocketStore, useToggleView, } from "../../../../store/store";
+import { useFloorItems, useSelectedAssets, useSocketStore, useToggleView, } from "../../../../store/builder/store";
 import BoundingBox from "./boundingBoxHelper";
 // import { deleteFloorItem } from '../../../../services/factoryBuilder/assest/floorAsset/deleteFloorItemApi';
 import * as Types from "../../../../types/world/worldTypes";

app/src/modules/scene/controls/transformControls/transformControls.tsx

@@ -1,6 +1,6 @@
 import { TransformControls } from "@react-three/drei";
 import * as THREE from "three";
-import { useSelectedFloorItem, useObjectPosition, useObjectRotation, useFloorItems, useActiveTool, useSocketStore } from "../../../../store/store";
+import { useSelectedFloorItem, useObjectPosition, useObjectRotation, useFloorItems, useActiveTool, useSocketStore } from "../../../../store/builder/store";
 import { useThree } from "@react-three/fiber";
 
 import * as Types from '../../../../types/world/worldTypes';

app/src/modules/scene/environment/ground.tsx

@@ -1,4 +1,4 @@
-import { useTileDistance, useToggleView } from "../../../store/store";
+import { useTileDistance, useToggleView } from "../../../store/builder/store";
 import * as CONSTANTS from "../../../types/world/worldConstants";
 
 const Ground = ({ grid, plane }: any) => {

app/src/modules/scene/environment/shadow.tsx

@@ -9,7 +9,7 @@ import {
   useFloorItems,
   useWallItems,
   useTileDistance,
-} from "../../../store/store";
+} from "../../../store/builder/store";
 import * as CONSTANTS from "../../../types/world/worldConstants";
 const shadowWorker = new Worker(
   new URL(

app/src/modules/scene/environment/sky.tsx

@@ -1,6 +1,6 @@
 import * as THREE from 'three';
 import { Sky } from "@react-three/drei";
-import { useAzimuth, useElevation, useSunPosition } from "../../../store/store";
+import { useAzimuth, useElevation, useSunPosition } from "../../../store/builder/store";
 import { useEffect, useRef, useState } from "react";
 import * as CONSTANTS from '../../../types/world/worldConstants';
 

app/src/modules/scene/postProcessing/postProcessing.tsx

@@ -5,7 +5,7 @@ import {
     useDeletableFloorItem,
     useSelectedWallItem,
     useSelectedFloorItem,
-} from "../../../store/store";
+} from "../../../store/builder/store";
 import * as Types from "../../../types/world/worldTypes";
 import * as CONSTANTS from "../../../types/world/worldConstants";
 import { useEffect } from "react";

app/src/modules/scene/tools/measurementTool.tsx

@@ -1,7 +1,7 @@
 import * as THREE from "three";
 import { useEffect, useRef, useState } from "react";
 import { useThree, useFrame } from "@react-three/fiber";
-import { useToolMode } from "../../../store/store";
+import { useToolMode } from "../../../store/builder/store";
 import { Html } from "@react-three/drei";
 
 const MeasurementTool = () => {

app/src/modules/simulation/triggers/connector/triggerConnector.tsx

@@ -9,7 +9,7 @@ import { useSelectedProduct } from "../../../../store/simulation/useSimulationSt
 import { handleAddEventToProduct } from "../../events/points/functions/handleAddEventToProduct";
 import { QuadraticBezierLine } from "@react-three/drei";
 import { upsertProductOrEventApi } from "../../../../services/simulation/UpsertProductOrEventApi";
-import { useDeleteTool } from "../../../../store/store";
+import { useDeleteTool } from "../../../../store/builder/store";
 import { usePlayButtonStore } from "../../../../store/usePlayButtonStore";
 
 interface ConnectionLine {

app/src/modules/simulation/vehicle/instances/instance/vehicleInstance.tsx

@@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useRef, useState } from 'react';
 import VehicleAnimator from '../animator/vehicleAnimator';
 import * as THREE from 'three';
 import { NavMeshQuery } from '@recast-navigation/core';
-import { useNavMesh } from '../../../../../store/store';
+import { useNavMesh } from '../../../../../store/builder/store';
 import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/usePlayButtonStore';
 import { useVehicleStore } from '../../../../../store/simulation/useVehicleStore';
 import { useStorageUnitStore } from '../../../../../store/simulation/useStorageUnitStore';

app/src/modules/simulation/vehicle/navMesh/navMesh.tsx

@@ -1,5 +1,5 @@
 import { useRef } from "react";
-import { useNavMesh } from "../../../../store/store";
+import { useNavMesh } from "../../../../store/builder/store";
 import PolygonGenerator from "./polygonGenerator";
 import NavMeshDetails from "./navMeshDetails";
 import * as CONSTANTS from "../../../../types/world/worldConstants";

app/src/modules/visualization/mqttTemp/drieHtmlTemp.tsx

@@ -1,7 +1,7 @@
 import { Html } from "@react-three/drei";
 import * as THREE from "three";
 import * as Types from "../../../types/world/worldTypes";
-import { useDrieTemp, useDrieUIValue } from "../../../store/store"
+import { useDrieTemp, useDrieUIValue } from "../../../store/builder/store"
 import UI from "./ui";
 import { useEffect } from "react";
 import { useThree } from "@react-three/fiber";

app/src/modules/visualization/socket/realTimeVizSocket.dev.tsx

@@ -1,5 +1,5 @@
 import { useEffect } from "react";
-import { useSocketStore } from "../../../store/store";
+import { useSocketStore } from "../../../store/builder/store";
 import { useSelectedZoneStore } from "../../../store/visualization/useZoneStore";
 import { useDroppedObjectsStore } from "../../../store/visualization/useDroppedObjectsStore";
 import { useZoneWidgetStore } from "../../../store/visualization/useZone3DWidgetStore";

app/src/modules/visualization/template/Templates.tsx

@@ -1,7 +1,7 @@
 import { useEffect } from "react";
 import useTemplateStore from "../../../store/useTemplateStore";
 import { useSelectedZoneStore } from "../../../store/visualization/useZoneStore";
-import { useSocketStore } from "../../../store/store";
+import { useSocketStore } from "../../../store/builder/store";
 import { getTemplateData } from "../../../services/visulization/zone/getTemplate";
 import { useDroppedObjectsStore } from "../../../store/visualization/useDroppedObjectsStore";
 import RenameInput from "../../../components/ui/inputs/RenameInput";

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

@@ -14,7 +14,7 @@ import {
 } from "../../../../components/icons/ExportCommonIcons";
 import { useEffect, useRef, useState } from "react";
 import { useClickOutside } from "../../functions/handleWidgetsOuterClick";
-import { useSocketStore } from "../../../../store/store";
+import { useSocketStore } from "../../../../store/builder/store";
 import { usePlayButtonStore } from "../../../../store/usePlayButtonStore";
 import OuterClick from "../../../../utils/outerClick";
 import useChartStore from "../../../../store/visualization/useChartStore";

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

@@ -5,7 +5,7 @@ import {
   useAsset3dWidget,
   useSocketStore,
   useWidgetSubOption,
-} from "../../../../store/store";
+} from "../../../../store/builder/store";
 import useModuleStore from "../../../../store/useModuleStore";
 import { ThreeState } from "../../../../types/world/worldTypes";
 import { useSelectedZoneStore } from "../../../../store/visualization/useZoneStore";

app/src/modules/visualization/widgets/floating/DroppedFloatingWidgets.tsx

@@ -15,7 +15,7 @@ import TotalCardComponent from "./cards/TotalCardComponent";
 import WarehouseThroughputComponent from "./cards/WarehouseThroughputComponent";
 import FleetEfficiencyComponent from "./cards/FleetEfficiencyComponent";
 import { useWidgetStore } from "../../../../store/useWidgetStore";
-import { useSocketStore } from "../../../../store/store";
+import { useSocketStore } from "../../../../store/builder/store";
 import { usePlayButtonStore } from "../../../../store/usePlayButtonStore";
 import { useSelectedZoneStore } from "../../../../store/visualization/useZoneStore";
 interface DraggingState {

app/src/modules/visualization/widgets/panel/AddButtons.tsx

@@ -5,7 +5,7 @@ import {
   LockIcon,
 } from "../../../../components/icons/RealTimeVisulationIcons";
 import { AddIcon } from "../../../../components/icons/ExportCommonIcons";
-import { useSocketStore } from "../../../../store/store";
+import { useSocketStore } from "../../../../store/builder/store";
 
 // Define the type for `Side`
 type Side = "top" | "bottom" | "left" | "right";

app/src/modules/visualization/widgets/panel/Panel.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useMemo, useRef, useState } from "react";
 
 import { arrayMove } from "@dnd-kit/sortable";
-import { useAsset3dWidget, useSocketStore } from "../../../../store/store";
+import { useAsset3dWidget, useSocketStore } from "../../../../store/builder/store";
 import { usePlayButtonStore } from "../../../../store/usePlayButtonStore";
 import { useWidgetStore } from "../../../../store/useWidgetStore";
 import { DraggableWidget } from "../2d/DraggableWidget";

app/src/modules/visualization/zone/zoneAssets.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useRef } from 'react'
-import { useSelectedFloorItem, useZoneAssetId } from '../../../store/store';
+import { useSelectedFloorItem, useZoneAssetId } from '../../../store/builder/store';
 import * as THREE from "three";
 import { useThree } from '@react-three/fiber';
 import * as Types from "../../../types/world/worldTypes";

app/src/modules/visualization/zone/zoneCameraTarget.tsx

@@ -6,7 +6,7 @@ import {
   useEditPosition,
   usezonePosition,
   usezoneTarget,
-} from "../../../store/store";
+} from "../../../store/builder/store";
 
 export default function ZoneCentreTarget() {
   const { selectedZone } = useSelectedZoneStore();

app/src/pages/Project.tsx

@@ -14,7 +14,7 @@ import {
   useZones,
   useLoadingProgress,
   useWidgetSubOption,
-} from "../store/store";
+} from "../store/builder/store";
 import { useNavigate } from "react-router-dom";
 import { usePlayButtonStore } from "../store/usePlayButtonStore";
 import MarketPlace from "../modules/market/MarketPlace";

app/src/pages/UserAuth.tsx

@@ -6,7 +6,7 @@ import {
   useLoadingProgress,
   useOrganization,
   useUserName,
-} from "../store/store";
+} from "../store/builder/store";
 import { signInApi } from "../services/factoryBuilder/signInSignUp/signInApi";
 import { signUpApi } from "../services/factoryBuilder/signInSignUp/signUpApi";
 

app/src/services/factoryBuilder/mqtt/mqttEvents.ts

@@ -1,6 +1,6 @@
 import React, { useEffect } from "react";
 import mqtt from "mqtt";
-import { useDrieUIValue } from "../../../store/store";
+import { useDrieUIValue } from "../../../store/builder/store";
 
 const MqttEvents = () => {
     const { setTouch, setTemperature, setHumidity } = useDrieUIValue();

app/src/store/builder/store.ts

@@ -1,454 +1,453 @@
-import * as THREE from "three";
+import * as THREE from "three";
-import * as Types from "../types/world/worldTypes";
+import { create } from "zustand";
-import { create } from "zustand";
+import { io } from "socket.io-client";
-import { io } from "socket.io-client";
+
-
+export const useSocketStore = create<any>((set: any, get: any) => ({
-export const useSocketStore = create<any>((set: any, get: any) => ({
+    socket: null,
-    socket: null,
+    initializeSocket: (email: string, organization: string) => {
-    initializeSocket: (email: string, organization: string) => {
+        const existingSocket = get().socket;
-        const existingSocket = get().socket;
+        if (existingSocket) {
-        if (existingSocket) {
+            return;
-            return;
+        }
-        }
+
-
+        const socket = io(
-        const socket = io(
+            `http://${process.env.REACT_APP_SERVER_SOCKET_API_BASE_URL}/Builder`,
-            `http://${process.env.REACT_APP_SERVER_SOCKET_API_BASE_URL}/Builder`,
+            {
-            {
+                reconnection: true,
-                reconnection: true,
+                auth: { email, organization },
-                auth: { email, organization },
+            }
-            }
+        );
-        );
+
-
+        const visualizationSocket = io(
-        const visualizationSocket = io(
+            `http://${process.env.REACT_APP_SERVER_SOCKET_API_BASE_URL}/Visualization`,
-            `http://${process.env.REACT_APP_SERVER_SOCKET_API_BASE_URL}/Visualization`,
+            {
-            {
+                reconnection: true,
-                reconnection: true,
+                auth: { email, organization },
-                auth: { email, organization },
+            }
-            }
+        );
-        );
+
-
+        set({ socket, visualizationSocket });
-        set({ socket, visualizationSocket });
+    },
-    },
+    disconnectSocket: () => {
-    disconnectSocket: () => {
+        set((state: any) => {
-        set((state: any) => {
+            state.socket?.disconnect();
-            state.socket?.disconnect();
+            state.visualizationSocket?.disconnect();
-            state.visualizationSocket?.disconnect();
+            return { socket: null };
-            return { socket: null };
+        });
-        });
+    },
-    },
+}));
-}));
+
-
+export const useLoadingProgress = create<{
-export const useLoadingProgress = create<{
+    loadingProgress: number;
-    loadingProgress: number;
+    setLoadingProgress: (x: number) => void;
-    setLoadingProgress: (x: number) => void;
+}>((set) => ({
-}>((set) => ({
+    loadingProgress: 1,
-    loadingProgress: 1,
+    setLoadingProgress: (x: number) => set({ loadingProgress: x }),
-    setLoadingProgress: (x: number) => set({ loadingProgress: x }),
+}));
-}));
+
-
+export const useOrganization = create<any>((set: any) => ({
-export const useOrganization = create<any>((set: any) => ({
+    organization: "",
-    organization: "",
+    setOrganization: (x: any) => set(() => ({ organization: x })),
-    setOrganization: (x: any) => set(() => ({ organization: x })),
+}));
-}));
+
-
+export const useToggleView = create<any>((set: any) => ({
-export const useToggleView = create<any>((set: any) => ({
+    toggleView: false,
-    toggleView: false,
+    setToggleView: (x: any) => set(() => ({ toggleView: x })),
-    setToggleView: (x: any) => set(() => ({ toggleView: x })),
+}));
-}));
+
-
+export const useUpdateScene = create<any>((set: any) => ({
-export const useUpdateScene = create<any>((set: any) => ({
+    updateScene: false,
-    updateScene: false,
+    setUpdateScene: (x: any) => set(() => ({ updateScene: x })),
-    setUpdateScene: (x: any) => set(() => ({ updateScene: x })),
+}));
-}));
+
-
+export const useWalls = create<any>((set: any) => ({
-export const useWalls = create<any>((set: any) => ({
+    walls: [],
-    walls: [],
+    setWalls: (x: any) => set(() => ({ walls: x })),
-    setWalls: (x: any) => set(() => ({ walls: x })),
+}));
-}));
+
-
+export const useRoomsState = create<any>((set: any) => ({
-export const useRoomsState = create<any>((set: any) => ({
+    roomsState: [],
-    roomsState: [],
+    setRoomsState: (x: any) => set(() => ({ roomsState: x })),
-    setRoomsState: (x: any) => set(() => ({ roomsState: x })),
+}));
-}));
+
-
+export const useZones = create<any>((set: any) => ({
-export const useZones = create<any>((set: any) => ({
+    zones: [],
-    zones: [],
+    setZones: (callback: any) =>
-    setZones: (callback: any) =>
+        set((state: any) => ({
-        set((state: any) => ({
+            zones: typeof callback === "function" ? callback(state.zones) : callback,
-            zones: typeof callback === "function" ? callback(state.zones) : callback,
+        })),
-        })),
+}));
-}));
+
-
+interface ZonePointsState {
-interface ZonePointsState {
+    zonePoints: THREE.Vector3[];
-    zonePoints: THREE.Vector3[];
+    setZonePoints: (points: THREE.Vector3[]) => void;
-    setZonePoints: (points: THREE.Vector3[]) => void;
+}
-}
+
-
+export const useZonePoints = create<ZonePointsState>((set) => ({
-export const useZonePoints = create<ZonePointsState>((set) => ({
+    zonePoints: [],
-    zonePoints: [],
+    setZonePoints: (points) => set({ zonePoints: points }),
-    setZonePoints: (points) => set({ zonePoints: points }),
+}));
-}));
+
-
+export const useSelectedItem = create<any>((set: any) => ({
-export const useSelectedItem = create<any>((set: any) => ({
+    selectedItem: { name: "", id: "", type: undefined, category: '', subCatergory: '' },
-    selectedItem: { name: "", id: "", type: undefined, category: '', subCatergory: '' },
+    setSelectedItem: (x: any) => set(() => ({ selectedItem: x })),
-    setSelectedItem: (x: any) => set(() => ({ selectedItem: x })),
+}));
-}));
+
-
+export const useNavMesh = create<any>((set: any) => ({
-export const useNavMesh = create<any>((set: any) => ({
+    navMesh: null,
-    navMesh: null,
+    setNavMesh: (x: any) => set({ navMesh: x }),
-    setNavMesh: (x: any) => set({ navMesh: x }),
+}));
-}));
+
-
+export const useSelectedAssets = create<any>((set: any) => ({
-export const useSelectedAssets = create<any>((set: any) => ({
+    selectedAssets: [],
-    selectedAssets: [],
+    setSelectedAssets: (x: any) => set(() => ({ selectedAssets: x })),
-    setSelectedAssets: (x: any) => set(() => ({ selectedAssets: x })),
+}));
-}));
+
-
+export const useLayers = create<any>((set: any) => ({
-export const useLayers = create<any>((set: any) => ({
+    Layers: 1,
-    Layers: 1,
+    setLayers: (x: any) => set(() => ({ Layers: x })),
-    setLayers: (x: any) => set(() => ({ Layers: x })),
+}));
-}));
+
-
+export const useCamPosition = create<any>((set: any) => ({
-export const useCamPosition = create<any>((set: any) => ({
+    camPosition: { x: undefined, y: undefined, z: undefined },
-    camPosition: { x: undefined, y: undefined, z: undefined },
+    setCamPosition: (newCamPosition: any) => set({ camPosition: newCamPosition }),
-    setCamPosition: (newCamPosition: any) => set({ camPosition: newCamPosition }),
+}));
-}));
+
-
+export const useMenuVisible = create<any>((set: any) => ({
-export const useMenuVisible = create<any>((set: any) => ({
+    menuVisible: false,
-    menuVisible: false,
+    setMenuVisible: (x: any) => set(() => ({ menuVisible: x })),
-    setMenuVisible: (x: any) => set(() => ({ menuVisible: x })),
+}));
-}));
+
-
+export const useDeleteTool = create<any>((set: any) => ({
-export const useDeleteTool = create<any>((set: any) => ({
+    deleteTool: false,
-    deleteTool: false,
+    setDeleteTool: (x: any) => set(() => ({ deleteTool: x })),
-    setDeleteTool: (x: any) => set(() => ({ deleteTool: x })),
+}));
-}));
+
-
+export const useToolMode = create<any>((set: any) => ({
-export const useToolMode = create<any>((set: any) => ({
+    toolMode: null,
-    toolMode: null,
+    setToolMode: (x: any) => set(() => ({ toolMode: x })),
-    setToolMode: (x: any) => set(() => ({ toolMode: x })),
+}));
-}));
+
-
+export const useNewLines = create<any>((set: any) => ({
-export const useNewLines = create<any>((set: any) => ({
+    newLines: [],
-    newLines: [],
+    setNewLines: (x: any) => set(() => ({ newLines: x })),
-    setNewLines: (x: any) => set(() => ({ newLines: x })),
+}));
-}));
+
-
+export const useDeletedLines = create<any>((set: any) => ({
-export const useDeletedLines = create<any>((set: any) => ({
+    deletedLines: [],
-    deletedLines: [],
+    setDeletedLines: (x: any) => set(() => ({ deletedLines: x })),
-    setDeletedLines: (x: any) => set(() => ({ deletedLines: x })),
+}));
-}));
+
-
+export const useMovePoint = create<any>((set: any) => ({
-export const useMovePoint = create<any>((set: any) => ({
+    movePoint: false,
-    movePoint: false,
+    setMovePoint: (x: any) => set(() => ({ movePoint: x })),
-    setMovePoint: (x: any) => set(() => ({ movePoint: x })),
+}));
-}));
+
-
+export const useDeletePointOrLine = create<any>((set: any) => ({
-export const useDeletePointOrLine = create<any>((set: any) => ({
+    deletePointOrLine: false,
-    deletePointOrLine: false,
+    setDeletePointOrLine: (x: any) => set(() => ({ deletePointOrLine: x })),
-    setDeletePointOrLine: (x: any) => set(() => ({ deletePointOrLine: x })),
+}));
-}));
+
-
+export const useFloorItems = create<any>((set: any) => ({
-export const useFloorItems = create<any>((set: any) => ({
+    floorItems: null,
-    floorItems: null,
+    setFloorItems: (callback: any) =>
-    setFloorItems: (callback: any) =>
+        set((state: any) => ({
-        set((state: any) => ({
+            floorItems:
-            floorItems:
+                typeof callback === "function" ? callback(state.floorItems) : callback,
-                typeof callback === "function" ? callback(state.floorItems) : callback,
+        })),
-        })),
+}));
-}));
+
-
+export const useWallItems = create<any>((set: any) => ({
-export const useWallItems = create<any>((set: any) => ({
+    wallItems: [],
-    wallItems: [],
+    setWallItems: (callback: any) =>
-    setWallItems: (callback: any) =>
+        set((state: any) => ({
-        set((state: any) => ({
+            wallItems:
-            wallItems:
+                typeof callback === "function" ? callback(state.wallItems) : callback,
-                typeof callback === "function" ? callback(state.wallItems) : callback,
+        })),
-        })),
+}));
-}));
+
-
+export const useSelectedWallItem = create<any>((set: any) => ({
-export const useSelectedWallItem = create<any>((set: any) => ({
+    selectedWallItem: null,
-    selectedWallItem: null,
+    setSelectedWallItem: (x: any) => set(() => ({ selectedWallItem: x })),
-    setSelectedWallItem: (x: any) => set(() => ({ selectedWallItem: x })),
+}));
-}));
+
-
+export const useSelectedFloorItem = create<any>((set: any) => ({
-export const useSelectedFloorItem = create<any>((set: any) => ({
+    selectedFloorItem: null,
-    selectedFloorItem: null,
+    setSelectedFloorItem: (x: any) => set(() => ({ selectedFloorItem: x })),
-    setSelectedFloorItem: (x: any) => set(() => ({ selectedFloorItem: x })),
+}));
-}));
+
-
+export const useDeletableFloorItem = create<any>((set: any) => ({
-export const useDeletableFloorItem = create<any>((set: any) => ({
+    deletableFloorItem: null,
-    deletableFloorItem: null,
+    setDeletableFloorItem: (x: any) => set(() => ({ deletableFloorItem: x })),
-    setDeletableFloorItem: (x: any) => set(() => ({ deletableFloorItem: x })),
+}));
-}));
+
-
+export const useSetScale = create<any>((set: any) => ({
-export const useSetScale = create<any>((set: any) => ({
+    scale: null,
-    scale: null,
+    setScale: (x: any) => set(() => ({ scale: x })),
-    setScale: (x: any) => set(() => ({ scale: x })),
+}));
-}));
+
-
+export const useRoofVisibility = create<any>((set: any) => ({
-export const useRoofVisibility = create<any>((set: any) => ({
+    roofVisibility: false,
-    roofVisibility: false,
+    setRoofVisibility: (x: any) => set(() => ({ roofVisibility: x })),
-    setRoofVisibility: (x: any) => set(() => ({ roofVisibility: x })),
+}));
-}));
+
-
+export const useWallVisibility = create<any>((set: any) => ({
-export const useWallVisibility = create<any>((set: any) => ({
+    wallVisibility: false,
-    wallVisibility: false,
+    setWallVisibility: (x: any) => set(() => ({ wallVisibility: x })),
-    setWallVisibility: (x: any) => set(() => ({ wallVisibility: x })),
+}));
-}));
+
-
+export const useShadows = create<any>((set: any) => ({
-export const useShadows = create<any>((set: any) => ({
+    shadows: false,
-    shadows: false,
+    setShadows: (x: any) => set(() => ({ shadows: x })),
-    setShadows: (x: any) => set(() => ({ shadows: x })),
+}));
-}));
+
-
+export const useSunPosition = create<any>((set: any) => ({
-export const useSunPosition = create<any>((set: any) => ({
+    sunPosition: { x: undefined, y: undefined, z: undefined },
-    sunPosition: { x: undefined, y: undefined, z: undefined },
+    setSunPosition: (newSuntPosition: any) =>
-    setSunPosition: (newSuntPosition: any) =>
+        set({ sunPosition: newSuntPosition }),
-        set({ sunPosition: newSuntPosition }),
+}));
-}));
+
-
+export const useRemoveLayer = create<any>((set: any) => ({
-export const useRemoveLayer = create<any>((set: any) => ({
+    removeLayer: false,
-    removeLayer: false,
+    setRemoveLayer: (x: any) => set(() => ({ removeLayer: x })),
-    setRemoveLayer: (x: any) => set(() => ({ removeLayer: x })),
+}));
-}));
+
-
+export const useRemovedLayer = create<any>((set: any) => ({
-export const useRemovedLayer = create<any>((set: any) => ({
+    removedLayer: null,
-    removedLayer: null,
+    setRemovedLayer: (x: any) => set(() => ({ removedLayer: x })),
-    setRemovedLayer: (x: any) => set(() => ({ removedLayer: x })),
+}));
-}));
+
-
+export const useActiveLayer = create<any>((set: any) => ({
-export const useActiveLayer = create<any>((set: any) => ({
+    activeLayer: 1,
-    activeLayer: 1,
+    setActiveLayer: (x: any) => set({ activeLayer: x }),
-    setActiveLayer: (x: any) => set({ activeLayer: x }),
+}));
-}));
+
-
+interface RefTextUpdateState {
-interface RefTextUpdateState {
+    refTextupdate: number;
-    refTextupdate: number;
+    setRefTextUpdate: (
-    setRefTextUpdate: (
+        callback: (currentValue: number) => number | number
-        callback: (currentValue: number) => number | number
+    ) => void;
-    ) => void;
+}
-}
+
-
+export const useRefTextUpdate = create<RefTextUpdateState>((set) => ({
-export const useRefTextUpdate = create<RefTextUpdateState>((set) => ({
+    refTextupdate: -1000,
-    refTextupdate: -1000,
+    setRefTextUpdate: (callback) =>
-    setRefTextUpdate: (callback) =>
+        set((state) => ({
-        set((state) => ({
+            refTextupdate:
-            refTextupdate:
+                typeof callback === "function"
-                typeof callback === "function"
+                    ? callback(state.refTextupdate)
-                    ? callback(state.refTextupdate)
+                    : callback,
-                    : callback,
+        })),
-        })),
+}));
-}));
+
-
+export const useResetCamera = create<any>((set: any) => ({
-export const useResetCamera = create<any>((set: any) => ({
+    resetCamera: false,
-    resetCamera: false,
+    setResetCamera: (x: any) => set({ resetCamera: x }),
-    setResetCamera: (x: any) => set({ resetCamera: x }),
+}));
-}));
+
-
+export const useAddAction = create<any>((set: any) => ({
-export const useAddAction = create<any>((set: any) => ({
+    addAction: null,
-    addAction: null,
+    setAddAction: (x: any) => set({ addAction: x }),
-    setAddAction: (x: any) => set({ addAction: x }),
+}));
-}));
+
-
+export const useActiveTool = create<any>((set: any) => ({
-export const useActiveTool = create<any>((set: any) => ({
+    activeTool: "cursor",
-    activeTool: "cursor",
+    setActiveTool: (x: any) => set({ activeTool: x }),
-    setActiveTool: (x: any) => set({ activeTool: x }),
+}));
-}));
+
-
+export const useActiveSubTool = create<any>((set: any) => ({
-export const useActiveSubTool = create<any>((set: any) => ({
+    activeSubTool: "cursor",
-    activeSubTool: "cursor",
+    setActiveSubTool: (x: any) => set({ activeSubTool: x }),
-    setActiveSubTool: (x: any) => set({ activeSubTool: x }),
+}));
-}));
+
-
+export const use2DUndoRedo = create<any>((set: any) => ({
-export const use2DUndoRedo = create<any>((set: any) => ({
+    is2DUndoRedo: null,
-    is2DUndoRedo: null,
+    set2DUndoRedo: (x: any) => set({ is2DUndoRedo: x }),
-    set2DUndoRedo: (x: any) => set({ is2DUndoRedo: x }),
+}));
-}));
+
-
+export const useElevation = create<any>((set: any) => ({
-export const useElevation = create<any>((set: any) => ({
+    elevation: 45,
-    elevation: 45,
+    setElevation: (x: any) => set({ elevation: x }),
-    setElevation: (x: any) => set({ elevation: x }),
+}));
-}));
+
-
+export const useAzimuth = create<any>((set: any) => ({
-export const useAzimuth = create<any>((set: any) => ({
+    azimuth: -160,
-    azimuth: -160,
+    setAzimuth: (x: any) => set({ azimuth: x }),
-    setAzimuth: (x: any) => set({ azimuth: x }),
+}));
-}));
+
-
+export const useRenderDistance = create<any>((set: any) => ({
-export const useRenderDistance = create<any>((set: any) => ({
+    renderDistance: 40,
-    renderDistance: 40,
+    setRenderDistance: (x: any) => set({ renderDistance: x }),
-    setRenderDistance: (x: any) => set({ renderDistance: x }),
+}));
-}));
+
-
+export const useCamMode = create<any>((set: any) => ({
-export const useCamMode = create<any>((set: any) => ({
+    camMode: "ThirdPerson",
-    camMode: "ThirdPerson",
+    setCamMode: (x: any) => set({ camMode: x }),
-    setCamMode: (x: any) => set({ camMode: x }),
+}));
-}));
+
-
+export const useUserName = create<any>((set: any) => ({
-export const useUserName = create<any>((set: any) => ({
+    userName: "",
-    userName: "",
+    setUserName: (x: any) => set({ userName: x }),
-    setUserName: (x: any) => set({ userName: x }),
+}));
-}));
+
-
+export const useObjectPosition = create<any>((set: any) => ({
-export const useObjectPosition = create<any>((set: any) => ({
+    objectPosition: { x: undefined, y: undefined, z: undefined },
-    objectPosition: { x: undefined, y: undefined, z: undefined },
+    setObjectPosition: (newObjectPosition: any) =>
-    setObjectPosition: (newObjectPosition: any) =>
+        set({ objectPosition: newObjectPosition }),
-        set({ objectPosition: newObjectPosition }),
+}));
-}));
+
-
+export const useObjectRotation = create<any>((set: any) => ({
-export const useObjectRotation = create<any>((set: any) => ({
+    objectRotation: { x: undefined, y: undefined, z: undefined },
-    objectRotation: { x: undefined, y: undefined, z: undefined },
+    setObjectRotation: (newObjectRotation: any) =>
-    setObjectRotation: (newObjectRotation: any) =>
+        set({ objectRotation: newObjectRotation }),
-        set({ objectRotation: newObjectRotation }),
+}));
-}));
+
-
+export const useDrieTemp = create<any>((set: any) => ({
-export const useDrieTemp = create<any>((set: any) => ({
+    drieTemp: undefined,
-    drieTemp: undefined,
+    setDrieTemp: (x: any) => set({ drieTemp: x }),
-    setDrieTemp: (x: any) => set({ drieTemp: x }),
+}));
-}));
+
-
+export const useActiveUsers = create<any>((set: any) => ({
-export const useActiveUsers = create<any>((set: any) => ({
+    activeUsers: [],
-    activeUsers: [],
+    setActiveUsers: (callback: (prev: any[]) => any[] | any[]) =>
-    setActiveUsers: (callback: (prev: any[]) => any[] | any[]) =>
+        set((state: { activeUsers: any[] }) => ({
-        set((state: { activeUsers: any[] }) => ({
+            activeUsers:
-            activeUsers:
+                typeof callback === "function" ? callback(state.activeUsers) : callback,
-                typeof callback === "function" ? callback(state.activeUsers) : callback,
+        })),
-        })),
+}));
-}));
+
-
+export const useDrieUIValue = create<any>((set: any) => ({
-export const useDrieUIValue = create<any>((set: any) => ({
+    drieUIValue: { touch: null, temperature: null, humidity: null },
-    drieUIValue: { touch: null, temperature: null, humidity: null },
+
-
+    setDrieUIValue: (x: any) =>
-    setDrieUIValue: (x: any) =>
+        set((state: any) => ({ drieUIValue: { ...state.drieUIValue, ...x } })),
-        set((state: any) => ({ drieUIValue: { ...state.drieUIValue, ...x } })),
+
-
+    setTouch: (value: any) =>
-    setTouch: (value: any) =>
+        set((state: any) => ({
-        set((state: any) => ({
+            drieUIValue: { ...state.drieUIValue, touch: value },
-            drieUIValue: { ...state.drieUIValue, touch: value },
+        })),
-        })),
+    setTemperature: (value: any) =>
-    setTemperature: (value: any) =>
+        set((state: any) => ({
-        set((state: any) => ({
+            drieUIValue: { ...state.drieUIValue, temperature: value },
-            drieUIValue: { ...state.drieUIValue, temperature: value },
+        })),
-        })),
+    setHumidity: (value: any) =>
-    setHumidity: (value: any) =>
+        set((state: any) => ({
-        set((state: any) => ({
+            drieUIValue: { ...state.drieUIValue, humidity: value },
-            drieUIValue: { ...state.drieUIValue, humidity: value },
+        })),
-        })),
+}));
-}));
+
-
+export const useStartSimulation = create<any>((set: any) => ({
-export const useStartSimulation = create<any>((set: any) => ({
+    startSimulation: false,
-    startSimulation: false,
+    setStartSimulation: (x: any) => set({ startSimulation: x }),
-    setStartSimulation: (x: any) => set({ startSimulation: x }),
+}));
-}));
+
-
+export const useEyeDropMode = create<any>((set: any) => ({
-export const useEyeDropMode = create<any>((set: any) => ({
+    eyeDropMode: false,
-    eyeDropMode: false,
+    setEyeDropMode: (x: any) => set({ eyeDropMode: x }),
-    setEyeDropMode: (x: any) => set({ eyeDropMode: x }),
+}));
-}));
+
-
+export const useEditingPoint = create<any>((set: any) => ({
-export const useEditingPoint = create<any>((set: any) => ({
+    editingPoint: false,
-    editingPoint: false,
+    setEditingPoint: (x: any) => set({ editingPoint: x }),
-    setEditingPoint: (x: any) => set({ editingPoint: x }),
+}));
-}));
+
-
+export const usezoneTarget = create<any>((set: any) => ({
-export const usezoneTarget = create<any>((set: any) => ({
+    zoneTarget: [],
-    zoneTarget: [],
+    setZoneTarget: (x: any) => set({ zoneTarget: x }),
-    setZoneTarget: (x: any) => set({ zoneTarget: x }),
+}));
-}));
+
-
+export const usezonePosition = create<any>((set: any) => ({
-export const usezonePosition = create<any>((set: any) => ({
+    zonePosition: [],
-    zonePosition: [],
+    setZonePosition: (x: any) => set({ zonePosition: x }),
-    setZonePosition: (x: any) => set({ zonePosition: x }),
+}));
-}));
+
-
+interface EditPositionState {
-interface EditPositionState {
+    Edit: boolean;
-    Edit: boolean;
+    setEdit: (value: boolean) => void;
-    setEdit: (value: boolean) => void;
+}
-}
+
-
+export const useEditPosition = create<EditPositionState>((set) => ({
-export const useEditPosition = create<EditPositionState>((set) => ({
+    Edit: false,
-    Edit: false,
+    setEdit: (value) => set({ Edit: value }),
-    setEdit: (value) => set({ Edit: value }),
+}));
-}));
+
-
+export const useAsset3dWidget = create<any>((set: any) => ({
-export const useAsset3dWidget = create<any>((set: any) => ({
+    widgetSelect: "",
-    widgetSelect: "",
+    setWidgetSelect: (x: any) => set({ widgetSelect: x }),
-    setWidgetSelect: (x: any) => set({ widgetSelect: x }),
+}));
-}));
+
-
+export const useWidgetSubOption = create<any>((set: any) => ({
-export const useWidgetSubOption = create<any>((set: any) => ({
+    widgetSubOption: "2D",
-    widgetSubOption: "2D",
+    setWidgetSubOption: (x: any) => set({ widgetSubOption: x }),
-    setWidgetSubOption: (x: any) => set({ widgetSubOption: x }),
+}));
-}));
+export const useLimitDistance = create<any>((set: any) => ({
-export const useLimitDistance = create<any>((set: any) => ({
+    limitDistance: true,
-    limitDistance: true,
+    setLimitDistance: (x: any) => set({ limitDistance: x }),
-    setLimitDistance: (x: any) => set({ limitDistance: x }),
+}));
-}));
+
-
+export const useTileDistance = create<any>((set: any) => ({
-export const useTileDistance = create<any>((set: any) => ({
+    gridValue: { size: 300, divisions: 75 },
-    gridValue: { size: 300, divisions: 75 },
+    planeValue: { height: 300, width: 300 },
-    planeValue: { height: 300, width: 300 },
+
-
+    setGridValue: (value: any) =>
-    setGridValue: (value: any) =>
+        set((state: any) => ({
-        set((state: any) => ({
+            gridValue: { ...state.gridValue, ...value },
-            gridValue: { ...state.gridValue, ...value },
+        })),
-        })),
+
-
+    setPlaneValue: (value: any) =>
-    setPlaneValue: (value: any) =>
+        set((state: any) => ({
-        set((state: any) => ({
+            planeValue: { ...state.planeValue, ...value },
-            planeValue: { ...state.planeValue, ...value },
+        })),
-        })),
+}));
-}));
+
-
+export const usePlayAgv = create<any>((set, get) => ({
-export const usePlayAgv = create<any>((set, get) => ({
+    PlayAgv: [],
-    PlayAgv: [],
+    setPlayAgv: (updateFn: (prev: any[]) => any[]) =>
-    setPlayAgv: (updateFn: (prev: any[]) => any[]) =>
+        set({ PlayAgv: updateFn(get().PlayAgv) }),
-        set({ PlayAgv: updateFn(get().PlayAgv) }),
+}));
-}));
+
-
+// Define the Asset type
-// Define the Asset type
+type Asset = {
-type Asset = {
+    id: string;
-    id: string;
+    name: string;
-    name: string;
+    position?: [number, number, number]; // Optional: 3D position
-    position?: [number, number, number]; // Optional: 3D position
+    rotation?: { x: number; y: number; z: number }; // Optional: Euler rotation
-    rotation?: { x: number; y: number; z: number }; // Optional: Euler rotation
+};
-};
+
-
+// Zustand store type
-// Zustand store type
+type ZoneAssetState = {
-type ZoneAssetState = {
+    zoneAssetId: Asset | null;
-    zoneAssetId: Asset | null;
+    setZoneAssetId: (asset: Asset | null) => void;
-    setZoneAssetId: (asset: Asset | null) => void;
+};
-};
+
-
+// Zustand store
-// Zustand store
+export const useZoneAssetId = create<ZoneAssetState>((set) => ({
-export const useZoneAssetId = create<ZoneAssetState>((set) => ({
+    zoneAssetId: null,
-    zoneAssetId: null,
+    setZoneAssetId: (asset) => set({ zoneAssetId: asset }),
-    setZoneAssetId: (asset) => set({ zoneAssetId: asset }),
+}));
-}));
+
-
+// version visible hidden
-// version visible hidden
+interface VersionHistoryState {
-interface VersionHistoryState {
+  viewVersionHistory: boolean;
-  viewVersionHistory: boolean;
+  setVersionHistory: (value: boolean) => void;
-  setVersionHistory: (value: boolean) => void;
+}
-}
+
-
+const useVersionHistoryStore = create<VersionHistoryState>((set) => ({
-const useVersionHistoryStore = create<VersionHistoryState>((set) => ({
+  viewVersionHistory: false,
-  viewVersionHistory: false,
+  setVersionHistory: (value) => set({ viewVersionHistory: value }),
-  setVersionHistory: (value) => set({ viewVersionHistory: value }),
+}));
-}));
+
-
+export default useVersionHistoryStore;
-export default useVersionHistoryStore;
+
-
+interface ShortcutStore {
-interface ShortcutStore {
+  showShortcuts: boolean;
-  showShortcuts: boolean;
+  setShowShortcuts: (value: boolean) => void;
-  setShowShortcuts: (value: boolean) => void;
+  toggleShortcuts: () => void;
-  toggleShortcuts: () => void;
+}
-}
+
-
+export const useShortcutStore = create<ShortcutStore>((set) => ({
-export const useShortcutStore = create<ShortcutStore>((set) => ({
+  showShortcuts: false,
-  showShortcuts: false,
+  setShowShortcuts: (value) => set({ showShortcuts: value }),
-  setShowShortcuts: (value) => set({ showShortcuts: value }),
+  toggleShortcuts: () =>
-  toggleShortcuts: () =>
+    set((state) => ({ showShortcuts: !state.showShortcuts })),
-    set((state) => ({ showShortcuts: !state.showShortcuts })),
 }));

app/src/store/visualization/useDroppedObjectsStore.ts

@@ -1,5 +1,5 @@
 import { create } from "zustand";
-import { useSocketStore } from "../store";
+import { useSocketStore } from "../builder/store";
 import useChartStore from "./useChartStore";
 
 type DroppedObject = {

app/src/utils/shortcutkeys/handleShortcutKeys.ts

@@ -10,7 +10,7 @@ import {
     useShortcutStore,
     useToggleView,
     useToolMode,
-} from "../../store/store";
+} from "../../store/builder/store";
 import { usePlayButtonStore } from "../../store/usePlayButtonStore";
 import { detectModifierKeys } from "./detectModifierKeys";
 import { useSelectedZoneStore } from "../../store/visualization/useZoneStore";