From 64e730efa63b4c02a82f07547efe9a58ee968e08 Mon Sep 17 00:00:00 2001 From: Gomathi9520 Date: Thu, 4 Sep 2025 16:06:54 +0530 Subject: [PATCH 01/19] added heatmap --- app/src/components/HeatMap/HeatMap.tsx | 203 ++++++++++++++++++++++ app/src/modules/simulation/simulation.tsx | 3 + 2 files changed, 206 insertions(+) create mode 100644 app/src/components/HeatMap/HeatMap.tsx diff --git a/app/src/components/HeatMap/HeatMap.tsx b/app/src/components/HeatMap/HeatMap.tsx new file mode 100644 index 0000000..e2c7c74 --- /dev/null +++ b/app/src/components/HeatMap/HeatMap.tsx @@ -0,0 +1,203 @@ +import * as THREE from "three"; +import { useEffect, useMemo, useRef, useState } from "react"; +import { useFrame, useThree } from "@react-three/fiber"; +import { useProductContext } from "../../modules/simulation/products/productContext"; +import { useSceneContext } from "../../modules/scene/sceneContext"; +import * as CONSTANTS from "../../types/world/worldConstants"; +import { determineExecutionMachineSequences } from "../../modules/simulation/simulator/functions/determineExecutionMachineSequences"; + +const MAX_POINTS = 100; + +const HeatMap = () => { + const isUsingBBOX = false; + const height = CONSTANTS.gridConfig.size; + const width = CONSTANTS.gridConfig.size; + const radius = 0.005; + const opacity = 0.8; const debugMode: "solid" | "grayscale" | "normal" = "normal"; + const debugModeMap = { solid: 0, grayscale: 1, normal: 2, } as const; + const { productStore } = useSceneContext(); + const { getProductById, products } = productStore(); + const { selectedProductStore } = useProductContext(); + const { selectedProduct } = selectedProductStore(); + const { scene } = useThree(); + const [events, setEvents] = useState([]); + const [points, setPoints] = useState<{ x: number; y: number; value: number; }[]>([]); + const materialRef = useRef(null); + const uniformsRef = useRef({ + u_points: { value: null as THREE.DataTexture | null }, + u_count: { value: 0 }, + u_radius: { value: radius }, + u_opacity: { value: opacity }, + u_debugMode: { value: debugModeMap[debugMode] }, + }); + + useEffect(() => { + const selectedProductData = getProductById(selectedProduct.productUuid); + const events: EventsSchema[] = []; + + if (selectedProductData) { + determineExecutionMachineSequences([selectedProductData]).then( + (sequences) => { + sequences.forEach((sequence) => { + sequence.forEach((event) => { + if (event.type === 'human' || event.type === 'vehicle') { + events.push(event); + } + }) + }); + setEvents(events); + } + ); + } + }, [selectedProduct, products]) + + useFrame(() => { + if (!materialRef.current || !scene) return; + + const heatmapPoints: { x: number; y: number; value: number }[] = []; + + events.forEach((event) => { + const model = scene.getObjectByProperty('uuid', event.modelUuid) as THREE.Object3D; + if (!model) return; + + if (isUsingBBOX) { + const box = new THREE.Box3().setFromObject(model); + + const { min, max } = box; + + const corners = [ + new THREE.Vector3(min.x, 0, min.z), + new THREE.Vector3(min.x, 0, max.z), + new THREE.Vector3(max.x, 0, min.z), + new THREE.Vector3(max.x, 0, max.z), + ]; + + corners.forEach((corner) => { + heatmapPoints.push({ + x: corner.x, + y: corner.z, + value: 1.0, + }); + }); + } else { + heatmapPoints.push({ + x: model.position.x, + y: model.position.z, + value: 1.0, + }); + } + }); + + setPoints(heatmapPoints); + }); + + const pointTexture = useMemo(() => { + if (points.length === 0) return null; + const data = new Float32Array(MAX_POINTS * 4); + + points.forEach((p, i) => { + const index = i * 4; + data[index] = (p.x + width / 2) / width; + data[index + 1] = (p.y + height / 2) / height; + data[index + 2] = p.value; + data[index + 3] = 0.0; + }); + + const texture = new THREE.DataTexture(data, MAX_POINTS, 1, THREE.RGBAFormat, THREE.FloatType); + texture.needsUpdate = true; + return texture; + }, [points, width, height]); + + useEffect(() => { + uniformsRef.current.u_radius.value = radius; + uniformsRef.current.u_opacity.value = opacity; + uniformsRef.current.u_debugMode.value = debugModeMap[debugMode]; + }, [radius, opacity, debugMode, debugModeMap]); + + useEffect(() => { + uniformsRef.current.u_points.value = pointTexture; + uniformsRef.current.u_count.value = points.length; + }, [pointTexture, points.length]); + + return ( + + + = u_count) break; + float fi = float(i) + 0.5; + float u = fi / float(MAX_POINTS); + + vec4 point = texture2D(u_points, vec2(u, 0.5)); + vec2 pos = point.rg; + float value = point.b; + + float d = distance(vUv, pos); + intensity += value * gauss(d, u_radius); + } + + // Debug mode 1: grayscale + if (u_debugMode == 1) { + gl_FragColor = vec4(vec3(intensity), 1.0); + return; + } + + // Debug mode 2: heatmap color + vec3 color = vec3(0.0); + if (intensity > 0.0) { + if (intensity < 0.5) { + color = mix(vec3(0.0, 0.0, 1.0), vec3(0.0, 1.0, 0.0), intensity * 2.0); + } else { + color = mix(vec3(0.0, 1.0, 0.0), vec3(1.0, 0.0, 0.0), (intensity - 0.5) * 2.0); + } + } + + gl_FragColor = vec4(color, intensity * u_opacity); + } + `} + /> + + ); +}; + +export default HeatMap; diff --git a/app/src/modules/simulation/simulation.tsx b/app/src/modules/simulation/simulation.tsx index 4490aeb..80467e4 100644 --- a/app/src/modules/simulation/simulation.tsx +++ b/app/src/modules/simulation/simulation.tsx @@ -14,6 +14,7 @@ import Trigger from './triggers/trigger'; import useModuleStore from '../../store/useModuleStore'; import SimulationAnalysis from './analysis/simulationAnalysis'; import { useSceneContext } from '../scene/sceneContext'; +import HeatMap from '../../components/HeatMap/HeatMap'; function Simulation() { const { activeModule } = useModuleStore(); @@ -62,6 +63,8 @@ function Simulation() { + + } From ead9f100c43dccf16133f95a49d998993471e814 Mon Sep 17 00:00:00 2001 From: Gomathi9520 Date: Thu, 4 Sep 2025 17:37:46 +0530 Subject: [PATCH 02/19] refactor HeatMap component for improved performance and clarity --- app/src/components/HeatMap/HeatMap.tsx | 252 +++++++++++++++---------- 1 file changed, 151 insertions(+), 101 deletions(-) diff --git a/app/src/components/HeatMap/HeatMap.tsx b/app/src/components/HeatMap/HeatMap.tsx index e2c7c74..6344c67 100644 --- a/app/src/components/HeatMap/HeatMap.tsx +++ b/app/src/components/HeatMap/HeatMap.tsx @@ -5,114 +5,170 @@ import { useProductContext } from "../../modules/simulation/products/productCont import { useSceneContext } from "../../modules/scene/sceneContext"; import * as CONSTANTS from "../../types/world/worldConstants"; import { determineExecutionMachineSequences } from "../../modules/simulation/simulator/functions/determineExecutionMachineSequences"; +import { + useAnimationPlaySpeed, + usePauseButtonStore, + usePlayButtonStore, + useResetButtonStore, +} from "../../store/usePlayButtonStore"; -const MAX_POINTS = 100; +const DECAY_RATE = 0.01; +const RADIUS = 0.005; +const OPACITY = 0.8; +const UPDATE_INTERVAL = 0.1; + +interface HeatPoint { + x: number; + y: number; + strength: number; + lastUpdated: number; +} const HeatMap = () => { const isUsingBBOX = false; const height = CONSTANTS.gridConfig.size; const width = CONSTANTS.gridConfig.size; - const radius = 0.005; - const opacity = 0.8; const debugMode: "solid" | "grayscale" | "normal" = "normal"; - const debugModeMap = { solid: 0, grayscale: 1, normal: 2, } as const; + const debugMode: "solid" | "grayscale" | "normal" = "normal"; + + const debugModeMap = { solid: 0, grayscale: 1, normal: 2 } as const; + const { productStore } = useSceneContext(); const { getProductById, products } = productStore(); const { selectedProductStore } = useProductContext(); const { selectedProduct } = selectedProductStore(); + const { isPlaying } = usePlayButtonStore(); + const { isReset } = useResetButtonStore(); + const { isPaused } = usePauseButtonStore(); + const { speed } = useAnimationPlaySpeed(); const { scene } = useThree(); + const [events, setEvents] = useState([]); - const [points, setPoints] = useState<{ x: number; y: number; value: number; }[]>([]); + const [points, setPoints] = useState([]); const materialRef = useRef(null); + + const lastFrameTime = useRef(null); + const lastUpdateTime = useRef(0); + const uniformsRef = useRef({ u_points: { value: null as THREE.DataTexture | null }, u_count: { value: 0 }, - u_radius: { value: radius }, - u_opacity: { value: opacity }, + u_radius: { value: RADIUS }, + u_opacity: { value: OPACITY }, u_debugMode: { value: debugModeMap[debugMode] }, }); + useEffect(() => { + if (isReset || !isPlaying) { + setPoints([]); + lastFrameTime.current = null; + lastUpdateTime.current = 0; + } + }, [isReset, isPlaying]); + useEffect(() => { const selectedProductData = getProductById(selectedProduct.productUuid); - const events: EventsSchema[] = []; + const newEvents: EventsSchema[] = []; if (selectedProductData) { - determineExecutionMachineSequences([selectedProductData]).then( - (sequences) => { - sequences.forEach((sequence) => { - sequence.forEach((event) => { - if (event.type === 'human' || event.type === 'vehicle') { - events.push(event); - } - }) + determineExecutionMachineSequences([selectedProductData]).then((sequences) => { + sequences.forEach((sequence) => { + sequence.forEach((event) => { + if (event.type === "human" || event.type === "vehicle") { + newEvents.push(event); + } }); - setEvents(events); - } - ); + }); + setEvents(newEvents); + }); } - }, [selectedProduct, products]) + }, [selectedProduct, products]); - useFrame(() => { - if (!materialRef.current || !scene) return; + useFrame((state) => { + if (!scene || !isPlaying || isReset) return; - const heatmapPoints: { x: number; y: number; value: number }[] = []; + const now = state.clock.elapsedTime; + + if (isPaused || speed === 0) { + lastFrameTime.current = now; + return; + } + + let delta = 0; + if (lastFrameTime.current !== null) { + delta = now - lastFrameTime.current; + } + lastFrameTime.current = now; + + if (delta <= 0) return; + + const updateInterval = UPDATE_INTERVAL / Math.max(speed, 0.1); + + if (now - lastUpdateTime.current < updateInterval) return; + lastUpdateTime.current = now; + + const scaledDelta = delta * speed; + + let updatedPoints = [...points]; events.forEach((event) => { - const model = scene.getObjectByProperty('uuid', event.modelUuid) as THREE.Object3D; + const model = scene.getObjectByProperty("uuid", event.modelUuid) as THREE.Object3D; if (!model) return; - if (isUsingBBOX) { - const box = new THREE.Box3().setFromObject(model); + const pos = isUsingBBOX + ? (() => { + const box = new THREE.Box3().setFromObject(model); + const { min, max } = box; + return new THREE.Vector3((min.x + max.x) / 2, 0, (min.z + max.z) / 2); + })() + : model.position; - const { min, max } = box; - - const corners = [ - new THREE.Vector3(min.x, 0, min.z), - new THREE.Vector3(min.x, 0, max.z), - new THREE.Vector3(max.x, 0, min.z), - new THREE.Vector3(max.x, 0, max.z), - ]; - - corners.forEach((corner) => { - heatmapPoints.push({ - x: corner.x, - y: corner.z, - value: 1.0, - }); - }); - } else { - heatmapPoints.push({ - x: model.position.x, - y: model.position.z, - value: 1.0, - }); - } + updatedPoints.push({ + x: pos.x, + y: pos.z, + strength: 0.3, + lastUpdated: now, + }); }); - setPoints(heatmapPoints); + updatedPoints = updatedPoints + .map((p) => ({ + ...p, + strength: Math.max(0, p.strength - DECAY_RATE * scaledDelta), + })) + .filter((p) => p.strength > 0.01); + + setPoints(updatedPoints); }); const pointTexture = useMemo(() => { if (points.length === 0) return null; - const data = new Float32Array(MAX_POINTS * 4); + + const data = new Float32Array(points.length * 4); points.forEach((p, i) => { const index = i * 4; data[index] = (p.x + width / 2) / width; data[index + 1] = (p.y + height / 2) / height; - data[index + 2] = p.value; + data[index + 2] = p.strength; data[index + 3] = 0.0; }); - const texture = new THREE.DataTexture(data, MAX_POINTS, 1, THREE.RGBAFormat, THREE.FloatType); + const texture = new THREE.DataTexture( + data, + points.length, + 1, + THREE.RGBAFormat, + THREE.FloatType + ); texture.needsUpdate = true; return texture; }, [points, width, height]); useEffect(() => { - uniformsRef.current.u_radius.value = radius; - uniformsRef.current.u_opacity.value = opacity; + uniformsRef.current.u_radius.value = RADIUS; + uniformsRef.current.u_opacity.value = OPACITY; uniformsRef.current.u_debugMode.value = debugModeMap[debugMode]; - }, [radius, opacity, debugMode, debugModeMap]); + }, [RADIUS, OPACITY, debugMode]); useEffect(() => { uniformsRef.current.u_points.value = pointTexture; @@ -120,10 +176,7 @@ const HeatMap = () => { }, [pointTexture, points.length]); return ( - + { vertexShader={` varying vec2 vUv; void main() { - vUv = uv; - gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0); + vUv = uv; + gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0); } `} fragmentShader={` @@ -148,51 +201,48 @@ const HeatMap = () => { uniform int u_debugMode; varying vec2 vUv; - const int MAX_POINTS = ${MAX_POINTS}; - float gauss(float dist, float radius) { - return exp(-pow(dist / radius, 2.0)); + return exp(-pow(dist / radius, 2.0)); } void main() { - // Debug mode 0: solid red for plane visibility - if (u_debugMode == 0) { - gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); - return; - } - - float intensity = 0.0; - - for (int i = 0; i < MAX_POINTS; i++) { - if (i >= u_count) break; - float fi = float(i) + 0.5; - float u = fi / float(MAX_POINTS); - - vec4 point = texture2D(u_points, vec2(u, 0.5)); - vec2 pos = point.rg; - float value = point.b; - - float d = distance(vUv, pos); - intensity += value * gauss(d, u_radius); - } - - // Debug mode 1: grayscale - if (u_debugMode == 1) { - gl_FragColor = vec4(vec3(intensity), 1.0); - return; - } - - // Debug mode 2: heatmap color - vec3 color = vec3(0.0); - if (intensity > 0.0) { - if (intensity < 0.5) { - color = mix(vec3(0.0, 0.0, 1.0), vec3(0.0, 1.0, 0.0), intensity * 2.0); - } else { - color = mix(vec3(0.0, 1.0, 0.0), vec3(1.0, 0.0, 0.0), (intensity - 0.5) * 2.0); + if (u_debugMode == 0) { + gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); + return; } - } - gl_FragColor = vec4(color, intensity * u_opacity); + float intensity = 0.0; + + for (int i = 0; i < 10000; i++) { + if (i >= u_count) break; // dynamically stop looping + float fi = float(i) + 0.5; + float u = fi / float(u_count); + + vec4 point = texture2D(u_points, vec2(u, 0.5)); + vec2 pos = point.rg; + float strength = point.b; + + float d = distance(vUv, pos); + intensity += strength * gauss(d, u_radius); + } + + if (u_debugMode == 1) { + gl_FragColor = vec4(vec3(intensity), 1.0); + return; + } + + vec3 color = vec3(0.0); + float normalized = clamp(intensity / 4.0, 0.0, 1.0); + + if (normalized < 0.33) { + color = mix(vec3(0.0, 0.0, 1.0), vec3(0.0, 1.0, 0.0), normalized / 0.33); + } else if (normalized < 0.66) { + color = mix(vec3(0.0, 1.0, 0.0), vec3(1.0, 1.0, 0.0), (normalized - 0.33) / 0.33); + } else { + color = mix(vec3(1.0, 1.0, 0.0), vec3(1.0, 0.0, 0.0), (normalized - 0.66) / 0.34); + } + + gl_FragColor = vec4(color, normalized * u_opacity); } `} /> From bef1b3dceeb26757bb741348c687badbda0d3339 Mon Sep 17 00:00:00 2001 From: Gomathi9520 Date: Thu, 4 Sep 2025 18:19:51 +0530 Subject: [PATCH 03/19] heat map bug fix --- app/src/components/HeatMap/HeatMap.tsx | 26 +++++++++++++++----------- 1 file changed, 15 insertions(+), 11 deletions(-) diff --git a/app/src/components/HeatMap/HeatMap.tsx b/app/src/components/HeatMap/HeatMap.tsx index 6344c67..7ae98c9 100644 --- a/app/src/components/HeatMap/HeatMap.tsx +++ b/app/src/components/HeatMap/HeatMap.tsx @@ -5,14 +5,10 @@ import { useProductContext } from "../../modules/simulation/products/productCont import { useSceneContext } from "../../modules/scene/sceneContext"; import * as CONSTANTS from "../../types/world/worldConstants"; import { determineExecutionMachineSequences } from "../../modules/simulation/simulator/functions/determineExecutionMachineSequences"; -import { - useAnimationPlaySpeed, - usePauseButtonStore, - usePlayButtonStore, - useResetButtonStore, -} from "../../store/usePlayButtonStore"; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from "../../store/usePlayButtonStore"; const DECAY_RATE = 0.01; +const GROWTH_TIME_MULTIPLIER = 20; const RADIUS = 0.005; const OPACITY = 0.8; const UPDATE_INTERVAL = 0.1; @@ -55,6 +51,7 @@ const HeatMap = () => { u_radius: { value: RADIUS }, u_opacity: { value: OPACITY }, u_debugMode: { value: debugModeMap[debugMode] }, + u_growthRate: { value: GROWTH_TIME_MULTIPLIER }, // NEW }); useEffect(() => { @@ -168,7 +165,8 @@ const HeatMap = () => { uniformsRef.current.u_radius.value = RADIUS; uniformsRef.current.u_opacity.value = OPACITY; uniformsRef.current.u_debugMode.value = debugModeMap[debugMode]; - }, [RADIUS, OPACITY, debugMode]); + uniformsRef.current.u_growthRate.value = GROWTH_TIME_MULTIPLIER; + }, [RADIUS, OPACITY, debugMode, GROWTH_TIME_MULTIPLIER]); useEffect(() => { uniformsRef.current.u_points.value = pointTexture; @@ -199,6 +197,7 @@ const HeatMap = () => { uniform float u_radius; uniform float u_opacity; uniform int u_debugMode; + uniform float u_growthRate; varying vec2 vUv; float gauss(float dist, float radius) { @@ -214,7 +213,7 @@ const HeatMap = () => { float intensity = 0.0; for (int i = 0; i < 10000; i++) { - if (i >= u_count) break; // dynamically stop looping + if (i >= u_count) break; float fi = float(i) + 0.5; float u = fi / float(u_count); @@ -231,9 +230,13 @@ const HeatMap = () => { return; } - vec3 color = vec3(0.0); - float normalized = clamp(intensity / 4.0, 0.0, 1.0); + // Apply growth rate BEFORE normalization + float adjustedIntensity = intensity * u_growthRate; + // Normalize intensity between 0-1 + float normalized = clamp(intensity / max(u_growthRate, 0.0001), 0.0, 1.0); + + vec3 color = vec3(0.0); if (normalized < 0.33) { color = mix(vec3(0.0, 0.0, 1.0), vec3(0.0, 1.0, 0.0), normalized / 0.33); } else if (normalized < 0.66) { @@ -244,10 +247,11 @@ const HeatMap = () => { gl_FragColor = vec4(color, normalized * u_opacity); } + `} /> ); }; -export default HeatMap; +export default HeatMap; \ No newline at end of file From 33fb90af716785d46128bc0ae7547cb63411719e Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Fri, 5 Sep 2025 11:32:25 +0530 Subject: [PATCH 04/19] added event handler for wall asset --- .../eventHandler/useWallAssetEventHandler.ts | 213 ++++++++++++++++++ .../Instances/Instance/wallAssetInstance.tsx | 210 +---------------- 2 files changed, 223 insertions(+), 200 deletions(-) create mode 100644 app/src/modules/builder/wallAsset/Instances/Instance/eventHandler/useWallAssetEventHandler.ts diff --git a/app/src/modules/builder/wallAsset/Instances/Instance/eventHandler/useWallAssetEventHandler.ts b/app/src/modules/builder/wallAsset/Instances/Instance/eventHandler/useWallAssetEventHandler.ts new file mode 100644 index 0000000..1fbce4c --- /dev/null +++ b/app/src/modules/builder/wallAsset/Instances/Instance/eventHandler/useWallAssetEventHandler.ts @@ -0,0 +1,213 @@ +import * as THREE from 'three'; +import { useCallback, useEffect, useRef } from 'react'; +import { ThreeEvent, useThree } from '@react-three/fiber'; +import { useParams } from 'react-router-dom'; +import { useActiveTool, useSocketStore, useToggleView } from '../../../../../../store/builder/store'; +import useModuleStore from '../../../../../../store/useModuleStore'; +import { useSceneContext } from '../../../../../scene/sceneContext'; +import { useBuilderStore } from '../../../../../../store/builder/useBuilderStore'; +import { useVersionContext } from '../../../../version/versionContext'; +import { getUserData } from '../../../../../../functions/getUserData'; +import closestPointOnLineSegment from '../../../../line/helpers/getClosestPointOnLineSegment'; +import { upsertWallAssetApi } from '../../../../../../services/factoryBuilder/asset/wallAsset/upsertWallAssetApi'; +import { deleteWallAssetApi } from '../../../../../../services/factoryBuilder/asset/wallAsset/deleteWallAssetApi'; + +export function useWallAssetEventHandler({ + wallAsset, + groupRef, + wall, +}: { + wallAsset: WallAsset; + groupRef: React.RefObject; + wall: Wall | undefined; +}) { + const { socket } = useSocketStore(); + const { raycaster, pointer, camera, scene, controls, gl } = useThree(); + const { wallAssetStore } = useSceneContext(); + const { updateWallAsset, removeWallAsset, getWallAssetById } = wallAssetStore(); + const { toggleView } = useToggleView(); + const { activeTool } = useActiveTool(); + const { activeModule } = useModuleStore(); + const { selectedWallAsset, setSelectedWallAsset, setDeletableWallAsset, deletableWallAsset } = useBuilderStore(); + const { selectedVersionStore } = useVersionContext(); + const { selectedVersion } = selectedVersionStore(); + const { userId, organization } = getUserData(); + const { projectId } = useParams(); + + const draggingRef = useRef(false); + + useEffect(() => { + const canvasElement = gl.domElement; + + const onPointerUp = (e: PointerEvent) => { + if (draggingRef.current) { + draggingRef.current = false; + if (controls) { + (controls as any).enabled = true; + } + + if (selectedWallAsset) { + const updatedWallAsset = getWallAssetById(wallAsset.modelUuid); + + if (projectId && updatedWallAsset) { + if (!socket?.connected) { + + // API + + upsertWallAssetApi(projectId, selectedVersion?.versionId || '', updatedWallAsset); + } else { + + // SOCKET + + const data = { + wallAssetData: updatedWallAsset, + projectId: projectId, + versionId: selectedVersion?.versionId || '', + userId: userId, + organization: organization + } + socket.emit('v1:wall-asset:add', data); + } + } + } + } + }; + + const onPointerMove = (e: any) => { + if (!draggingRef.current || !wall || !selectedWallAsset) return; + if (controls) { + (controls as any).enabled = false; + } + + pointer.x = (e.clientX / window.innerWidth) * 2 - 1; + pointer.y = -(e.clientY / window.innerHeight) * 2 + 1; + + raycaster.setFromCamera(pointer, camera); + const intersects = raycaster.intersectObjects(scene.children, true); + const intersect = intersects.find((i: any) => i.object.name.includes('WallReference')); + + if (intersect?.object.userData.wallUuid) { + const newPoint = closestPointOnLineSegment( + new THREE.Vector3(intersect.point.x, 0, intersect.point.z), + new THREE.Vector3(...intersect.object.userData.points[0].position), + new THREE.Vector3(...intersect.object.userData.points[1].position) + ); + + const wallRotation = intersect.object.rotation.clone(); + + updateWallAsset(wallAsset.modelUuid, { + wallUuid: intersect.object.userData.wallUuid, + position: [newPoint.x, wallAsset.wallAssetType === 'fixedMove' ? 0 : intersect.point.y, newPoint.z], + rotation: [wallRotation.x, wallRotation.y, wallRotation.z], + }); + } + }; + + if (selectedWallAsset && !toggleView && activeModule === 'builder') { + canvasElement.addEventListener('mousemove', onPointerMove); + canvasElement.addEventListener('pointerup', onPointerUp); + } + + return () => { + canvasElement.removeEventListener('mousemove', onPointerMove); + canvasElement.removeEventListener('pointerup', onPointerUp); + }; + }, [gl, camera, toggleView, activeModule, selectedWallAsset, socket, wall, wallAsset]); + + const handlePointerEnter = useCallback((evt: ThreeEvent) => { + if (!toggleView) { + evt.stopPropagation(); + let currentObject = evt.object; + while (currentObject) { + if (currentObject.userData.wallUuid) { + break; + } + currentObject = currentObject.parent as THREE.Object3D; + } + if (activeTool === "delete" && activeModule === 'builder') { + if (deletableWallAsset && deletableWallAsset.userData.modelUuid === wallAsset.modelUuid) { + return; + } else { + setDeletableWallAsset(currentObject); + } + } + } + }, [activeTool, activeModule, deletableWallAsset, toggleView]); + + const handlePointerLeave = useCallback((evt: ThreeEvent) => { + if (!toggleView) { + evt.stopPropagation(); + if (evt.intersections.length === 0 && activeTool === "delete" && deletableWallAsset && deletableWallAsset.userData.modelUuid === wallAsset.modelUuid) { + setDeletableWallAsset(null); + } + } + }, [activeTool, deletableWallAsset, toggleView]); + + const handlePointerDown = useCallback((e: ThreeEvent) => { + if (!toggleView && activeModule === 'builder' && selectedWallAsset && selectedWallAsset.userData.modelUuid === wallAsset.modelUuid) { + draggingRef.current = true; + e.stopPropagation(); + setSelectedWallAsset(groupRef.current); + if (controls) { + (controls as any).enabled = false; + } + } + }, [toggleView, activeModule, selectedWallAsset, wallAsset]); + + const handleClick = useCallback((e: ThreeEvent) => { + if (!toggleView && activeModule === 'builder' && activeTool !== 'delete') { + if (e.object) { + e.stopPropagation(); + let currentObject = e.object; + while (currentObject) { + if (currentObject.userData.wallUuid) { + break; + } + currentObject = currentObject.parent as THREE.Object3D; + } + setSelectedWallAsset(currentObject); + } + } else if (!toggleView && activeModule === 'builder' && activeTool === 'delete') { + if (activeTool === 'delete' && deletableWallAsset && deletableWallAsset.userData.modelUuid === wallAsset.modelUuid) { + const removedWallAsset = removeWallAsset(wallAsset.modelUuid); + + if (projectId && removedWallAsset) { + if (!socket?.connected) { + + // API + + deleteWallAssetApi(projectId, selectedVersion?.versionId || '', removedWallAsset.modelUuid, removedWallAsset.wallUuid); + } else { + + // SOCKET + + const data = { + projectId: projectId, + versionId: selectedVersion?.versionId || '', + userId: userId, + organization: organization, + modelUuid: removedWallAsset.modelUuid, + wallUuid: removedWallAsset.wallUuid + } + socket.emit('v1:wall-asset:delete', data); + } + } + } + } + }, [toggleView, activeModule, activeTool, wallAsset, deletableWallAsset, socket]); + + const handlePointerMissed = useCallback(() => { + if (selectedWallAsset && selectedWallAsset.userData.modelUuid === wallAsset.modelUuid) { + setSelectedWallAsset(null); + } + }, [selectedWallAsset, wallAsset]); + + return { + handlePointerDown, + handleClick, + handlePointerMissed, + handlePointerEnter, + handlePointerLeave, + draggingRef + }; +} \ No newline at end of file diff --git a/app/src/modules/builder/wallAsset/Instances/Instance/wallAssetInstance.tsx b/app/src/modules/builder/wallAsset/Instances/Instance/wallAssetInstance.tsx index 73503ff..7d88a96 100644 --- a/app/src/modules/builder/wallAsset/Instances/Instance/wallAssetInstance.tsx +++ b/app/src/modules/builder/wallAsset/Instances/Instance/wallAssetInstance.tsx @@ -1,42 +1,22 @@ import * as THREE from 'three'; -import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; -import { ThreeEvent, useThree } from '@react-three/fiber'; +import { useEffect, useMemo, useRef, useState } from 'react'; import { Base, Geometry, Subtraction } from '@react-three/csg'; -import { retrieveGLTF, storeGLTF } from '../../../../../utils/indexDB/idbUtils'; import { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader'; import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader'; -import useModuleStore from '../../../../../store/useModuleStore'; +import { retrieveGLTF, storeGLTF } from '../../../../../utils/indexDB/idbUtils'; import { useSceneContext } from '../../../../scene/sceneContext'; -import { useBuilderStore } from '../../../../../store/builder/useBuilderStore'; -import { useActiveTool, useSocketStore, useToggleView } from '../../../../../store/builder/store'; -import { useParams } from 'react-router-dom'; -import { useVersionContext } from '../../../version/versionContext'; -import { getUserData } from '../../../../../functions/getUserData'; -import closestPointOnLineSegment from '../../../line/helpers/getClosestPointOnLineSegment'; -import { upsertWallAssetApi } from '../../../../../services/factoryBuilder/asset/wallAsset/upsertWallAssetApi'; -import { deleteWallAssetApi } from '../../../../../services/factoryBuilder/asset/wallAsset/deleteWallAssetApi'; +import { useWallAssetEventHandler } from './eventHandler/useWallAssetEventHandler'; function WallAssetInstance({ wallAsset }: { readonly wallAsset: WallAsset }) { const url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`; - const { socket } = useSocketStore(); - const { raycaster, pointer, camera, scene, controls, gl } = useThree(); - const { wallStore, wallAssetStore } = useSceneContext(); + const { wallStore } = useSceneContext(); const { walls, getWallById } = wallStore(); - const { updateWallAsset, removeWallAsset, getWallAssetById } = wallAssetStore(); - const { toggleView } = useToggleView(); - const { activeTool } = useActiveTool(); - const { activeModule } = useModuleStore(); - const { selectedWallAsset, setSelectedWallAsset, setDeletableWallAsset, deletableWallAsset } = useBuilderStore(); const [gltfScene, setGltfScene] = useState(null); const [boundingBox, setBoundingBox] = useState(null); const groupRef = useRef(null); const wall = useMemo(() => getWallById(wallAsset.wallUuid), [getWallById, wallAsset.wallUuid, walls]); - const draggingRef = useRef(false); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); - const { userId, organization } = getUserData(); - const { projectId } = useParams(); + const { handlePointerDown, handleClick, handlePointerMissed, handlePointerEnter, handlePointerLeave } = useWallAssetEventHandler({ wallAsset, groupRef, wall }); useEffect(() => { const loader = new GLTFLoader(); @@ -112,130 +92,6 @@ function WallAssetInstance({ wallAsset }: { readonly wallAsset: WallAsset }) { }, []); - useEffect(() => { - const canvasElement = gl.domElement; - - const onPointerUp = (e: PointerEvent) => { - if (draggingRef.current) { - draggingRef.current = false; - if (controls) { - (controls as any).enabled = true; - } - - if (selectedWallAsset) { - const updatedWallAsset = getWallAssetById(wallAsset.modelUuid); - - if (projectId && updatedWallAsset) { - if (!socket?.connected) { - - // API - - upsertWallAssetApi(projectId, selectedVersion?.versionId || '', updatedWallAsset); - } else { - - // SOCKET - - const data = { - wallAssetData: updatedWallAsset, - projectId: projectId, - versionId: selectedVersion?.versionId || '', - userId: userId, - organization: organization - } - - socket.emit('v1:wall-asset:add', data); - } - } - } - } - }; - - const onPointerMove = (e: any) => { - if (!draggingRef.current || !wall || !selectedWallAsset) return; - if (controls) { - (controls as any).enabled = false; - } - pointer.x = (e.clientX / window.innerWidth) * 2 - 1; - pointer.y = -(e.clientY / window.innerHeight) * 2 + 1; - - raycaster.setFromCamera(pointer, camera); - const intersects = raycaster.intersectObjects(scene.children, true); - const intersect = intersects.find((i: any) => i.object.name.includes('WallReference')); - - if (intersect?.object.userData.wallUuid) { - const newPoint = closestPointOnLineSegment( - new THREE.Vector3(intersect.point.x, 0, intersect.point.z), - new THREE.Vector3(...intersect.object.userData.points[0].position), - new THREE.Vector3(...intersect.object.userData.points[1].position) - ); - - const wallRotation = intersect.object.rotation.clone(); - - updateWallAsset(wallAsset.modelUuid, { - wallUuid: intersect.object.userData.wallUuid, - position: [newPoint.x, wallAsset.wallAssetType === 'fixedMove' ? 0 : intersect.point.y, newPoint.z], - rotation: [wallRotation.x, wallRotation.y, wallRotation.z], - }); - } - }; - - if (selectedWallAsset && !toggleView && activeModule === 'builder') { - canvasElement.addEventListener('mousemove', onPointerMove); - canvasElement.addEventListener('pointerup', onPointerUp); - } - - return () => { - canvasElement.removeEventListener('mousemove', onPointerMove); - canvasElement.removeEventListener('pointerup', onPointerUp); - }; - - }, [gl, camera, toggleView, activeModule, selectedWallAsset, socket]) - - const handlePointerClick = useCallback((wallAsset: WallAsset) => { - if (activeTool === 'delete' && deletableWallAsset && deletableWallAsset.userData.modelUuid === wallAsset.modelUuid) { - const removedWallAsset = removeWallAsset(wallAsset.modelUuid); - - if (projectId && removedWallAsset) { - if (!socket?.connected) { - - // API - - deleteWallAssetApi(projectId, selectedVersion?.versionId || '', removedWallAsset.modelUuid, removedWallAsset.wallUuid); - } else { - - // SOCKET - - const data = { - projectId: projectId, - versionId: selectedVersion?.versionId || '', - userId: userId, - organization: organization, - modelUuid: removedWallAsset.modelUuid, - wallUuid: removedWallAsset.wallUuid - } - - socket.emit('v1:wall-asset:delete', data); - } - } - } - }, [activeTool, activeModule, deletableWallAsset, socket]) - - const handlePointerOver = useCallback((wallAsset: WallAsset, currentObject: THREE.Object3D) => { - if (activeTool === "delete" && activeModule === 'builder') { - if (deletableWallAsset && deletableWallAsset.userData.modelUuid === wallAsset.modelUuid) { - return; - } else { - setDeletableWallAsset(currentObject); - } - } - }, [activeTool, activeModule, deletableWallAsset]); - - const handlePointerOut = useCallback((evt: ThreeEvent, wallAsset: WallAsset) => { - if (evt.intersections.length === 0 && activeTool === "delete" && deletableWallAsset && deletableWallAsset.userData.modelUuid === wallAsset.modelUuid) { - setDeletableWallAsset(null); - } - }, [activeTool, deletableWallAsset]); - if (!gltfScene || !boundingBox) { return null } const size = new THREE.Vector3(); boundingBox.getSize(size); @@ -259,57 +115,11 @@ function WallAssetInstance({ wallAsset }: { readonly wallAsset: WallAsset }) { {gltfScene && ( { - if (!toggleView && activeModule === 'builder' && selectedWallAsset && selectedWallAsset.userData.modelUuid === wallAsset.modelUuid) { - draggingRef.current = true; - e.stopPropagation(); - setSelectedWallAsset(groupRef.current); - if (controls) { - (controls as any).enabled = false; - } - } - }} - onClick={(e) => { - if (!toggleView && activeModule === 'builder' && activeTool !== 'delete') { - if (e.object) { - e.stopPropagation(); - let currentObject = e.object as THREE.Object3D; - while (currentObject) { - if (currentObject.userData.wallUuid) { - break; - } - currentObject = currentObject.parent as THREE.Object3D; - } - setSelectedWallAsset(currentObject); - } - } else if (!toggleView && activeModule === 'builder' && activeTool === 'delete') { - handlePointerClick(wallAsset); - } - }} - onPointerMissed={() => { - if (selectedWallAsset && selectedWallAsset.userData.modelUuid === wallAsset.modelUuid) { - setSelectedWallAsset(null); - } - }} - onPointerEnter={(e) => { - if (!toggleView) { - e.stopPropagation(); - let currentObject = e.object as THREE.Object3D; - while (currentObject) { - if (currentObject.userData.wallUuid) { - break; - } - currentObject = currentObject.parent as THREE.Object3D; - } - handlePointerOver(wallAsset, currentObject); - } - }} - onPointerLeave={(e) => { - if (!toggleView) { - e.stopPropagation(); - handlePointerOut(e, wallAsset); - } - }} + onPointerDown={handlePointerDown} + onClick={handleClick} + onPointerMissed={handlePointerMissed} + onPointerEnter={handlePointerEnter} + onPointerLeave={handlePointerLeave} userData={wallAsset} > From 1f382de751f2afe8d11be0cee83e1007ae8e4d18 Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Fri, 5 Sep 2025 11:43:14 +0530 Subject: [PATCH 05/19] file structure change --- app/src/components/footer/Footer.tsx | 6 +- .../layout/controls/ControlsPlayer.tsx | 6 +- .../layout/scenes/ComparisonScene.tsx | 4 +- .../layout/scenes/ComparisonSceneProvider.tsx | 21 ---- .../components/layout/scenes/MainScene.tsx | 4 +- .../layout/scenes/MainSceneProvider.tsx | 21 ---- .../components/layout/sidebarLeft/Header.tsx | 4 +- .../layout/sidebarLeft/SideBarLeft.tsx | 4 +- .../visualization/widgets/Widgets2D.tsx | 2 +- .../components/layout/sidebarRight/Header.tsx | 4 +- .../layout/sidebarRight/SideBarRight.tsx | 4 +- .../sidebarRight/simulation/Simulations.tsx | 2 +- .../versionHisory/VersionHistory.tsx | 2 +- .../IotInputCards/BarChartInput.tsx | 2 +- .../FleetEfficiencyInputComponent.tsx | 2 +- .../IotInputCards/FlotingWidgetInput.tsx | 2 +- .../IotInputCards/InputSelecterComponent.tsx | 2 +- .../IotInputCards/LineGrapInput.tsx | 2 +- .../IotInputCards/PieChartInput.tsx | 2 +- .../IotInputCards/Progress1Input.tsx | 2 +- .../IotInputCards/Progress2Input.tsx | 2 +- .../WarehouseThroughputInputComponent.tsx | 2 +- .../IotInputCards/Widget2InputCard3D.tsx | 2 +- .../IotInputCards/Widget3InputCard3D.tsx | 2 +- .../IotInputCards/Widget4InputCard3D.tsx | 2 +- .../sidebarRight/visualization/data/Data.tsx | 2 +- .../visualization/design/Design.tsx | 2 +- app/src/components/ui/ModuleToggle.tsx | 4 +- app/src/components/ui/Tools.tsx | 8 +- .../ui/compareVersion/CompareLayOut.tsx | 2 +- app/src/components/ui/list/List.tsx | 2 +- app/src/components/ui/menu/menu.tsx | 2 +- .../ui/simulation/AssetDetailsCard.tsx | 2 +- .../ui/simulation/simulationPlayer.tsx | 6 +- .../Decal/decalCreator/decalCreator.tsx | 2 +- .../Decal/decalInstance/decalInstance.tsx | 2 +- .../eventHandler/useDecalEventHandlers.ts | 2 +- app/src/modules/builder/asset/assetsGroup.tsx | 2 +- .../models/model/animator/modelAnimator.tsx | 4 +- .../model/eventHandlers/useEventHandlers.ts | 2 +- .../builder/asset/models/model/model.tsx | 2 +- .../Instances/Instance/floorInstance.tsx | 2 +- .../floor/Instances/floorInstances.tsx | 2 +- app/src/modules/builder/floor/floorGroup.tsx | 2 +- .../builder/wall/Instances/instance/wall.tsx | 2 +- .../builder/wall/Instances/wallInstances.tsx | 2 +- app/src/modules/builder/wall/wallGroup.tsx | 2 +- .../eventHandler/useWallAssetEventHandler.ts | 2 +- .../builder/wallAsset/wallAssetCreator.tsx | 2 +- .../builder/wallAsset/wallAssetGroup.tsx | 2 +- app/src/modules/builder/zone/zoneGroup.tsx | 2 +- .../collaboration/camera/collabCams.tsx | 4 +- .../commentInstance/commentInstance.tsx | 2 +- .../contextControls/contextControls.tsx | 2 +- .../selection2D/moveControls2D.tsx | 2 +- .../selection2D/selectionControls2D.tsx | 2 +- .../selection3D/moveControls3D.tsx | 2 +- .../selection3D/rotateControls3D.tsx | 2 +- .../selection3D/selectionControls3D.tsx | 2 +- .../undoRedo3D/undoRedo3DControls.tsx | 2 +- app/src/modules/scene/scene.tsx | 2 +- .../conveyor/actionHandler/useDelayHandler.ts | 2 +- .../conveyor/actionHandler/useSpawnHandler.ts | 2 +- .../actionHandler/useRetrieveHandler.ts | 2 +- .../simulation/actions/useActionHandler.ts | 2 +- .../simulation/analysis/ROI/roiData.tsx | 2 +- .../productionCapacityData.tsx | 2 +- .../analysis/throughPut/throughPutData.tsx | 2 +- .../eventManager/useConveyorEventManager.ts | 2 +- .../eventManager/useCraneEventManager.ts | 2 +- .../instances/animator/pillarJibAnimator.tsx | 2 +- .../instances/instance/pillarJibInstance.tsx | 2 +- .../events/points/creator/pointsCreator.tsx | 4 +- .../triggerConnections/triggerConnector.tsx | 4 +- .../eventManager/useHumanEventManager.ts | 2 +- app/src/modules/simulation/human/human.tsx | 2 +- .../animator/manufacturerAnimator.tsx | 2 +- .../instances/animator/operatorAnimator.tsx | 2 +- .../instances/animator/workerAnimator.tsx | 2 +- .../instance/actions/manufacturerInstance.tsx | 2 +- .../instance/actions/operatorInstance.tsx | 2 +- .../instance/actions/workerInstance.tsx | 2 +- .../instances/instance/humanInstance.tsx | 2 +- .../eventManager/useMachineEventManager.ts | 2 +- .../instances/animator/machineAnimator.tsx | 2 +- .../machineInstance/machineInstance.tsx | 2 +- .../materialCollitionDetector.tsx | 2 +- .../instances/animator/materialAnimator.tsx | 2 +- .../instances/instance/materialInstance.tsx | 2 +- .../simulation/materials/materials.tsx | 2 +- .../modules/simulation/products/products.tsx | 2 +- .../eventManager/useArmBotEventManager.ts | 2 +- .../instances/animator/roboticArmAnimator.tsx | 2 +- .../armInstance/roboticArmInstance.tsx | 2 +- .../instances/ikInstance/ikInstance.tsx | 2 +- .../simulation/roboticArm/roboticArm.tsx | 2 +- app/src/modules/simulation/simulation.tsx | 2 +- .../simulation/simulator/simulator.tsx | 2 +- .../eventManager/useVehicleEventManager.ts | 2 +- .../instances/animator/interactivePoint.tsx | 2 +- .../instances/animator/vehicleAnimator.tsx | 2 +- .../instances/instance/vehicleInstance.tsx | 2 +- .../simulation/vehicle/navMesh/navMesh.tsx | 2 +- .../modules/simulation/vehicle/vehicles.tsx | 2 +- .../visualization/RealTimeVisulization.tsx | 6 +- .../functions/handleSaveTemplate.ts | 2 +- .../socket/realTimeVizSocket.dev.tsx | 2 +- .../visualization/template/Templates.tsx | 2 +- .../widgets/2d/DraggableWidget.tsx | 4 +- .../widgets/2d/charts/BarGraphComponent.tsx | 4 +- .../2d/charts/DoughnutGraphComponent.tsx | 4 +- .../widgets/2d/charts/LineGraphComponent.tsx | 4 +- .../widgets/2d/charts/PieGraphComponent.tsx | 4 +- .../2d/charts/PolarAreaGraphComponent.tsx | 4 +- .../widgets/2d/charts/ProgressCard1.tsx | 2 +- .../widgets/2d/charts/ProgressCard2.tsx | 2 +- .../widgets/3d/Dropped3dWidget.tsx | 4 +- .../widgets/3d/cards/ProductionCapacity.tsx | 2 +- .../widgets/3d/cards/ReturnOfInvestment.tsx | 2 +- .../widgets/3d/cards/StateWorking.tsx | 2 +- .../widgets/3d/cards/Throughput.tsx | 2 +- .../floating/DroppedFloatingWidgets.tsx | 6 +- .../cards/FleetEfficiencyComponent.tsx | 4 +- .../floating/cards/TotalCardComponent.tsx | 2 +- .../cards/WarehouseThroughputComponent.tsx | 2 +- .../visualization/widgets/panel/Panel.tsx | 2 +- .../visualization/zone/DisplayZone.tsx | 4 +- app/src/pages/Project.tsx | 15 ++- app/src/store/scene/useSceneStore.ts | 28 +++++ .../useCompareProductStore.ts | 0 app/src/store/{ => ui}/useModuleStore.ts | 82 +++++++------- app/src/store/{ => ui}/usePlayButtonStore.ts | 98 ++++++++-------- app/src/store/{ => ui}/useTemplateStore.ts | 102 ++++++++--------- app/src/store/{ => ui}/useThemeStore.ts | 22 ++-- app/src/store/{ => ui}/useUIToggleStore.ts | 106 +++++++++--------- app/src/store/{ => ui}/useWidgetStore.ts | 70 ++++++------ app/src/utils/mouseUtils/mouseHelper.ts | 2 +- .../utils/shortcutkeys/handleShortcutKeys.ts | 6 +- 138 files changed, 440 insertions(+), 449 deletions(-) delete mode 100644 app/src/components/layout/scenes/ComparisonSceneProvider.tsx delete mode 100644 app/src/components/layout/scenes/MainSceneProvider.tsx create mode 100644 app/src/store/scene/useSceneStore.ts rename app/src/store/{ => simulation}/useCompareProductStore.ts (100%) rename app/src/store/{ => ui}/useModuleStore.ts (96%) rename app/src/store/{ => ui}/usePlayButtonStore.ts (97%) rename app/src/store/{ => ui}/useTemplateStore.ts (95%) rename app/src/store/{ => ui}/useThemeStore.ts (97%) rename app/src/store/{ => ui}/useUIToggleStore.ts (96%) rename app/src/store/{ => ui}/useWidgetStore.ts (97%) diff --git a/app/src/components/footer/Footer.tsx b/app/src/components/footer/Footer.tsx index 39273df..8475ddb 100644 --- a/app/src/components/footer/Footer.tsx +++ b/app/src/components/footer/Footer.tsx @@ -11,11 +11,11 @@ import ShortcutHelper from "./shortcutHelper"; import useVersionHistoryVisibleStore, { useShortcutStore, } from "../../store/builder/store"; -import { usePlayButtonStore } from "../../store/usePlayButtonStore"; -import useModuleStore, { useSubModuleStore } from "../../store/useModuleStore"; +import { usePlayButtonStore } from "../../store/ui/usePlayButtonStore"; +import useModuleStore, { useSubModuleStore } from "../../store/ui/useModuleStore"; import { useVersionContext } from "../../modules/builder/version/versionContext"; import { mouseActionHelper } from "../../utils/mouseUtils/mouseHelper"; -import { useMouseNoteStore } from "../../store/useUIToggleStore"; +import { useMouseNoteStore } from "../../store/ui/useUIToggleStore"; const Footer: React.FC = () => { const { logs, setIsLogListVisible } = useLogger(); diff --git a/app/src/components/layout/controls/ControlsPlayer.tsx b/app/src/components/layout/controls/ControlsPlayer.tsx index 484cd35..0a8d42b 100644 --- a/app/src/components/layout/controls/ControlsPlayer.tsx +++ b/app/src/components/layout/controls/ControlsPlayer.tsx @@ -1,14 +1,14 @@ import React, { useEffect } from "react"; import useCameraModeStore, { usePlayButtonStore, -} from "../../../store/usePlayButtonStore"; -import useModuleStore from "../../../store/useModuleStore"; +} from "../../../store/ui/usePlayButtonStore"; +import useModuleStore from "../../../store/ui/useModuleStore"; import { PlayIcon } from "../../icons/ShortcutIcons"; import InputToggle from "../../ui/inputs/InputToggle"; import { EyeCloseIcon, WalkIcon } from "../../icons/ExportCommonIcons"; import { ExitIcon } from "../../icons/SimulationIcons"; import { useCamMode } from "../../../store/builder/store"; -import { usePlayerStore } from "../../../store/useUIToggleStore"; +import { usePlayerStore } from "../../../store/ui/useUIToggleStore"; const ControlsPlayer: React.FC = () => { const { setIsPlaying } = usePlayButtonStore(); diff --git a/app/src/components/layout/scenes/ComparisonScene.tsx b/app/src/components/layout/scenes/ComparisonScene.tsx index b1029df..142a13e 100644 --- a/app/src/components/layout/scenes/ComparisonScene.tsx +++ b/app/src/components/layout/scenes/ComparisonScene.tsx @@ -1,11 +1,11 @@ import { useProductContext } from '../../../modules/simulation/products/productContext' import RegularDropDown from '../../ui/inputs/RegularDropDown'; import { useCompareProductDataStore, useLoadingProgress, useSaveVersion } from '../../../store/builder/store'; -import useModuleStore from '../../../store/useModuleStore'; +import useModuleStore from '../../../store/ui/useModuleStore'; import CompareLayOut from '../../ui/compareVersion/CompareLayOut'; import ComparisonResult from '../../ui/compareVersion/ComparisonResult'; import { useComparisonProduct, useMainProduct } from '../../../store/simulation/useSimulationStore'; -import { usePlayButtonStore } from '../../../store/usePlayButtonStore'; +import { usePlayButtonStore } from '../../../store/ui/usePlayButtonStore'; import { useEffect, useState } from 'react'; import { useVersionHistoryStore } from '../../../store/builder/useVersionHistoryStore'; import { useVersionContext } from '../../../modules/builder/version/versionContext'; diff --git a/app/src/components/layout/scenes/ComparisonSceneProvider.tsx b/app/src/components/layout/scenes/ComparisonSceneProvider.tsx deleted file mode 100644 index 46749b7..0000000 --- a/app/src/components/layout/scenes/ComparisonSceneProvider.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import { useEffect } from 'react'; -import { ProductProvider } from '../../../modules/simulation/products/productContext' -import ComparisonScene from './ComparisonScene'; -import { useSceneContext } from '../../../modules/scene/sceneContext'; - -function ComparisonSceneProvider() { - const { assetStore } = useSceneContext(); - const { clearAssets } = assetStore(); - - useEffect(() => { - clearAssets(); - }, []) - - return ( - - - - ) -} - -export default ComparisonSceneProvider \ No newline at end of file diff --git a/app/src/components/layout/scenes/MainScene.tsx b/app/src/components/layout/scenes/MainScene.tsx index 8076ec2..6dfb061 100644 --- a/app/src/components/layout/scenes/MainScene.tsx +++ b/app/src/components/layout/scenes/MainScene.tsx @@ -17,8 +17,8 @@ import VersionSaved from "../sidebarRight/versionHisory/VersionSaved"; import Footer from "../../footer/Footer"; import ThreadChat from "../../ui/collaboration/ThreadChat"; import Scene from "../../../modules/scene/scene"; -import useModuleStore, { useThreeDStore } from "../../../store/useModuleStore"; -import { usePlayButtonStore } from "../../../store/usePlayButtonStore"; +import useModuleStore, { useThreeDStore } from "../../../store/ui/useModuleStore"; +import { usePlayButtonStore } from "../../../store/ui/usePlayButtonStore"; import { useSelectedZoneStore } from "../../../store/visualization/useZoneStore"; import { useFloatingWidget } from "../../../store/visualization/useDroppedObjectsStore"; import { useSelectedUserStore } from "../../../store/collaboration/useCollabStore"; diff --git a/app/src/components/layout/scenes/MainSceneProvider.tsx b/app/src/components/layout/scenes/MainSceneProvider.tsx deleted file mode 100644 index 8dbea25..0000000 --- a/app/src/components/layout/scenes/MainSceneProvider.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import { useEffect } from 'react' -import { ProductProvider } from '../../../modules/simulation/products/productContext' -import MainScene from './MainScene' -import { useSceneContext } from '../../../modules/scene/sceneContext'; - -function MainSceneProvider() { - const { assetStore } = useSceneContext(); - const { clearAssets } = assetStore(); - - useEffect(() => { - clearAssets(); - }, []) - - return ( - - - - ) -} - -export default MainSceneProvider \ No newline at end of file diff --git a/app/src/components/layout/sidebarLeft/Header.tsx b/app/src/components/layout/sidebarLeft/Header.tsx index edcd2e8..5180240 100644 --- a/app/src/components/layout/sidebarLeft/Header.tsx +++ b/app/src/components/layout/sidebarLeft/Header.tsx @@ -2,8 +2,8 @@ import React from "react"; import { ToggleSidebarIcon } from "../../icons/HeaderIcons"; import { LogoIcon } from "../../icons/Logo"; import FileMenu from "../../ui/FileMenu"; -import { useToggleStore } from "../../../store/useUIToggleStore"; -import useModuleStore from "../../../store/useModuleStore"; +import { useToggleStore } from "../../../store/ui/useUIToggleStore"; +import useModuleStore from "../../../store/ui/useModuleStore"; import { useNavigate } from "react-router-dom"; import useRestStates from "../../../hooks/useResetStates"; diff --git a/app/src/components/layout/sidebarLeft/SideBarLeft.tsx b/app/src/components/layout/sidebarLeft/SideBarLeft.tsx index ad26627..670a0f7 100644 --- a/app/src/components/layout/sidebarLeft/SideBarLeft.tsx +++ b/app/src/components/layout/sidebarLeft/SideBarLeft.tsx @@ -2,9 +2,9 @@ import React, { useEffect, useState } from "react"; import ToggleHeader from "../../ui/inputs/ToggleHeader"; import Outline from "./Outline"; import Header from "./Header"; -import { useToggleStore } from "../../../store/useUIToggleStore"; +import { useToggleStore } from "../../../store/ui/useUIToggleStore"; import Assets from "./assetList/Assets"; -import useModuleStore from "../../../store/useModuleStore"; +import useModuleStore from "../../../store/ui/useModuleStore"; import Widgets from "./visualization/widgets/Widgets"; import Templates from "../../../modules/visualization/template/Templates"; import Search from "../../ui/inputs/Search"; diff --git a/app/src/components/layout/sidebarLeft/visualization/widgets/Widgets2D.tsx b/app/src/components/layout/sidebarLeft/visualization/widgets/Widgets2D.tsx index 20438c0..1088112 100644 --- a/app/src/components/layout/sidebarLeft/visualization/widgets/Widgets2D.tsx +++ b/app/src/components/layout/sidebarLeft/visualization/widgets/Widgets2D.tsx @@ -1,5 +1,5 @@ import React from "react"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import { ChartType } from "chart.js/auto"; import ChartComponent from "./ChartComponent"; import { StockIncreseIcon } from "../../../../icons/RealTimeVisulationIcons"; diff --git a/app/src/components/layout/sidebarRight/Header.tsx b/app/src/components/layout/sidebarRight/Header.tsx index 292d00a..0377e3f 100644 --- a/app/src/components/layout/sidebarRight/Header.tsx +++ b/app/src/components/layout/sidebarRight/Header.tsx @@ -5,9 +5,9 @@ import { ActiveUser } from "../../../types/users"; import CollaborationPopup from "../../templates/CollaborationPopup"; import { getAvatarColor } from "../../../modules/collaboration/functions/getAvatarColor"; import { useSelectedUserStore } from "../../../store/collaboration/useCollabStore"; -import { useToggleStore } from "../../../store/useUIToggleStore"; +import { useToggleStore } from "../../../store/ui/useUIToggleStore"; import { ToggleSidebarIcon } from "../../icons/HeaderIcons"; -import useModuleStore from "../../../store/useModuleStore"; +import useModuleStore from "../../../store/ui/useModuleStore"; import { getUserData } from "../../../functions/getUserData"; const Header: React.FC = () => { diff --git a/app/src/components/layout/sidebarRight/SideBarRight.tsx b/app/src/components/layout/sidebarRight/SideBarRight.tsx index 2d88241..0b7d931 100644 --- a/app/src/components/layout/sidebarRight/SideBarRight.tsx +++ b/app/src/components/layout/sidebarRight/SideBarRight.tsx @@ -1,8 +1,8 @@ import React, { useEffect, useState } from "react"; import Header from "./Header"; -import useModuleStore, { useSubModuleStore } from "../../../store/useModuleStore"; +import useModuleStore, { useSubModuleStore } from "../../../store/ui/useModuleStore"; import { AnalysisIcon, FilePackageIcon, MechanicsIcon, PropertiesIcon, SimulationIcon, } from "../../icons/SimulationIcons"; -import { useToggleStore } from "../../../store/useUIToggleStore"; +import { useToggleStore } from "../../../store/ui/useUIToggleStore"; import Visualization from "./visualization/Visualization"; import Analysis from "./analysis/Analysis"; import Simulations from "./simulation/Simulations"; diff --git a/app/src/components/layout/sidebarRight/simulation/Simulations.tsx b/app/src/components/layout/sidebarRight/simulation/Simulations.tsx index 0858e5d..9cb118e 100644 --- a/app/src/components/layout/sidebarRight/simulation/Simulations.tsx +++ b/app/src/components/layout/sidebarRight/simulation/Simulations.tsx @@ -14,7 +14,7 @@ import { renameProductApi } from "../../../../services/simulation/products/renam import { determineExecutionMachineSequences } from "../../../../modules/simulation/simulator/functions/determineExecutionMachineSequences"; import ComparePopUp from "../../../ui/compareVersion/Compare"; import { useCompareStore, useSaveVersion, } from "../../../../store/builder/store"; -import { useToggleStore } from "../../../../store/useUIToggleStore"; +import { useToggleStore } from "../../../../store/ui/useUIToggleStore"; import { useProductContext } from "../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; import { useVersionContext } from "../../../../modules/builder/version/versionContext"; diff --git a/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx b/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx index 8cc35e1..38ef321 100644 --- a/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx +++ b/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx @@ -1,7 +1,7 @@ import { AddIcon, ArrowIcon, CloseIcon, KebabIcon, LocationIcon } from "../../../icons/ExportCommonIcons"; import RenameInput from "../../../ui/inputs/RenameInput"; import { useVersionHistoryStore } from "../../../../store/builder/useVersionHistoryStore"; -import { useSubModuleStore } from "../../../../store/useModuleStore"; +import { useSubModuleStore } from "../../../../store/ui/useModuleStore"; import useVersionHistoryVisibleStore from "../../../../store/builder/store"; import { useParams } from "react-router-dom"; import { getVersionDataApi } from "../../../../services/factoryBuilder/versionControl/getVersionDataApi"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/BarChartInput.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/BarChartInput.tsx index 09da02b..0b2338e 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/BarChartInput.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/BarChartInput.tsx @@ -4,7 +4,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { useParams } from "react-router-dom"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/FleetEfficiencyInputComponent.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/FleetEfficiencyInputComponent.tsx index fa6ef5c..6be8f9a 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/FleetEfficiencyInputComponent.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/FleetEfficiencyInputComponent.tsx @@ -4,7 +4,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/FlotingWidgetInput.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/FlotingWidgetInput.tsx index c8247b6..d41f998 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/FlotingWidgetInput.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/FlotingWidgetInput.tsx @@ -4,7 +4,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/InputSelecterComponent.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/InputSelecterComponent.tsx index 210e2b4..e55ee08 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/InputSelecterComponent.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/InputSelecterComponent.tsx @@ -10,7 +10,7 @@ import Widget2InputCard3D from './Widget2InputCard3D' import Widget3InputCard3D from './Widget3InputCard3D' import Widget4InputCard3D from './Widget4InputCard3D' import WarehouseThroughputInputComponent from './WarehouseThroughputInputComponent' -import { useWidgetStore } from '../../../../../store/useWidgetStore' +import { useWidgetStore } from '../../../../../store/ui/useWidgetStore' // const InputSelecterComponent = () => { // const { selectedChartId } = useWidgetStore(); diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/LineGrapInput.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/LineGrapInput.tsx index 29263fe..93a9908 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/LineGrapInput.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/LineGrapInput.tsx @@ -120,7 +120,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { useParams } from "react-router-dom"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/PieChartInput.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/PieChartInput.tsx index 26988aa..106ca5c 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/PieChartInput.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/PieChartInput.tsx @@ -4,7 +4,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { useParams } from "react-router-dom"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress1Input.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress1Input.tsx index 6854848..c4be0ba 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress1Input.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress1Input.tsx @@ -4,7 +4,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { useParams } from "react-router-dom"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress2Input.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress2Input.tsx index 2482346..32f5ebe 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress2Input.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress2Input.tsx @@ -4,7 +4,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { useParams } from "react-router-dom"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/WarehouseThroughputInputComponent.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/WarehouseThroughputInputComponent.tsx index e82aa58..69801df 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/WarehouseThroughputInputComponent.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/WarehouseThroughputInputComponent.tsx @@ -4,7 +4,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget2InputCard3D.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget2InputCard3D.tsx index 0889809..d360122 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget2InputCard3D.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget2InputCard3D.tsx @@ -4,7 +4,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget3InputCard3D.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget3InputCard3D.tsx index a236d5a..ad91d4d 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget3InputCard3D.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget3InputCard3D.tsx @@ -4,7 +4,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget4InputCard3D.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget4InputCard3D.tsx index df09e7b..9bdeb5e 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget4InputCard3D.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget4InputCard3D.tsx @@ -4,7 +4,7 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/components/layout/sidebarRight/visualization/data/Data.tsx b/app/src/components/layout/sidebarRight/visualization/data/Data.tsx index d41a38f..01bd169 100644 --- a/app/src/components/layout/sidebarRight/visualization/data/Data.tsx +++ b/app/src/components/layout/sidebarRight/visualization/data/Data.tsx @@ -1,5 +1,5 @@ import { useEffect, useState } from "react"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import { AddIcon, RemoveIcon } from "../../../../icons/ExportCommonIcons"; import MultiLevelDropDown from "../../../../ui/inputs/MultiLevelDropDown"; import LineGrapInput from "../IotInputCards/LineGrapInput"; diff --git a/app/src/components/layout/sidebarRight/visualization/design/Design.tsx b/app/src/components/layout/sidebarRight/visualization/design/Design.tsx index 53ea8a7..afcfbd0 100644 --- a/app/src/components/layout/sidebarRight/visualization/design/Design.tsx +++ b/app/src/components/layout/sidebarRight/visualization/design/Design.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react"; import { ArrowIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import InputRange from "../../../../ui/inputs/InputRange"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import ChartComponent from "../../../sidebarLeft/visualization/widgets/ChartComponent"; const defaultStyle = { diff --git a/app/src/components/ui/ModuleToggle.tsx b/app/src/components/ui/ModuleToggle.tsx index dea27c7..f3d0407 100644 --- a/app/src/components/ui/ModuleToggle.tsx +++ b/app/src/components/ui/ModuleToggle.tsx @@ -1,12 +1,12 @@ import React from "react"; -import useModuleStore from "../../store/useModuleStore"; +import useModuleStore from "../../store/ui/useModuleStore"; import { BuilderIcon, CartIcon, SimulationIcon, VisualizationIcon, } from "../icons/ExportModuleIcons"; -import {useToggleStore} from "../../store/useUIToggleStore"; +import {useToggleStore} from "../../store/ui/useUIToggleStore"; import useVersionHistoryStore from "../../store/builder/store"; const ModuleToggle: React.FC = () => { diff --git a/app/src/components/ui/Tools.tsx b/app/src/components/ui/Tools.tsx index 6ae7a81..a538cbf 100644 --- a/app/src/components/ui/Tools.tsx +++ b/app/src/components/ui/Tools.tsx @@ -14,10 +14,10 @@ import { ZoneIcon, } from "../icons/ExportToolsIcons"; import { ArrowIcon, TickIcon } from "../icons/ExportCommonIcons"; -import useModuleStore, { useThreeDStore } from "../../store/useModuleStore"; +import useModuleStore, { useThreeDStore } from "../../store/ui/useModuleStore"; import { handleSaveTemplate } from "../../modules/visualization/functions/handleSaveTemplate"; -import { usePlayButtonStore } from "../../store/usePlayButtonStore"; -import useTemplateStore from "../../store/useTemplateStore"; +import { usePlayButtonStore } from "../../store/ui/usePlayButtonStore"; +import useTemplateStore from "../../store/ui/useTemplateStore"; import { useSelectedZoneStore } from "../../store/visualization/useZoneStore"; import { useActiveTool, @@ -28,7 +28,7 @@ import { useActiveSubTool, useShortcutStore, } from "../../store/builder/store"; -import { useToggleStore } from "../../store/useUIToggleStore"; +import { useToggleStore } from "../../store/ui/useUIToggleStore"; import { use3DWidget, useFloatingWidget, diff --git a/app/src/components/ui/compareVersion/CompareLayOut.tsx b/app/src/components/ui/compareVersion/CompareLayOut.tsx index 29b062a..04169f2 100644 --- a/app/src/components/ui/compareVersion/CompareLayOut.tsx +++ b/app/src/components/ui/compareVersion/CompareLayOut.tsx @@ -12,7 +12,7 @@ import Search from "../inputs/Search"; import OuterClick from "../../../utils/outerClick"; import Scene from "../../../modules/scene/scene"; import { useComparisonProduct } from "../../../store/simulation/useSimulationStore"; -import { usePlayButtonStore } from "../../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../../store/ui/usePlayButtonStore"; import { useVersionHistoryStore } from "../../../store/builder/useVersionHistoryStore"; import { useVersionContext } from "../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../modules/scene/sceneContext"; diff --git a/app/src/components/ui/list/List.tsx b/app/src/components/ui/list/List.tsx index 8f38189..6322554 100644 --- a/app/src/components/ui/list/List.tsx +++ b/app/src/components/ui/list/List.tsx @@ -5,7 +5,7 @@ import { useSelectedZoneStore } from "../../../store/visualization/useZoneStore" import { getZoneData } from "../../../services/visulization/zone/getZones"; import useModuleStore, { useSubModuleStore, -} from "../../../store/useModuleStore"; +} from "../../../store/ui/useModuleStore"; import { ArrowIcon, EyeIcon, diff --git a/app/src/components/ui/menu/menu.tsx b/app/src/components/ui/menu/menu.tsx index 3528176..b403d17 100644 --- a/app/src/components/ui/menu/menu.tsx +++ b/app/src/components/ui/menu/menu.tsx @@ -7,7 +7,7 @@ import useVersionHistoryVisibleStore, { } from "../../../store/builder/store"; import useModuleStore, { useSubModuleStore, -} from "../../../store/useModuleStore"; +} from "../../../store/ui/useModuleStore"; import { useVersionHistoryStore } from "../../../store/builder/useVersionHistoryStore"; interface MenuBarProps { diff --git a/app/src/components/ui/simulation/AssetDetailsCard.tsx b/app/src/components/ui/simulation/AssetDetailsCard.tsx index 34dfb6f..f762a2b 100644 --- a/app/src/components/ui/simulation/AssetDetailsCard.tsx +++ b/app/src/components/ui/simulation/AssetDetailsCard.tsx @@ -5,7 +5,7 @@ import { SimulationStatusIcon, StorageCapacityIcon, } from "../../icons/SimulationIcons"; -import { usePlayButtonStore } from "../../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../../store/ui/usePlayButtonStore"; interface AssetDetailsCardInterface { name: string; diff --git a/app/src/components/ui/simulation/simulationPlayer.tsx b/app/src/components/ui/simulation/simulationPlayer.tsx index e2ec99f..adeb6eb 100644 --- a/app/src/components/ui/simulation/simulationPlayer.tsx +++ b/app/src/components/ui/simulation/simulationPlayer.tsx @@ -10,7 +10,7 @@ import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore, -} from "../../../store/usePlayButtonStore"; +} from "../../../store/ui/usePlayButtonStore"; import { DailyProductionIcon, EndIcon, @@ -25,11 +25,11 @@ import { import { getAvatarColor } from "../../../modules/collaboration/functions/getAvatarColor"; import useModuleStore, { useSubModuleStore, -} from "../../../store/useModuleStore"; +} from "../../../store/ui/useModuleStore"; import ProductionCapacity from "../analysis/ThroughputSummary"; import ThroughputSummary from "../analysis/ProductionCapacity"; import ROISummary from "../analysis/ROISummary"; -import { usePlayerStore } from "../../../store/useUIToggleStore"; +import { usePlayerStore } from "../../../store/ui/useUIToggleStore"; import { useComparisonProduct } from "../../../store/simulation/useSimulationStore"; import InputToggle from "../inputs/InputToggle"; diff --git a/app/src/modules/builder/Decal/decalCreator/decalCreator.tsx b/app/src/modules/builder/Decal/decalCreator/decalCreator.tsx index 5e9ebaa..836bd8b 100644 --- a/app/src/modules/builder/Decal/decalCreator/decalCreator.tsx +++ b/app/src/modules/builder/Decal/decalCreator/decalCreator.tsx @@ -4,7 +4,7 @@ import { useThree } from '@react-three/fiber'; import { useParams } from 'react-router-dom'; import { useSocketStore } from '../../../../store/builder/store'; import { useBuilderStore } from '../../../../store/builder/useBuilderStore'; -import useModuleStore from '../../../../store/useModuleStore'; +import useModuleStore from '../../../../store/ui/useModuleStore'; import { useSceneContext } from '../../../scene/sceneContext'; import { useVersionContext } from '../../version/versionContext'; diff --git a/app/src/modules/builder/Decal/decalInstance/decalInstance.tsx b/app/src/modules/builder/Decal/decalInstance/decalInstance.tsx index 9a095d9..85d6c3e 100644 --- a/app/src/modules/builder/Decal/decalInstance/decalInstance.tsx +++ b/app/src/modules/builder/Decal/decalInstance/decalInstance.tsx @@ -5,7 +5,7 @@ import { useBuilderStore } from '../../../../store/builder/useBuilderStore'; import { retrieveImage, storeImage } from '../../../../utils/indexDB/idbUtils'; import defaultMaterial from '../../../../assets/image/fallback/fallback decal 1.png'; -import useModuleStore from '../../../../store/useModuleStore'; +import useModuleStore from '../../../../store/ui/useModuleStore'; import { useEffect, useRef, useState } from 'react'; import { useDecalEventHandlers } from '../eventHandler/useDecalEventHandlers'; diff --git a/app/src/modules/builder/Decal/eventHandler/useDecalEventHandlers.ts b/app/src/modules/builder/Decal/eventHandler/useDecalEventHandlers.ts index c213d69..db8d530 100644 --- a/app/src/modules/builder/Decal/eventHandler/useDecalEventHandlers.ts +++ b/app/src/modules/builder/Decal/eventHandler/useDecalEventHandlers.ts @@ -4,7 +4,7 @@ import { ThreeEvent, useFrame, useThree } from '@react-three/fiber'; import { useEffect, useState } from 'react'; import { useSocketStore, useToggleView, useToolMode } from '../../../../store/builder/store'; import { useBuilderStore } from '../../../../store/builder/useBuilderStore'; -import useModuleStore from '../../../../store/useModuleStore'; +import useModuleStore from '../../../../store/ui/useModuleStore'; import { getUserData } from '../../../../functions/getUserData'; import { useVersionContext } from '../../version/versionContext'; import { useParams } from 'react-router-dom'; diff --git a/app/src/modules/builder/asset/assetsGroup.tsx b/app/src/modules/builder/asset/assetsGroup.tsx index ecdc926..d7b83a6 100644 --- a/app/src/modules/builder/asset/assetsGroup.tsx +++ b/app/src/modules/builder/asset/assetsGroup.tsx @@ -6,7 +6,7 @@ import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader"; import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader"; import { FloorItems, RefMesh } from "../../../types/world/worldTypes"; import Models from "./models/models"; -import useModuleStore from "../../../store/useModuleStore"; +import useModuleStore from "../../../store/ui/useModuleStore"; import { useThree } from "@react-three/fiber"; import { CameraControls } from "@react-three/drei"; import addAssetModel from "./functions/addAssetModel"; diff --git a/app/src/modules/builder/asset/models/model/animator/modelAnimator.tsx b/app/src/modules/builder/asset/models/model/animator/modelAnimator.tsx index d79df60..88947a3 100644 --- a/app/src/modules/builder/asset/models/model/animator/modelAnimator.tsx +++ b/app/src/modules/builder/asset/models/model/animator/modelAnimator.tsx @@ -2,8 +2,8 @@ import { useEffect, useRef, useCallback, useState } from 'react'; import * as THREE from 'three'; import { useFrame } from '@react-three/fiber'; import { useSceneContext } from '../../../../../scene/sceneContext'; -import useModuleStore from '../../../../../../store/useModuleStore'; -import { usePauseButtonStore, useAnimationPlaySpeed } from '../../../../../../store/usePlayButtonStore'; +import useModuleStore from '../../../../../../store/ui/useModuleStore'; +import { usePauseButtonStore, useAnimationPlaySpeed } from '../../../../../../store/ui/usePlayButtonStore'; interface ModelAnimatorProps { asset: Asset; diff --git a/app/src/modules/builder/asset/models/model/eventHandlers/useEventHandlers.ts b/app/src/modules/builder/asset/models/model/eventHandlers/useEventHandlers.ts index 4b97ddb..8cd5899 100644 --- a/app/src/modules/builder/asset/models/model/eventHandlers/useEventHandlers.ts +++ b/app/src/modules/builder/asset/models/model/eventHandlers/useEventHandlers.ts @@ -4,7 +4,7 @@ import { ThreeEvent, useThree } from '@react-three/fiber'; import { useCallback, useEffect, useRef } from 'react'; import { useActiveTool, useResourceManagementId, useToggleView, useZoneAssetId, useSocketStore } from '../../../../../../store/builder/store'; -import useModuleStore, { useSubModuleStore } from '../../../../../../store/useModuleStore'; +import useModuleStore, { useSubModuleStore } from '../../../../../../store/ui/useModuleStore'; import { useSceneContext } from '../../../../../scene/sceneContext'; import { useProductContext } from '../../../../../simulation/products/productContext'; import { useVersionContext } from '../../../../version/versionContext'; diff --git a/app/src/modules/builder/asset/models/model/model.tsx b/app/src/modules/builder/asset/models/model/model.tsx index cc49d5a..1876476 100644 --- a/app/src/modules/builder/asset/models/model/model.tsx +++ b/app/src/modules/builder/asset/models/model/model.tsx @@ -5,7 +5,7 @@ import { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader'; import { useToggleView, useToolMode } from '../../../../../store/builder/store'; import { AssetBoundingBox } from '../../functions/assetBoundingBox'; import { useBuilderStore } from '../../../../../store/builder/useBuilderStore'; -import useModuleStore from '../../../../../store/useModuleStore'; +import useModuleStore from '../../../../../store/ui/useModuleStore'; import { useSceneContext } from '../../../../scene/sceneContext'; import { SkeletonUtils } from 'three-stdlib'; diff --git a/app/src/modules/builder/floor/Instances/Instance/floorInstance.tsx b/app/src/modules/builder/floor/Instances/Instance/floorInstance.tsx index 3559128..924dcba 100644 --- a/app/src/modules/builder/floor/Instances/Instance/floorInstance.tsx +++ b/app/src/modules/builder/floor/Instances/Instance/floorInstance.tsx @@ -1,7 +1,7 @@ import { useMemo } from "react"; import { Shape, Vector2, DoubleSide, TextureLoader, RepeatWrapping, SRGBColorSpace, NoColorSpace, ExtrudeGeometry } from "three"; import { useLoader } from "@react-three/fiber"; -import useModuleStore from "../../../../../store/useModuleStore"; +import useModuleStore from "../../../../../store/ui/useModuleStore"; import { useBuilderStore } from "../../../../../store/builder/useBuilderStore"; import { useToggleView } from "../../../../../store/builder/store"; import * as Constants from "../../../../../types/world/worldConstants"; diff --git a/app/src/modules/builder/floor/Instances/floorInstances.tsx b/app/src/modules/builder/floor/Instances/floorInstances.tsx index 9ad65db..b19a10d 100644 --- a/app/src/modules/builder/floor/Instances/floorInstances.tsx +++ b/app/src/modules/builder/floor/Instances/floorInstances.tsx @@ -7,7 +7,7 @@ import Line from '../../line/line'; import Point from '../../point/point'; import FloorInstance from './Instance/floorInstance'; import Floor2DInstance from './Instance/floor2DInstance'; -import useModuleStore from '../../../../store/useModuleStore'; +import useModuleStore from '../../../../store/ui/useModuleStore'; import { useBuilderStore } from '../../../../store/builder/useBuilderStore'; function FloorInstances() { diff --git a/app/src/modules/builder/floor/floorGroup.tsx b/app/src/modules/builder/floor/floorGroup.tsx index d782e1a..1349f82 100644 --- a/app/src/modules/builder/floor/floorGroup.tsx +++ b/app/src/modules/builder/floor/floorGroup.tsx @@ -4,7 +4,7 @@ import { useBuilderStore } from '../../../store/builder/useBuilderStore'; import { useVersionContext } from '../version/versionContext'; import { useSceneContext } from '../../scene/sceneContext'; import { useParams } from 'react-router-dom'; -import useModuleStore from '../../../store/useModuleStore'; +import useModuleStore from '../../../store/ui/useModuleStore'; import FloorCreator from './floorCreator/floorCreator'; import FloorInstances from './Instances/floorInstances'; import { getFloorsApi } from '../../../services/factoryBuilder/floor/getFloorsApi'; diff --git a/app/src/modules/builder/wall/Instances/instance/wall.tsx b/app/src/modules/builder/wall/Instances/instance/wall.tsx index 293be01..47b5f21 100644 --- a/app/src/modules/builder/wall/Instances/instance/wall.tsx +++ b/app/src/modules/builder/wall/Instances/instance/wall.tsx @@ -3,7 +3,7 @@ import { Base } from '@react-three/csg'; import { useMemo, useRef, useState } from 'react'; import { MeshDiscardMaterial } from '@react-three/drei'; import { useFrame, useThree } from '@react-three/fiber'; -import useModuleStore from '../../../../../store/useModuleStore'; +import useModuleStore from '../../../../../store/ui/useModuleStore'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useWallClassification } from './helpers/useWallClassification'; import { useToggleView, useWallVisibility } from '../../../../../store/builder/store'; diff --git a/app/src/modules/builder/wall/Instances/wallInstances.tsx b/app/src/modules/builder/wall/Instances/wallInstances.tsx index 6461225..98eac59 100644 --- a/app/src/modules/builder/wall/Instances/wallInstances.tsx +++ b/app/src/modules/builder/wall/Instances/wallInstances.tsx @@ -13,7 +13,7 @@ import * as Constants from '../../../../types/world/worldConstants'; import texturePath from "../../../../assets/textures/floor/white.png"; import texturePathDark from "../../../../assets/textures/floor/black.png"; -import useModuleStore from '../../../../store/useModuleStore'; +import useModuleStore from '../../../../store/ui/useModuleStore'; function WallInstances() { const { wallStore } = useSceneContext(); diff --git a/app/src/modules/builder/wall/wallGroup.tsx b/app/src/modules/builder/wall/wallGroup.tsx index 3561751..b286d15 100644 --- a/app/src/modules/builder/wall/wallGroup.tsx +++ b/app/src/modules/builder/wall/wallGroup.tsx @@ -4,7 +4,7 @@ import { useBuilderStore } from '../../../store/builder/useBuilderStore'; import { useVersionContext } from '../version/versionContext'; import { useSceneContext } from '../../scene/sceneContext'; import { useParams } from 'react-router-dom'; -import useModuleStore from '../../../store/useModuleStore'; +import useModuleStore from '../../../store/ui/useModuleStore'; import WallCreator from './wallCreator/wallCreator'; import WallInstances from './Instances/wallInstances'; diff --git a/app/src/modules/builder/wallAsset/Instances/Instance/eventHandler/useWallAssetEventHandler.ts b/app/src/modules/builder/wallAsset/Instances/Instance/eventHandler/useWallAssetEventHandler.ts index 1fbce4c..82f8e17 100644 --- a/app/src/modules/builder/wallAsset/Instances/Instance/eventHandler/useWallAssetEventHandler.ts +++ b/app/src/modules/builder/wallAsset/Instances/Instance/eventHandler/useWallAssetEventHandler.ts @@ -3,7 +3,7 @@ import { useCallback, useEffect, useRef } from 'react'; import { ThreeEvent, useThree } from '@react-three/fiber'; import { useParams } from 'react-router-dom'; import { useActiveTool, useSocketStore, useToggleView } from '../../../../../../store/builder/store'; -import useModuleStore from '../../../../../../store/useModuleStore'; +import useModuleStore from '../../../../../../store/ui/useModuleStore'; import { useSceneContext } from '../../../../../scene/sceneContext'; import { useBuilderStore } from '../../../../../../store/builder/useBuilderStore'; import { useVersionContext } from '../../../../version/versionContext'; diff --git a/app/src/modules/builder/wallAsset/wallAssetCreator.tsx b/app/src/modules/builder/wallAsset/wallAssetCreator.tsx index effc0ed..8baeb83 100644 --- a/app/src/modules/builder/wallAsset/wallAssetCreator.tsx +++ b/app/src/modules/builder/wallAsset/wallAssetCreator.tsx @@ -1,6 +1,6 @@ import { useThree } from '@react-three/fiber'; import { useEffect } from 'react' -import useModuleStore from '../../../store/useModuleStore'; +import useModuleStore from '../../../store/ui/useModuleStore'; import { useSelectedItem, useSocketStore, useToggleView } from '../../../store/builder/store'; import { MathUtils, Vector3 } from 'three'; import { useSceneContext } from '../../scene/sceneContext'; diff --git a/app/src/modules/builder/wallAsset/wallAssetGroup.tsx b/app/src/modules/builder/wallAsset/wallAssetGroup.tsx index 95e2e90..e0cab44 100644 --- a/app/src/modules/builder/wallAsset/wallAssetGroup.tsx +++ b/app/src/modules/builder/wallAsset/wallAssetGroup.tsx @@ -4,7 +4,7 @@ import { useBuilderStore } from '../../../store/builder/useBuilderStore'; import { useVersionContext } from '../version/versionContext'; import { useSceneContext } from '../../scene/sceneContext'; import { useParams } from 'react-router-dom'; -import useModuleStore from '../../../store/useModuleStore'; +import useModuleStore from '../../../store/ui/useModuleStore'; import WallAssetCreator from './wallAssetCreator' import WallAssetInstances from './Instances/wallAssetInstances' import { getWallAssetsApi } from '../../../services/factoryBuilder/asset/wallAsset/getWallAssetsApi'; diff --git a/app/src/modules/builder/zone/zoneGroup.tsx b/app/src/modules/builder/zone/zoneGroup.tsx index 08d3e9c..5ca0c68 100644 --- a/app/src/modules/builder/zone/zoneGroup.tsx +++ b/app/src/modules/builder/zone/zoneGroup.tsx @@ -4,7 +4,7 @@ import { useBuilderStore } from '../../../store/builder/useBuilderStore'; import { useVersionContext } from '../version/versionContext'; import { useSceneContext } from '../../scene/sceneContext'; import { useParams } from 'react-router-dom'; -import useModuleStore from '../../../store/useModuleStore'; +import useModuleStore from '../../../store/ui/useModuleStore'; import ZoneCreator from './zoneCreator/zoneCreator'; import ZoneInstances from './Instances/zoneInstances'; diff --git a/app/src/modules/collaboration/camera/collabCams.tsx b/app/src/modules/collaboration/camera/collabCams.tsx index 02cd535..2e4c536 100644 --- a/app/src/modules/collaboration/camera/collabCams.tsx +++ b/app/src/modules/collaboration/camera/collabCams.tsx @@ -9,10 +9,10 @@ import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader"; import { useNavigate } from "react-router-dom"; import { Html } from "@react-three/drei"; import CollabUserIcon from "./collabUserIcon"; -import useModuleStore from "../../../store/useModuleStore"; +import useModuleStore from "../../../store/ui/useModuleStore"; import { getAvatarColor } from "../functions/getAvatarColor"; import { useSelectedUserStore } from "../../../store/collaboration/useCollabStore"; -import { usePlayButtonStore } from "../../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../../store/ui/usePlayButtonStore"; import setCameraView from "../functions/setCameraView"; import { getUserData } from "../../../functions/getUserData"; diff --git a/app/src/modules/collaboration/comments/instances/commentInstance/commentInstance.tsx b/app/src/modules/collaboration/comments/instances/commentInstance/commentInstance.tsx index 5740b6e..824f8de 100644 --- a/app/src/modules/collaboration/comments/instances/commentInstance/commentInstance.tsx +++ b/app/src/modules/collaboration/comments/instances/commentInstance/commentInstance.tsx @@ -1,6 +1,6 @@ import { Html, TransformControls } from '@react-three/drei'; import { useEffect, useRef, useState } from 'react' -import { usePlayButtonStore } from '../../../../../store/usePlayButtonStore'; +import { usePlayButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import CommentThreads from '../../../../../components/ui/collaboration/CommentThreads'; import { useSelectedComment } from '../../../../../store/builder/store'; import { Group, Object3D, Vector2, Vector3 } from 'three'; diff --git a/app/src/modules/scene/controls/contextControls/contextControls.tsx b/app/src/modules/scene/controls/contextControls/contextControls.tsx index 7b99956..95d602e 100644 --- a/app/src/modules/scene/controls/contextControls/contextControls.tsx +++ b/app/src/modules/scene/controls/contextControls/contextControls.tsx @@ -3,7 +3,7 @@ import { useThree } from "@react-three/fiber"; import { CameraControls, Html, ScreenSpace } from "@react-three/drei"; import { useContextActionStore, useRenameModeStore, useToggleView, useToolMode, } from "../../../../store/builder/store"; import ContextMenu from "../../../../components/ui/menu/contextMenu"; -import useModuleStore from "../../../../store/useModuleStore"; +import useModuleStore from "../../../../store/ui/useModuleStore"; import { useSceneContext } from "../../sceneContext"; function ContextControls() { diff --git a/app/src/modules/scene/controls/selectionControls/selection2D/moveControls2D.tsx b/app/src/modules/scene/controls/selectionControls/selection2D/moveControls2D.tsx index 413e26f..7c071cb 100644 --- a/app/src/modules/scene/controls/selectionControls/selection2D/moveControls2D.tsx +++ b/app/src/modules/scene/controls/selectionControls/selection2D/moveControls2D.tsx @@ -8,7 +8,7 @@ import { getUserData } from "../../../../../functions/getUserData"; import { useSceneContext } from "../../../sceneContext"; import { useVersionContext } from "../../../../builder/version/versionContext"; import { useSelectedPoints } from "../../../../../store/simulation/useSimulationStore"; -import useModuleStore from "../../../../../store/useModuleStore"; +import useModuleStore from "../../../../../store/ui/useModuleStore"; import { calculateAssetTransformationOnWall } from "../../../../builder/wallAsset/Instances/Instance/functions/calculateAssetTransformationOnWall"; import { upsertAisleApi } from "../../../../../services/factoryBuilder/aisle/upsertAisleApi"; diff --git a/app/src/modules/scene/controls/selectionControls/selection2D/selectionControls2D.tsx b/app/src/modules/scene/controls/selectionControls/selection2D/selectionControls2D.tsx index 6cf9307..140c2c4 100644 --- a/app/src/modules/scene/controls/selectionControls/selection2D/selectionControls2D.tsx +++ b/app/src/modules/scene/controls/selectionControls/selection2D/selectionControls2D.tsx @@ -4,7 +4,7 @@ import { useThree } from "@react-three/fiber"; import { SelectionHelper } from "../helper/selectionHelper"; import { SelectionBox } from "three/examples/jsm/interactive/SelectionBox"; -import useModuleStore from "../../../../../store/useModuleStore"; +import useModuleStore from "../../../../../store/ui/useModuleStore"; import { useParams } from "react-router-dom"; import { getUserData } from "../../../../../functions/getUserData"; import { useSceneContext } from "../../../sceneContext"; diff --git a/app/src/modules/scene/controls/selectionControls/selection3D/moveControls3D.tsx b/app/src/modules/scene/controls/selectionControls/selection3D/moveControls3D.tsx index cb15a43..bcc31ba 100644 --- a/app/src/modules/scene/controls/selectionControls/selection3D/moveControls3D.tsx +++ b/app/src/modules/scene/controls/selectionControls/selection3D/moveControls3D.tsx @@ -12,7 +12,7 @@ import { useProductContext } from "../../../../simulation/products/productContex import { getUserData } from "../../../../../functions/getUserData"; import { useSceneContext } from "../../../sceneContext"; import { useVersionContext } from "../../../../builder/version/versionContext"; -import useModuleStore from "../../../../../store/useModuleStore"; +import useModuleStore from "../../../../../store/ui/useModuleStore"; import { setAssetsApi } from '../../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi'; diff --git a/app/src/modules/scene/controls/selectionControls/selection3D/rotateControls3D.tsx b/app/src/modules/scene/controls/selectionControls/selection3D/rotateControls3D.tsx index 1f3dbe7..3a5279c 100644 --- a/app/src/modules/scene/controls/selectionControls/selection3D/rotateControls3D.tsx +++ b/app/src/modules/scene/controls/selectionControls/selection3D/rotateControls3D.tsx @@ -11,7 +11,7 @@ import { useSceneContext } from "../../../sceneContext"; import { useVersionContext } from "../../../../builder/version/versionContext"; import { detectModifierKeys } from "../../../../../utils/shortcutkeys/detectModifierKeys"; import { handleAssetRotationSnap } from "./functions/handleAssetRotationSnap"; -import useModuleStore from "../../../../../store/useModuleStore"; +import useModuleStore from "../../../../../store/ui/useModuleStore"; import { setAssetsApi } from '../../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi'; diff --git a/app/src/modules/scene/controls/selectionControls/selection3D/selectionControls3D.tsx b/app/src/modules/scene/controls/selectionControls/selection3D/selectionControls3D.tsx index 5de1f82..9028403 100644 --- a/app/src/modules/scene/controls/selectionControls/selection3D/selectionControls3D.tsx +++ b/app/src/modules/scene/controls/selectionControls/selection3D/selectionControls3D.tsx @@ -4,7 +4,7 @@ import { useThree } from "@react-three/fiber"; import { SelectionHelper } from "../helper/selectionHelper"; import { SelectionBox } from "three/examples/jsm/interactive/SelectionBox"; -import useModuleStore from "../../../../../store/useModuleStore"; +import useModuleStore from "../../../../../store/ui/useModuleStore"; import { useParams } from "react-router-dom"; import { getUserData } from "../../../../../functions/getUserData"; import { useSceneContext } from "../../../sceneContext"; diff --git a/app/src/modules/scene/controls/undoRedoControls/undoRedo3D/undoRedo3DControls.tsx b/app/src/modules/scene/controls/undoRedoControls/undoRedo3D/undoRedo3DControls.tsx index 3ca5633..b0fad95 100644 --- a/app/src/modules/scene/controls/undoRedoControls/undoRedo3D/undoRedo3DControls.tsx +++ b/app/src/modules/scene/controls/undoRedoControls/undoRedo3D/undoRedo3DControls.tsx @@ -3,7 +3,7 @@ import { useSceneContext } from '../../../sceneContext' import { detectModifierKeys } from '../../../../../utils/shortcutkeys/detectModifierKeys'; import { useSocketStore, useToggleView } from '../../../../../store/builder/store'; import { useVersionContext } from '../../../../builder/version/versionContext'; -import useModuleStore from '../../../../../store/useModuleStore'; +import useModuleStore from '../../../../../store/ui/useModuleStore'; import use3DUndoHandler from '../handlers/use3DUndoHandler'; import use3DRedoHandler from '../handlers/use3DRedoHandler'; diff --git a/app/src/modules/scene/scene.tsx b/app/src/modules/scene/scene.tsx index 9d154c4..e68ed00 100644 --- a/app/src/modules/scene/scene.tsx +++ b/app/src/modules/scene/scene.tsx @@ -8,7 +8,7 @@ import Visualization from "../visualization/visualization"; import Setup from "./setup/setup"; import Simulation from "../simulation/simulation"; import Collaboration from "../collaboration/collaboration"; -import useModuleStore from "../../store/useModuleStore"; +import useModuleStore from "../../store/ui/useModuleStore"; import { useParams } from "react-router-dom"; import { getAllProjects } from "../../services/dashboard/getAllProjects"; import { getUserData } from "../../functions/getUserData"; diff --git a/app/src/modules/simulation/actions/conveyor/actionHandler/useDelayHandler.ts b/app/src/modules/simulation/actions/conveyor/actionHandler/useDelayHandler.ts index 63fd0e5..f6cbafd 100644 --- a/app/src/modules/simulation/actions/conveyor/actionHandler/useDelayHandler.ts +++ b/app/src/modules/simulation/actions/conveyor/actionHandler/useDelayHandler.ts @@ -1,6 +1,6 @@ import { useCallback, useEffect, useRef } from "react"; import { useFrame } from "@react-three/fiber"; -import { usePlayButtonStore, usePauseButtonStore, useResetButtonStore, useAnimationPlaySpeed } from "../../../../../store/usePlayButtonStore"; +import { usePlayButtonStore, usePauseButtonStore, useResetButtonStore, useAnimationPlaySpeed } from "../../../../../store/ui/usePlayButtonStore"; import { useSceneContext } from "../../../../scene/sceneContext"; interface DelayInstance { diff --git a/app/src/modules/simulation/actions/conveyor/actionHandler/useSpawnHandler.ts b/app/src/modules/simulation/actions/conveyor/actionHandler/useSpawnHandler.ts index 0fece9a..37b82bf 100644 --- a/app/src/modules/simulation/actions/conveyor/actionHandler/useSpawnHandler.ts +++ b/app/src/modules/simulation/actions/conveyor/actionHandler/useSpawnHandler.ts @@ -1,7 +1,7 @@ import { useCallback, useEffect, useState } from "react"; import * as THREE from 'three'; import { useFrame } from "@react-three/fiber"; -import { usePlayButtonStore, useAnimationPlaySpeed, usePauseButtonStore, useResetButtonStore } from "../../../../../store/usePlayButtonStore"; +import { usePlayButtonStore, useAnimationPlaySpeed, usePauseButtonStore, useResetButtonStore } from "../../../../../store/ui/usePlayButtonStore"; import { useSceneContext } from "../../../../scene/sceneContext"; import { useProductContext } from "../../../products/productContext"; diff --git a/app/src/modules/simulation/actions/storageUnit/actionHandler/useRetrieveHandler.ts b/app/src/modules/simulation/actions/storageUnit/actionHandler/useRetrieveHandler.ts index 7f74744..9a13a92 100644 --- a/app/src/modules/simulation/actions/storageUnit/actionHandler/useRetrieveHandler.ts +++ b/app/src/modules/simulation/actions/storageUnit/actionHandler/useRetrieveHandler.ts @@ -1,6 +1,6 @@ import { useCallback, useState, useEffect, useRef } from "react"; import { useFrame } from "@react-three/fiber"; -import { usePlayButtonStore, usePauseButtonStore, useResetButtonStore, useAnimationPlaySpeed } from "../../../../../store/usePlayButtonStore"; +import { usePlayButtonStore, usePauseButtonStore, useResetButtonStore, useAnimationPlaySpeed } from "../../../../../store/ui/usePlayButtonStore"; import { useSceneContext } from "../../../../scene/sceneContext"; import { useProductContext } from "../../../products/productContext"; import { useHumanEventManager } from "../../../human/eventManager/useHumanEventManager"; diff --git a/app/src/modules/simulation/actions/useActionHandler.ts b/app/src/modules/simulation/actions/useActionHandler.ts index 73c34bb..18806ef 100644 --- a/app/src/modules/simulation/actions/useActionHandler.ts +++ b/app/src/modules/simulation/actions/useActionHandler.ts @@ -1,7 +1,7 @@ import { usePlayButtonStore, useResetButtonStore, -} from "../../../store/usePlayButtonStore"; +} from "../../../store/ui/usePlayButtonStore"; import { useConveyorActions } from "./conveyor/useConveyorActions"; import { useMachineActions } from "./machine/useMachineActions"; import { useRoboticArmActions } from "./roboticArm/useRoboticArmActions"; diff --git a/app/src/modules/simulation/analysis/ROI/roiData.tsx b/app/src/modules/simulation/analysis/ROI/roiData.tsx index 662ba2b..4eea0ed 100644 --- a/app/src/modules/simulation/analysis/ROI/roiData.tsx +++ b/app/src/modules/simulation/analysis/ROI/roiData.tsx @@ -1,6 +1,6 @@ import React, { useEffect } from 'react' import { CompareProduct, useCompareProductDataStore, useInputValues, useMachineDowntime, useMachineUptime, useProductionCapacityData, useROISummaryData, useThroughPutData } from '../../../../store/builder/store'; -import { usePlayButtonStore } from '../../../../store/usePlayButtonStore'; +import { usePlayButtonStore } from '../../../../store/ui/usePlayButtonStore'; import { useProductContext } from '../../products/productContext'; import { useSceneContext } from '../../../scene/sceneContext'; diff --git a/app/src/modules/simulation/analysis/productionCapacity/productionCapacityData.tsx b/app/src/modules/simulation/analysis/productionCapacity/productionCapacityData.tsx index f7891e7..09789fd 100644 --- a/app/src/modules/simulation/analysis/productionCapacity/productionCapacityData.tsx +++ b/app/src/modules/simulation/analysis/productionCapacity/productionCapacityData.tsx @@ -1,6 +1,6 @@ import { useEffect } from 'react' import { useInputValues, useProductionCapacityData, useThroughPutData } from '../../../../store/builder/store' -import { usePlayButtonStore } from '../../../../store/usePlayButtonStore'; +import { usePlayButtonStore } from '../../../../store/ui/usePlayButtonStore'; export default function ProductionCapacityData() { const { throughputData } = useThroughPutData() diff --git a/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx b/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx index 31fbf8a..764d651 100644 --- a/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx +++ b/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx @@ -1,7 +1,7 @@ import { useEffect } from 'react'; import { determineExecutionMachineSequences } from '../../simulator/functions/determineExecutionMachineSequences'; import { useInputValues, useMachineCount, useMachineDowntime, useMachineUptime, useMaterialCycle, useProcessBar, useThroughPutData } from '../../../../store/builder/store'; -import { usePlayButtonStore } from '../../../../store/usePlayButtonStore'; +import { usePlayButtonStore } from '../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../scene/sceneContext'; import { useProductContext } from '../../products/productContext'; diff --git a/app/src/modules/simulation/conveyor/eventManager/useConveyorEventManager.ts b/app/src/modules/simulation/conveyor/eventManager/useConveyorEventManager.ts index 76a1047..12f6f13 100644 --- a/app/src/modules/simulation/conveyor/eventManager/useConveyorEventManager.ts +++ b/app/src/modules/simulation/conveyor/eventManager/useConveyorEventManager.ts @@ -1,6 +1,6 @@ import { useEffect, useRef } from 'react'; import { useFrame } from '@react-three/fiber'; -import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/usePlayButtonStore'; +import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../scene/sceneContext'; type ConveyorCallback = { diff --git a/app/src/modules/simulation/crane/eventManager/useCraneEventManager.ts b/app/src/modules/simulation/crane/eventManager/useCraneEventManager.ts index dd8af03..96de953 100644 --- a/app/src/modules/simulation/crane/eventManager/useCraneEventManager.ts +++ b/app/src/modules/simulation/crane/eventManager/useCraneEventManager.ts @@ -1,6 +1,6 @@ import { useEffect } from 'react'; import { useFrame } from '@react-three/fiber'; -import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/usePlayButtonStore'; +import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../scene/sceneContext'; import { useProductContext } from '../../products/productContext'; diff --git a/app/src/modules/simulation/crane/instances/animator/pillarJibAnimator.tsx b/app/src/modules/simulation/crane/instances/animator/pillarJibAnimator.tsx index a803cad..81eaec0 100644 --- a/app/src/modules/simulation/crane/instances/animator/pillarJibAnimator.tsx +++ b/app/src/modules/simulation/crane/instances/animator/pillarJibAnimator.tsx @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react'; import * as THREE from 'three'; import { useFrame, useThree } from '@react-three/fiber'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useProductContext } from '../../../products/productContext'; diff --git a/app/src/modules/simulation/crane/instances/instance/pillarJibInstance.tsx b/app/src/modules/simulation/crane/instances/instance/pillarJibInstance.tsx index 67fcaab..ed2300d 100644 --- a/app/src/modules/simulation/crane/instances/instance/pillarJibInstance.tsx +++ b/app/src/modules/simulation/crane/instances/instance/pillarJibInstance.tsx @@ -1,6 +1,6 @@ import { useEffect, useState } from 'react'; import * as THREE from 'three' -import { usePlayButtonStore } from '../../../../../store/usePlayButtonStore'; +import { usePlayButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useProductContext } from '../../../products/productContext'; import { useTriggerHandler } from '../../../triggers/triggerHandler/useTriggerHandler'; diff --git a/app/src/modules/simulation/events/points/creator/pointsCreator.tsx b/app/src/modules/simulation/events/points/creator/pointsCreator.tsx index f2353dc..fd3e451 100644 --- a/app/src/modules/simulation/events/points/creator/pointsCreator.tsx +++ b/app/src/modules/simulation/events/points/creator/pointsCreator.tsx @@ -1,12 +1,12 @@ import { useEffect, useRef, useState } from "react"; import * as THREE from "three"; -import useModuleStore, { useSubModuleStore } from "../../../../../store/useModuleStore"; +import useModuleStore, { useSubModuleStore } from "../../../../../store/ui/useModuleStore"; import { useToolMode } from "../../../../../store/builder/store"; import { TransformControls } from "@react-three/drei"; import { detectModifierKeys } from "../../../../../utils/shortcutkeys/detectModifierKeys"; import { useSelectedEventSphere, useSelectedEventData, useDeletableEventSphere } from "../../../../../store/simulation/useSimulationStore"; import { useThree } from "@react-three/fiber"; -import { usePlayButtonStore } from "../../../../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../../../../store/ui/usePlayButtonStore"; import { upsertProductOrEventApi } from "../../../../../services/simulation/products/UpsertProductOrEventApi"; import { useProductContext } from "../../../products/productContext"; import { useParams } from "react-router-dom"; diff --git a/app/src/modules/simulation/events/triggerConnections/triggerConnector.tsx b/app/src/modules/simulation/events/triggerConnections/triggerConnector.tsx index 400eaf1..3ac26a8 100644 --- a/app/src/modules/simulation/events/triggerConnections/triggerConnector.tsx +++ b/app/src/modules/simulation/events/triggerConnections/triggerConnector.tsx @@ -1,12 +1,12 @@ import { useEffect, useRef, useState } from "react"; import { useFrame, useThree } from "@react-three/fiber"; import * as THREE from "three"; -import { useSubModuleStore } from "../../../../store/useModuleStore"; +import { useSubModuleStore } from "../../../../store/ui/useModuleStore"; import { useSelectedAction, useSelectedAsset, useSelectedEventData } from "../../../../store/simulation/useSimulationStore"; import { handleAddEventToProduct } from "../points/functions/handleAddEventToProduct"; import { QuadraticBezierLine } from "@react-three/drei"; import { upsertProductOrEventApi } from "../../../../services/simulation/products/UpsertProductOrEventApi"; -import { usePlayButtonStore } from "../../../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../../../store/ui/usePlayButtonStore"; import { ArrowOnQuadraticBezier, Arrows } from "../arrows/arrows"; import { useProductContext } from "../../products/productContext"; import { useParams } from "react-router-dom"; diff --git a/app/src/modules/simulation/human/eventManager/useHumanEventManager.ts b/app/src/modules/simulation/human/eventManager/useHumanEventManager.ts index 4a41f6f..855852a 100644 --- a/app/src/modules/simulation/human/eventManager/useHumanEventManager.ts +++ b/app/src/modules/simulation/human/eventManager/useHumanEventManager.ts @@ -1,6 +1,6 @@ import { useEffect } from 'react'; import { useFrame } from '@react-three/fiber'; -import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/usePlayButtonStore'; +import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../scene/sceneContext'; import { useProductContext } from '../../products/productContext'; diff --git a/app/src/modules/simulation/human/human.tsx b/app/src/modules/simulation/human/human.tsx index f3ae920..39ff9a9 100644 --- a/app/src/modules/simulation/human/human.tsx +++ b/app/src/modules/simulation/human/human.tsx @@ -1,6 +1,6 @@ import { useEffect, useState } from 'react' import { useSelectedAnimation, useSelectedEventSphere } from '../../../store/simulation/useSimulationStore'; -import { usePlayButtonStore } from '../../../store/usePlayButtonStore'; +import { usePlayButtonStore } from '../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../scene/sceneContext'; import HumanInstances from './instances/humanInstances' import HumanUi from './instances/instance/humanUi'; diff --git a/app/src/modules/simulation/human/instances/animator/manufacturerAnimator.tsx b/app/src/modules/simulation/human/instances/animator/manufacturerAnimator.tsx index db8ff5f..9c04092 100644 --- a/app/src/modules/simulation/human/instances/animator/manufacturerAnimator.tsx +++ b/app/src/modules/simulation/human/instances/animator/manufacturerAnimator.tsx @@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react'; import { useFrame, useThree } from '@react-three/fiber'; import * as THREE from 'three'; import { Line } from '@react-three/drei'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useProductContext } from '../../../products/productContext'; diff --git a/app/src/modules/simulation/human/instances/animator/operatorAnimator.tsx b/app/src/modules/simulation/human/instances/animator/operatorAnimator.tsx index 62fb8f4..0f41a1a 100644 --- a/app/src/modules/simulation/human/instances/animator/operatorAnimator.tsx +++ b/app/src/modules/simulation/human/instances/animator/operatorAnimator.tsx @@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react'; import { useFrame, useThree } from '@react-three/fiber'; import * as THREE from 'three'; import { Line } from '@react-three/drei'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useProductContext } from '../../../products/productContext'; diff --git a/app/src/modules/simulation/human/instances/animator/workerAnimator.tsx b/app/src/modules/simulation/human/instances/animator/workerAnimator.tsx index eb6c5f9..33d1fa1 100644 --- a/app/src/modules/simulation/human/instances/animator/workerAnimator.tsx +++ b/app/src/modules/simulation/human/instances/animator/workerAnimator.tsx @@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react'; import { useFrame, useThree } from '@react-three/fiber'; import * as THREE from 'three'; import { Line } from '@react-three/drei'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useProductContext } from '../../../products/productContext'; diff --git a/app/src/modules/simulation/human/instances/instance/actions/manufacturerInstance.tsx b/app/src/modules/simulation/human/instances/instance/actions/manufacturerInstance.tsx index d9ec0d9..aa6e910 100644 --- a/app/src/modules/simulation/human/instances/instance/actions/manufacturerInstance.tsx +++ b/app/src/modules/simulation/human/instances/instance/actions/manufacturerInstance.tsx @@ -3,7 +3,7 @@ import * as THREE from 'three'; import { useThree } from '@react-three/fiber'; import { NavMeshQuery } from '@recast-navigation/core'; import { useNavMesh } from '../../../../../../store/builder/store'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../../store/ui/usePlayButtonStore'; import { useTriggerHandler } from '../../../../triggers/triggerHandler/useTriggerHandler'; import { useSceneContext } from '../../../../../scene/sceneContext'; import { useProductContext } from '../../../../products/productContext'; diff --git a/app/src/modules/simulation/human/instances/instance/actions/operatorInstance.tsx b/app/src/modules/simulation/human/instances/instance/actions/operatorInstance.tsx index 4500482..6ab89b0 100644 --- a/app/src/modules/simulation/human/instances/instance/actions/operatorInstance.tsx +++ b/app/src/modules/simulation/human/instances/instance/actions/operatorInstance.tsx @@ -3,7 +3,7 @@ import * as THREE from 'three'; import { useThree } from '@react-three/fiber'; import { NavMeshQuery } from '@recast-navigation/core'; import { useNavMesh } from '../../../../../../store/builder/store'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../../scene/sceneContext'; import { useProductContext } from '../../../../products/productContext'; diff --git a/app/src/modules/simulation/human/instances/instance/actions/workerInstance.tsx b/app/src/modules/simulation/human/instances/instance/actions/workerInstance.tsx index 42d7d76..b62cea1 100644 --- a/app/src/modules/simulation/human/instances/instance/actions/workerInstance.tsx +++ b/app/src/modules/simulation/human/instances/instance/actions/workerInstance.tsx @@ -3,7 +3,7 @@ import * as THREE from 'three'; import { useThree } from '@react-three/fiber'; import { NavMeshQuery } from '@recast-navigation/core'; import { useNavMesh } from '../../../../../../store/builder/store'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../../store/ui/usePlayButtonStore'; import { useTriggerHandler } from '../../../../triggers/triggerHandler/useTriggerHandler'; import { useSceneContext } from '../../../../../scene/sceneContext'; import { useProductContext } from '../../../../products/productContext'; diff --git a/app/src/modules/simulation/human/instances/instance/humanInstance.tsx b/app/src/modules/simulation/human/instances/instance/humanInstance.tsx index 8db35e3..b3aabe5 100644 --- a/app/src/modules/simulation/human/instances/instance/humanInstance.tsx +++ b/app/src/modules/simulation/human/instances/instance/humanInstance.tsx @@ -1,5 +1,5 @@ import { useEffect, useRef } from 'react'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useProductContext } from '../../../products/productContext'; diff --git a/app/src/modules/simulation/machine/eventManager/useMachineEventManager.ts b/app/src/modules/simulation/machine/eventManager/useMachineEventManager.ts index 66dda67..967b4a6 100644 --- a/app/src/modules/simulation/machine/eventManager/useMachineEventManager.ts +++ b/app/src/modules/simulation/machine/eventManager/useMachineEventManager.ts @@ -1,6 +1,6 @@ import { useEffect, useRef } from 'react'; import { useFrame } from '@react-three/fiber'; -import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/usePlayButtonStore'; +import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../scene/sceneContext'; type MachineCallback = { diff --git a/app/src/modules/simulation/machine/instances/animator/machineAnimator.tsx b/app/src/modules/simulation/machine/instances/animator/machineAnimator.tsx index a04119d..cb37090 100644 --- a/app/src/modules/simulation/machine/instances/animator/machineAnimator.tsx +++ b/app/src/modules/simulation/machine/instances/animator/machineAnimator.tsx @@ -1,5 +1,5 @@ import { useEffect, useRef } from 'react'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../scene/sceneContext'; interface MachineAnimatorProps { diff --git a/app/src/modules/simulation/machine/instances/machineInstance/machineInstance.tsx b/app/src/modules/simulation/machine/instances/machineInstance/machineInstance.tsx index 297b22f..a38d113 100644 --- a/app/src/modules/simulation/machine/instances/machineInstance/machineInstance.tsx +++ b/app/src/modules/simulation/machine/instances/machineInstance/machineInstance.tsx @@ -1,5 +1,5 @@ import { useEffect, useRef, useState } from 'react' -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import MachineAnimator from '../animator/machineAnimator'; import { useTriggerHandler } from '../../../triggers/triggerHandler/useTriggerHandler'; import { useSceneContext } from '../../../../scene/sceneContext'; diff --git a/app/src/modules/simulation/materials/collisionDetection/materialCollitionDetector.tsx b/app/src/modules/simulation/materials/collisionDetection/materialCollitionDetector.tsx index a5cf242..b1d0dd4 100644 --- a/app/src/modules/simulation/materials/collisionDetection/materialCollitionDetector.tsx +++ b/app/src/modules/simulation/materials/collisionDetection/materialCollitionDetector.tsx @@ -1,7 +1,7 @@ import { useEffect, useRef } from 'react'; import * as THREE from 'three'; import { useThree, useFrame } from '@react-three/fiber'; -import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/usePlayButtonStore'; +import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/ui/usePlayButtonStore'; import { CameraControls } from '@react-three/drei'; import { useSceneContext } from '../../../scene/sceneContext'; diff --git a/app/src/modules/simulation/materials/instances/animator/materialAnimator.tsx b/app/src/modules/simulation/materials/instances/animator/materialAnimator.tsx index 5cf20c7..5a6b9e2 100644 --- a/app/src/modules/simulation/materials/instances/animator/materialAnimator.tsx +++ b/app/src/modules/simulation/materials/instances/animator/materialAnimator.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useState, useRef } from 'react'; import * as THREE from 'three'; import { useFrame, useThree } from '@react-three/fiber'; -import { usePauseButtonStore, usePlayButtonStore } from '../../../../../store/usePlayButtonStore'; +import { usePauseButtonStore, usePlayButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../scene/sceneContext'; interface MaterialAnimatorProps { diff --git a/app/src/modules/simulation/materials/instances/instance/materialInstance.tsx b/app/src/modules/simulation/materials/instances/instance/materialInstance.tsx index 318759a..4ca26dc 100644 --- a/app/src/modules/simulation/materials/instances/instance/materialInstance.tsx +++ b/app/src/modules/simulation/materials/instances/instance/materialInstance.tsx @@ -3,7 +3,7 @@ import * as THREE from 'three'; import MaterialAnimator from '../animator/materialAnimator'; import { MaterialModel } from '../material/materialModel'; import { useThree } from '@react-three/fiber'; -import { useAnimationPlaySpeed } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed } from '../../../../../store/ui/usePlayButtonStore'; import { useTriggerHandler } from '../../../triggers/triggerHandler/useTriggerHandler'; import { useProductContext } from '../../../products/productContext'; import { useSceneContext } from '../../../../scene/sceneContext'; diff --git a/app/src/modules/simulation/materials/materials.tsx b/app/src/modules/simulation/materials/materials.tsx index d7d3d4a..42095d9 100644 --- a/app/src/modules/simulation/materials/materials.tsx +++ b/app/src/modules/simulation/materials/materials.tsx @@ -1,5 +1,5 @@ import { useEffect } from 'react' -import { usePlayButtonStore, useResetButtonStore } from '../../../store/usePlayButtonStore'; +import { usePlayButtonStore, useResetButtonStore } from '../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../scene/sceneContext'; import MaterialInstances from './instances/materialInstances' // import MaterialCollisionDetector from './collisionDetection/materialCollitionDetector'; diff --git a/app/src/modules/simulation/products/products.tsx b/app/src/modules/simulation/products/products.tsx index f90c26a..196fae4 100644 --- a/app/src/modules/simulation/products/products.tsx +++ b/app/src/modules/simulation/products/products.tsx @@ -2,7 +2,7 @@ import * as THREE from 'three'; import { useEffect } from 'react'; import { upsertProductOrEventApi } from '../../../services/simulation/products/UpsertProductOrEventApi'; import { getAllProductsApi } from '../../../services/simulation/products/getallProductsApi'; -import { usePlayButtonStore, useResetButtonStore } from '../../../store/usePlayButtonStore'; +import { usePlayButtonStore, useResetButtonStore } from '../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../scene/sceneContext'; import { useProductContext } from './productContext'; import { useComparisonProduct, useMainProduct } from '../../../store/simulation/useSimulationStore'; diff --git a/app/src/modules/simulation/roboticArm/eventManager/useArmBotEventManager.ts b/app/src/modules/simulation/roboticArm/eventManager/useArmBotEventManager.ts index 3f07ea9..0cbd6a5 100644 --- a/app/src/modules/simulation/roboticArm/eventManager/useArmBotEventManager.ts +++ b/app/src/modules/simulation/roboticArm/eventManager/useArmBotEventManager.ts @@ -1,6 +1,6 @@ import { useEffect, useRef } from 'react'; import { useFrame } from '@react-three/fiber'; -import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/usePlayButtonStore'; +import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../scene/sceneContext'; type ArmBotCallback = { diff --git a/app/src/modules/simulation/roboticArm/instances/animator/roboticArmAnimator.tsx b/app/src/modules/simulation/roboticArm/instances/animator/roboticArmAnimator.tsx index 0bc142d..91f58c8 100644 --- a/app/src/modules/simulation/roboticArm/instances/animator/roboticArmAnimator.tsx +++ b/app/src/modules/simulation/roboticArm/instances/animator/roboticArmAnimator.tsx @@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react'; import { useFrame, useThree } from '@react-three/fiber'; import * as THREE from 'three'; import { Line, Text } from '@react-three/drei'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useProductContext } from '../../../products/productContext'; diff --git a/app/src/modules/simulation/roboticArm/instances/armInstance/roboticArmInstance.tsx b/app/src/modules/simulation/roboticArm/instances/armInstance/roboticArmInstance.tsx index 9c3fff6..cc1a5f6 100644 --- a/app/src/modules/simulation/roboticArm/instances/armInstance/roboticArmInstance.tsx +++ b/app/src/modules/simulation/roboticArm/instances/armInstance/roboticArmInstance.tsx @@ -3,7 +3,7 @@ import * as THREE from "three"; import IKInstance from '../ikInstance/ikInstance'; import RoboticArmAnimator from '../animator/roboticArmAnimator'; import MaterialAnimator from '../animator/materialAnimator'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useTriggerHandler } from '../../../triggers/triggerHandler/useTriggerHandler'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useProductContext } from '../../../products/productContext'; diff --git a/app/src/modules/simulation/roboticArm/instances/ikInstance/ikInstance.tsx b/app/src/modules/simulation/roboticArm/instances/ikInstance/ikInstance.tsx index d875905..bc2b820 100644 --- a/app/src/modules/simulation/roboticArm/instances/ikInstance/ikInstance.tsx +++ b/app/src/modules/simulation/roboticArm/instances/ikInstance/ikInstance.tsx @@ -2,7 +2,7 @@ import { useEffect } from 'react' import * as THREE from "three"; import { useThree } from "@react-three/fiber"; import { CCDIKSolver, CCDIKHelper } from "three/examples/jsm/animation/CCDIKSolver"; -import { usePlayButtonStore, useResetButtonStore } from '../../../../../store/usePlayButtonStore'; +import { usePlayButtonStore, useResetButtonStore } from '../../../../../store/ui/usePlayButtonStore'; type IKInstanceProps = { setIkSolver: any diff --git a/app/src/modules/simulation/roboticArm/roboticArm.tsx b/app/src/modules/simulation/roboticArm/roboticArm.tsx index 1946fce..5610b1d 100644 --- a/app/src/modules/simulation/roboticArm/roboticArm.tsx +++ b/app/src/modules/simulation/roboticArm/roboticArm.tsx @@ -1,6 +1,6 @@ import { useEffect, useState } from "react"; import { useSelectedEventSphere } from "../../../store/simulation/useSimulationStore"; -import { usePlayButtonStore } from "../../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../../store/ui/usePlayButtonStore"; import RoboticArmInstances from "./instances/roboticArmInstances"; import ArmBotUI from "../spatialUI/arm/armBotUI"; import { useSceneContext } from "../../scene/sceneContext"; diff --git a/app/src/modules/simulation/simulation.tsx b/app/src/modules/simulation/simulation.tsx index 4490aeb..e9fb50f 100644 --- a/app/src/modules/simulation/simulation.tsx +++ b/app/src/modules/simulation/simulation.tsx @@ -11,7 +11,7 @@ import Crane from './crane/crane'; import Simulator from './simulator/simulator'; import Products from './products/products'; import Trigger from './triggers/trigger'; -import useModuleStore from '../../store/useModuleStore'; +import useModuleStore from '../../store/ui/useModuleStore'; import SimulationAnalysis from './analysis/simulationAnalysis'; import { useSceneContext } from '../scene/sceneContext'; diff --git a/app/src/modules/simulation/simulator/simulator.tsx b/app/src/modules/simulation/simulator/simulator.tsx index 21bf97a..4eae2e9 100644 --- a/app/src/modules/simulation/simulator/simulator.tsx +++ b/app/src/modules/simulation/simulator/simulator.tsx @@ -1,6 +1,6 @@ import { useEffect } from 'react'; import { useActionHandler } from '../actions/useActionHandler'; -import { usePlayButtonStore, useResetButtonStore } from '../../../store/usePlayButtonStore'; +import { usePlayButtonStore, useResetButtonStore } from '../../../store/ui/usePlayButtonStore'; import { determineExecutionOrder } from './functions/determineExecutionOrder'; import { useProductContext } from '../products/productContext'; import { useSceneContext } from '../../scene/sceneContext'; diff --git a/app/src/modules/simulation/vehicle/eventManager/useVehicleEventManager.ts b/app/src/modules/simulation/vehicle/eventManager/useVehicleEventManager.ts index 625beff..c60b187 100644 --- a/app/src/modules/simulation/vehicle/eventManager/useVehicleEventManager.ts +++ b/app/src/modules/simulation/vehicle/eventManager/useVehicleEventManager.ts @@ -1,6 +1,6 @@ import { useEffect, useRef } from 'react'; import { useFrame } from '@react-three/fiber'; -import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/usePlayButtonStore'; +import { usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../scene/sceneContext'; type VehicleCallback = { diff --git a/app/src/modules/simulation/vehicle/instances/animator/interactivePoint.tsx b/app/src/modules/simulation/vehicle/instances/animator/interactivePoint.tsx index 53b21b2..c928680 100644 --- a/app/src/modules/simulation/vehicle/instances/animator/interactivePoint.tsx +++ b/app/src/modules/simulation/vehicle/instances/animator/interactivePoint.tsx @@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useRef, useState } from 'react'; import * as THREE from 'three'; import { useThree, useFrame, ThreeEvent } from '@react-three/fiber'; import { Line } from '@react-three/drei'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useActiveTool, useSelectedPath } from '../../../../../store/builder/store'; interface InteractivePointsProps { diff --git a/app/src/modules/simulation/vehicle/instances/animator/vehicleAnimator.tsx b/app/src/modules/simulation/vehicle/instances/animator/vehicleAnimator.tsx index 81fbadc..b94a167 100644 --- a/app/src/modules/simulation/vehicle/instances/animator/vehicleAnimator.tsx +++ b/app/src/modules/simulation/vehicle/instances/animator/vehicleAnimator.tsx @@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react' import { useFrame, useThree, ThreeEvent } from '@react-three/fiber'; import * as THREE from 'three'; import { Line } from '@react-three/drei'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useActiveTool, useSelectedPath } from '../../../../../store/builder/store'; diff --git a/app/src/modules/simulation/vehicle/instances/instance/vehicleInstance.tsx b/app/src/modules/simulation/vehicle/instances/instance/vehicleInstance.tsx index 511f21a..40e4886 100644 --- a/app/src/modules/simulation/vehicle/instances/instance/vehicleInstance.tsx +++ b/app/src/modules/simulation/vehicle/instances/instance/vehicleInstance.tsx @@ -2,7 +2,7 @@ import { useCallback, useEffect, useRef, useState } from 'react'; import * as THREE from 'three'; import { NavMeshQuery } from '@recast-navigation/core'; import { useNavMesh, useSelectedPath } from '../../../../../store/builder/store'; -import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/usePlayButtonStore'; +import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore } from '../../../../../store/ui/usePlayButtonStore'; import { useTriggerHandler } from '../../../triggers/triggerHandler/useTriggerHandler'; import { useSceneContext } from '../../../../scene/sceneContext'; import { useProductContext } from '../../../products/productContext'; diff --git a/app/src/modules/simulation/vehicle/navMesh/navMesh.tsx b/app/src/modules/simulation/vehicle/navMesh/navMesh.tsx index ff07ee9..e812328 100644 --- a/app/src/modules/simulation/vehicle/navMesh/navMesh.tsx +++ b/app/src/modules/simulation/vehicle/navMesh/navMesh.tsx @@ -2,7 +2,7 @@ import { useRef } from "react"; import * as CONSTANTS from "../../../../types/world/worldConstants"; import * as Types from "../../../../types/world/worldTypes"; import { useLoadingProgress, useNavMesh, useTileDistance } from "../../../../store/builder/store"; -import useModuleStore from "../../../../store/useModuleStore"; +import useModuleStore from "../../../../store/ui/useModuleStore"; import PolygonGenerator from "./polygonGenerator"; import NavMeshDetails from "./navMeshDetails"; diff --git a/app/src/modules/simulation/vehicle/vehicles.tsx b/app/src/modules/simulation/vehicle/vehicles.tsx index 9e594a5..c03bb0e 100644 --- a/app/src/modules/simulation/vehicle/vehicles.tsx +++ b/app/src/modules/simulation/vehicle/vehicles.tsx @@ -1,6 +1,6 @@ import { useEffect, useState } from "react"; import { useSelectedEventSphere } from "../../../store/simulation/useSimulationStore"; -import { usePlayButtonStore } from "../../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../../store/ui/usePlayButtonStore"; import VehicleInstances from "./instances/vehicleInstances"; import VehicleUI from "../spatialUI/vehicle/vehicleUI"; import { useSceneContext } from "../../scene/sceneContext"; diff --git a/app/src/modules/visualization/RealTimeVisulization.tsx b/app/src/modules/visualization/RealTimeVisulization.tsx index bec92b3..4c07baa 100644 --- a/app/src/modules/visualization/RealTimeVisulization.tsx +++ b/app/src/modules/visualization/RealTimeVisulization.tsx @@ -1,10 +1,10 @@ import React, { useEffect, useState, useRef } from "react"; -import { usePlayButtonStore } from "../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../store/ui/usePlayButtonStore"; import Panel from "./widgets/panel/Panel"; import AddButtons from "./widgets/panel/AddButtons"; import { useSelectedZoneStore } from "../../store/visualization/useZoneStore"; import DisplayZone from "./zone/DisplayZone"; -import useModuleStore from "../../store/useModuleStore"; +import useModuleStore from "../../store/ui/useModuleStore"; import { getZone2dData } from "../../services/visulization/zone/getZoneData"; import SocketRealTimeViz from "./socket/realTimeVizSocket.dev"; import RenderOverlay from "../../components/templates/Overlay"; @@ -13,7 +13,7 @@ import DroppedObjects from "./widgets/floating/DroppedFloatingWidgets"; import EditWidgetOption from "../../components/ui/menu/EditWidgetOption"; import { useEditWidgetOptionsStore, useRightClickSelected, useRightSelected, } from "../../store/visualization/useZone3DWidgetStore"; import OuterClick from "../../utils/outerClick"; -import { useWidgetStore } from "../../store/useWidgetStore"; +import { useWidgetStore } from "../../store/ui/useWidgetStore"; import { useNavigate, useParams } from "react-router-dom"; import { getUserData } from "../../functions/getUserData"; import { useVersionContext } from "../builder/version/versionContext"; diff --git a/app/src/modules/visualization/functions/handleSaveTemplate.ts b/app/src/modules/visualization/functions/handleSaveTemplate.ts index d4f7a72..2889dde 100644 --- a/app/src/modules/visualization/functions/handleSaveTemplate.ts +++ b/app/src/modules/visualization/functions/handleSaveTemplate.ts @@ -1,5 +1,5 @@ import { getUserData } from "../../../functions/getUserData"; -import { Template } from "../../../store/useTemplateStore"; +import { Template } from "../../../store/ui/useTemplateStore"; import { captureVisualization } from "./captureVisualization"; type HandleSaveTemplateProps = { diff --git a/app/src/modules/visualization/socket/realTimeVizSocket.dev.tsx b/app/src/modules/visualization/socket/realTimeVizSocket.dev.tsx index 1ed37ca..7783e11 100644 --- a/app/src/modules/visualization/socket/realTimeVizSocket.dev.tsx +++ b/app/src/modules/visualization/socket/realTimeVizSocket.dev.tsx @@ -3,7 +3,7 @@ import { useSocketStore } from "../../../store/builder/store"; import { useSelectedZoneStore } from "../../../store/visualization/useZoneStore"; import { useDroppedObjectsStore } from "../../../store/visualization/useDroppedObjectsStore"; import { useZoneWidgetStore } from "../../../store/visualization/useZone3DWidgetStore"; -import useTemplateStore from "../../../store/useTemplateStore"; +import useTemplateStore from "../../../store/ui/useTemplateStore"; type WidgetData = { id: string; diff --git a/app/src/modules/visualization/template/Templates.tsx b/app/src/modules/visualization/template/Templates.tsx index 2cfbdeb..3d097f5 100644 --- a/app/src/modules/visualization/template/Templates.tsx +++ b/app/src/modules/visualization/template/Templates.tsx @@ -1,5 +1,5 @@ import { useEffect } from "react"; -import useTemplateStore from "../../../store/useTemplateStore"; +import useTemplateStore from "../../../store/ui/useTemplateStore"; import { useSelectedZoneStore } from "../../../store/visualization/useZoneStore"; import { useSocketStore } from "../../../store/builder/store"; import { getTemplateData } from "../../../services/visulization/zone/getTemplate"; diff --git a/app/src/modules/visualization/widgets/2d/DraggableWidget.tsx b/app/src/modules/visualization/widgets/2d/DraggableWidget.tsx index 4df1982..fb721af 100644 --- a/app/src/modules/visualization/widgets/2d/DraggableWidget.tsx +++ b/app/src/modules/visualization/widgets/2d/DraggableWidget.tsx @@ -2,8 +2,8 @@ import { forwardRef, useRef, useState } from "react"; import { gsap } from "gsap"; import { Draggable } from "gsap/Draggable"; -import { useWidgetStore } from "../../../../store/useWidgetStore"; -import { usePlayButtonStore } from "../../../../store/usePlayButtonStore"; +import { useWidgetStore } from "../../../../store/ui/useWidgetStore"; +import { usePlayButtonStore } from "../../../../store/ui/usePlayButtonStore"; import { useSelectedZoneStore } from "../../../../store/visualization/useZoneStore"; import PieGraphComponent from "../2d/charts/PieGraphComponent"; import BarGraphComponent from "../2d/charts/BarGraphComponent"; diff --git a/app/src/modules/visualization/widgets/2d/charts/BarGraphComponent.tsx b/app/src/modules/visualization/widgets/2d/charts/BarGraphComponent.tsx index 77001eb..1cd5776 100644 --- a/app/src/modules/visualization/widgets/2d/charts/BarGraphComponent.tsx +++ b/app/src/modules/visualization/widgets/2d/charts/BarGraphComponent.tsx @@ -5,8 +5,8 @@ import { Bar } from "react-chartjs-2"; import io from "socket.io-client"; import axios from "axios"; -import { useThemeStore } from "../../../../../store/useThemeStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useThemeStore } from "../../../../../store/ui/useThemeStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { useParams } from "react-router-dom"; diff --git a/app/src/modules/visualization/widgets/2d/charts/DoughnutGraphComponent.tsx b/app/src/modules/visualization/widgets/2d/charts/DoughnutGraphComponent.tsx index 69b92ac..4e072b3 100644 --- a/app/src/modules/visualization/widgets/2d/charts/DoughnutGraphComponent.tsx +++ b/app/src/modules/visualization/widgets/2d/charts/DoughnutGraphComponent.tsx @@ -3,8 +3,8 @@ import { Doughnut } from "react-chartjs-2"; import io from "socket.io-client"; import axios from "axios"; -import { useThemeStore } from "../../../../../store/useThemeStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useThemeStore } from "../../../../../store/ui/useThemeStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useParams } from "react-router-dom"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; diff --git a/app/src/modules/visualization/widgets/2d/charts/LineGraphComponent.tsx b/app/src/modules/visualization/widgets/2d/charts/LineGraphComponent.tsx index ecacd26..227b73f 100644 --- a/app/src/modules/visualization/widgets/2d/charts/LineGraphComponent.tsx +++ b/app/src/modules/visualization/widgets/2d/charts/LineGraphComponent.tsx @@ -3,9 +3,9 @@ import { Line } from "react-chartjs-2"; import io from "socket.io-client"; import axios from "axios"; -import { useThemeStore } from "../../../../../store/useThemeStore"; +import { useThemeStore } from "../../../../../store/ui/useThemeStore"; import useChartStore from "../../../../../store/visualization/useChartStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import { useParams } from "react-router-dom"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/modules/visualization/widgets/2d/charts/PieGraphComponent.tsx b/app/src/modules/visualization/widgets/2d/charts/PieGraphComponent.tsx index 6879f34..d5d43f3 100644 --- a/app/src/modules/visualization/widgets/2d/charts/PieGraphComponent.tsx +++ b/app/src/modules/visualization/widgets/2d/charts/PieGraphComponent.tsx @@ -3,9 +3,9 @@ import { Pie } from "react-chartjs-2"; import io from "socket.io-client"; import axios from "axios"; -import { useThemeStore } from "../../../../../store/useThemeStore"; +import { useThemeStore } from "../../../../../store/ui/useThemeStore"; import useChartStore from "../../../../../store/visualization/useChartStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { useParams } from "react-router-dom"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/modules/visualization/widgets/2d/charts/PolarAreaGraphComponent.tsx b/app/src/modules/visualization/widgets/2d/charts/PolarAreaGraphComponent.tsx index b99e55b..c7891d9 100644 --- a/app/src/modules/visualization/widgets/2d/charts/PolarAreaGraphComponent.tsx +++ b/app/src/modules/visualization/widgets/2d/charts/PolarAreaGraphComponent.tsx @@ -3,9 +3,9 @@ import { PolarArea } from "react-chartjs-2"; import io from "socket.io-client"; import axios from "axios"; -import { useThemeStore } from "../../../../../store/useThemeStore"; +import { useThemeStore } from "../../../../../store/ui/useThemeStore"; import useChartStore from "../../../../../store/visualization/useChartStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { useParams } from "react-router-dom"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/modules/visualization/widgets/2d/charts/ProgressCard1.tsx b/app/src/modules/visualization/widgets/2d/charts/ProgressCard1.tsx index 0506424..1dfaf1c 100644 --- a/app/src/modules/visualization/widgets/2d/charts/ProgressCard1.tsx +++ b/app/src/modules/visualization/widgets/2d/charts/ProgressCard1.tsx @@ -4,7 +4,7 @@ import io from "socket.io-client"; import axios from "axios"; import useChartStore from "../../../../../store/visualization/useChartStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import { StockIncreseIcon } from "../../../../../components/icons/RealTimeVisulationIcons"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { useParams } from "react-router-dom"; diff --git a/app/src/modules/visualization/widgets/2d/charts/ProgressCard2.tsx b/app/src/modules/visualization/widgets/2d/charts/ProgressCard2.tsx index b538f4d..082e0d4 100644 --- a/app/src/modules/visualization/widgets/2d/charts/ProgressCard2.tsx +++ b/app/src/modules/visualization/widgets/2d/charts/ProgressCard2.tsx @@ -4,7 +4,7 @@ import io from "socket.io-client"; import axios from "axios"; import useChartStore from "../../../../../store/visualization/useChartStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import { StockIncreseIcon } from "../../../../../components/icons/RealTimeVisulationIcons"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { useParams } from "react-router-dom"; diff --git a/app/src/modules/visualization/widgets/3d/Dropped3dWidget.tsx b/app/src/modules/visualization/widgets/3d/Dropped3dWidget.tsx index 3da5c52..58c6271 100644 --- a/app/src/modules/visualization/widgets/3d/Dropped3dWidget.tsx +++ b/app/src/modules/visualization/widgets/3d/Dropped3dWidget.tsx @@ -6,7 +6,7 @@ import { useSocketStore, useWidgetSubOption, } from "../../../../store/builder/store"; -import useModuleStore from "../../../../store/useModuleStore"; +import useModuleStore from "../../../../store/ui/useModuleStore"; import { ThreeState } from "../../../../types/world/worldTypes"; import { useSelectedZoneStore } from "../../../../store/visualization/useZoneStore"; import { @@ -24,7 +24,7 @@ import ProductionCapacity from "./cards/ProductionCapacity"; import ReturnOfInvestment from "./cards/ReturnOfInvestment"; import StateWorking from "./cards/StateWorking"; import Throughput from "./cards/Throughput"; -import { useWidgetStore } from "../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../store/ui/useWidgetStore"; import useChartStore from "../../../../store/visualization/useChartStore"; import { useParams } from "react-router-dom"; import { getUserData } from "../../../../functions/getUserData"; diff --git a/app/src/modules/visualization/widgets/3d/cards/ProductionCapacity.tsx b/app/src/modules/visualization/widgets/3d/cards/ProductionCapacity.tsx index 2a104c3..603ef8b 100644 --- a/app/src/modules/visualization/widgets/3d/cards/ProductionCapacity.tsx +++ b/app/src/modules/visualization/widgets/3d/cards/ProductionCapacity.tsx @@ -14,7 +14,7 @@ import { import axios from "axios"; import io from "socket.io-client"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { getUserData } from "../../../../../functions/getUserData"; import { get3dWidgetInput } from "../../../../../services/visulization/zone/get3dWidgetInput"; diff --git a/app/src/modules/visualization/widgets/3d/cards/ReturnOfInvestment.tsx b/app/src/modules/visualization/widgets/3d/cards/ReturnOfInvestment.tsx index fa09392..dceddf2 100644 --- a/app/src/modules/visualization/widgets/3d/cards/ReturnOfInvestment.tsx +++ b/app/src/modules/visualization/widgets/3d/cards/ReturnOfInvestment.tsx @@ -14,7 +14,7 @@ import { import axios from "axios"; import io from "socket.io-client"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { WavyIcon } from "../../../../../components/icons/3dChartIcons"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/modules/visualization/widgets/3d/cards/StateWorking.tsx b/app/src/modules/visualization/widgets/3d/cards/StateWorking.tsx index e6e3b5f..07b648a 100644 --- a/app/src/modules/visualization/widgets/3d/cards/StateWorking.tsx +++ b/app/src/modules/visualization/widgets/3d/cards/StateWorking.tsx @@ -3,7 +3,7 @@ import React, { useEffect, useMemo, useState } from "react"; import axios from "axios"; import io from "socket.io-client"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { getUserData } from "../../../../../functions/getUserData"; import { get3dWidgetInput } from "../../../../../services/visulization/zone/get3dWidgetInput"; diff --git a/app/src/modules/visualization/widgets/3d/cards/Throughput.tsx b/app/src/modules/visualization/widgets/3d/cards/Throughput.tsx index 599b566..6fdf702 100644 --- a/app/src/modules/visualization/widgets/3d/cards/Throughput.tsx +++ b/app/src/modules/visualization/widgets/3d/cards/Throughput.tsx @@ -16,7 +16,7 @@ import { import axios from "axios"; import io from "socket.io-client"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { ThroughputIcon } from "../../../../../components/icons/3dChartIcons"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/modules/visualization/widgets/floating/DroppedFloatingWidgets.tsx b/app/src/modules/visualization/widgets/floating/DroppedFloatingWidgets.tsx index ee2d2fd..f3059e3 100644 --- a/app/src/modules/visualization/widgets/floating/DroppedFloatingWidgets.tsx +++ b/app/src/modules/visualization/widgets/floating/DroppedFloatingWidgets.tsx @@ -1,6 +1,6 @@ import { useEffect, useRef, useState } from "react"; import { useDroppedObjectsStore } from "../../../../store/visualization/useDroppedObjectsStore"; -import useModuleStore from "../../../../store/useModuleStore"; +import useModuleStore from "../../../../store/ui/useModuleStore"; import { determinePosition } from "../../functions/determinePosition"; import { getActiveProperties } from "../../functions/getActiveProperties"; import { addingFloatingWidgets } from "../../../../services/visulization/zone/addFloatingWidgets"; @@ -14,9 +14,9 @@ import DistanceLines from "./DistanceLines"; // Import the DistanceLines compone import TotalCardComponent from "./cards/TotalCardComponent"; import WarehouseThroughputComponent from "./cards/WarehouseThroughputComponent"; import FleetEfficiencyComponent from "./cards/FleetEfficiencyComponent"; -import { useWidgetStore } from "../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../store/ui/useWidgetStore"; import { useSocketStore } from "../../../../store/builder/store"; -import { usePlayButtonStore } from "../../../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../../../store/ui/usePlayButtonStore"; import { useSelectedZoneStore } from "../../../../store/visualization/useZoneStore"; import { useParams } from "react-router-dom"; import { getUserData } from "../../../../functions/getUserData"; diff --git a/app/src/modules/visualization/widgets/floating/cards/FleetEfficiencyComponent.tsx b/app/src/modules/visualization/widgets/floating/cards/FleetEfficiencyComponent.tsx index ae48014..fc9134c 100644 --- a/app/src/modules/visualization/widgets/floating/cards/FleetEfficiencyComponent.tsx +++ b/app/src/modules/visualization/widgets/floating/cards/FleetEfficiencyComponent.tsx @@ -1,10 +1,10 @@ import React, { useState, useEffect } from "react"; import { Line } from "react-chartjs-2"; import useChartStore from "../../../../../store/visualization/useChartStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import io from "socket.io-client"; -import { usePlayButtonStore } from "../../../../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../../../../store/ui/usePlayButtonStore"; import { getUserData } from "../../../../../functions/getUserData"; import { useParams } from "react-router-dom"; import { getFloatingWidgetInput } from "../../../../../services/visulization/zone/getFloatingWidgetInput"; diff --git a/app/src/modules/visualization/widgets/floating/cards/TotalCardComponent.tsx b/app/src/modules/visualization/widgets/floating/cards/TotalCardComponent.tsx index 377ce3f..cf2c68f 100644 --- a/app/src/modules/visualization/widgets/floating/cards/TotalCardComponent.tsx +++ b/app/src/modules/visualization/widgets/floating/cards/TotalCardComponent.tsx @@ -1,7 +1,7 @@ import React, { useState, useEffect } from "react"; import useChartStore from "../../../../../store/visualization/useChartStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import io from "socket.io-client"; import {CartIcon,DocumentIcon,GlobeIcon,WalletIcon,} from "../../../../../components/icons/3dChartIcons"; diff --git a/app/src/modules/visualization/widgets/floating/cards/WarehouseThroughputComponent.tsx b/app/src/modules/visualization/widgets/floating/cards/WarehouseThroughputComponent.tsx index 395a253..746a731 100644 --- a/app/src/modules/visualization/widgets/floating/cards/WarehouseThroughputComponent.tsx +++ b/app/src/modules/visualization/widgets/floating/cards/WarehouseThroughputComponent.tsx @@ -1,7 +1,7 @@ import React, { useState, useEffect } from "react"; import { Line } from "react-chartjs-2"; import useChartStore from "../../../../../store/visualization/useChartStore"; -import { useWidgetStore } from "../../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import io from "socket.io-client"; import { getUserData } from "../../../../../functions/getUserData"; diff --git a/app/src/modules/visualization/widgets/panel/Panel.tsx b/app/src/modules/visualization/widgets/panel/Panel.tsx index d1bb12b..38de80f 100644 --- a/app/src/modules/visualization/widgets/panel/Panel.tsx +++ b/app/src/modules/visualization/widgets/panel/Panel.tsx @@ -8,7 +8,7 @@ import React, { import gsap from "gsap"; import { Draggable } from "gsap/Draggable"; import { DraggableWidget } from "../2d/DraggableWidget"; -import { useWidgetStore } from "../../../../store/useWidgetStore"; +import { useWidgetStore } from "../../../../store/ui/useWidgetStore"; import { generateUniqueId } from "../../../../functions/generateUniqueId"; import { useSocketStore } from "../../../../store/builder/store"; import { useParams } from "react-router-dom"; diff --git a/app/src/modules/visualization/zone/DisplayZone.tsx b/app/src/modules/visualization/zone/DisplayZone.tsx index b8d117a..4ff2f79 100644 --- a/app/src/modules/visualization/zone/DisplayZone.tsx +++ b/app/src/modules/visualization/zone/DisplayZone.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useRef, useState, useCallback } from "react"; -import { useWidgetStore, Widget } from "../../../store/useWidgetStore"; +import { useWidgetStore, Widget } from "../../../store/ui/useWidgetStore"; import { useDroppedObjectsStore, @@ -13,7 +13,7 @@ import { MoveArrowRight, } from "../../../components/icons/SimulationIcons"; import { InfoIcon } from "../../../components/icons/ExportCommonIcons"; -import { usePlayButtonStore } from "../../../store/usePlayButtonStore"; +import { usePlayButtonStore } from "../../../store/ui/usePlayButtonStore"; import { useParams } from "react-router-dom"; import { getUserData } from "../../../functions/getUserData"; import { useVersionContext } from "../../builder/version/versionContext"; diff --git a/app/src/pages/Project.tsx b/app/src/pages/Project.tsx index 67c3129..2de0dd3 100644 --- a/app/src/pages/Project.tsx +++ b/app/src/pages/Project.tsx @@ -1,5 +1,5 @@ import React, { useEffect } from "react"; -import useModuleStore from "../store/useModuleStore"; +import useModuleStore from "../store/ui/useModuleStore"; import { useSocketStore, useProjectName, useActiveTool, } from "../store/builder/store"; import { useNavigate, useParams } from "react-router-dom"; import { useSelectedUserStore } from "../store/collaboration/useCollabStore"; @@ -9,8 +9,6 @@ import RenderOverlay from "../components/templates/Overlay"; import LogList from "../components/ui/log/LogList"; import { getAllProjects } from "../services/dashboard/getAllProjects"; import { viewProject } from "../services/dashboard/viewProject"; -import ComparisonSceneProvider from "../components/layout/scenes/ComparisonSceneProvider"; -import MainSceneProvider from "../components/layout/scenes/MainSceneProvider"; import { getUserData } from "../functions/getUserData"; import { SceneProvider } from "../modules/scene/sceneContext"; import { getVersionHistoryApi } from "../services/factoryBuilder/versionControl/getVersionHistoryApi"; @@ -18,6 +16,9 @@ import { useVersionHistoryStore } from "../store/builder/useVersionHistoryStore" import { VersionProvider } from "../modules/builder/version/versionContext"; import { sharedWithMeProjects } from "../services/dashboard/sharedWithMeProject"; import { handleCanvasCursors } from "../utils/mouseUtils/handleCanvasCursors"; +import { ProductProvider } from "../modules/simulation/products/productContext"; +import MainScene from "../components/layout/scenes/MainScene"; +import ComparisonScene from "../components/layout/scenes/ComparisonScene"; const Project: React.FC = () => { let navigate = useNavigate(); @@ -113,12 +114,16 @@ const Project: React.FC = () => {
- + + + - + + + {selectedUser && } diff --git a/app/src/store/scene/useSceneStore.ts b/app/src/store/scene/useSceneStore.ts new file mode 100644 index 0000000..2456476 --- /dev/null +++ b/app/src/store/scene/useSceneStore.ts @@ -0,0 +1,28 @@ +import { create } from 'zustand'; +import { immer } from 'zustand/middleware/immer'; + +interface SelectedVersionState { + selectedVersion: Version | null; + setSelectedVersion: (version: Version) => void; + clearSelectedVersion: () => void; +} + +export const createSelectedVersionStore = () => { + return create()( + immer((set) => ({ + selectedVersion: null, + setSelectedVersion: (version) => { + set((state) => { + state.selectedVersion = version; + }); + }, + clearSelectedVersion: () => { + set((state) => { + state.selectedVersion = null; + }); + }, + })) + ) +} + +export type SelectedVersionType = ReturnType; \ No newline at end of file diff --git a/app/src/store/useCompareProductStore.ts b/app/src/store/simulation/useCompareProductStore.ts similarity index 100% rename from app/src/store/useCompareProductStore.ts rename to app/src/store/simulation/useCompareProductStore.ts diff --git a/app/src/store/useModuleStore.ts b/app/src/store/ui/useModuleStore.ts similarity index 96% rename from app/src/store/useModuleStore.ts rename to app/src/store/ui/useModuleStore.ts index 30a84af..e582e76 100644 --- a/app/src/store/useModuleStore.ts +++ b/app/src/store/ui/useModuleStore.ts @@ -1,42 +1,42 @@ -import { create } from "zustand"; - -interface ModuleStore { - activeModule: string; - setActiveModule: (module: string) => void; -} - -const useModuleStore = create((set) => ({ - activeModule: "builder", // Initial state - setActiveModule: (module) => set({ activeModule: module }), // Update state -})); - -export default useModuleStore; - -// New store for subModule - -type SubModule = 'properties' | 'simulations' | 'mechanics' | 'analysis' | 'zoneProperties'|"resourceManagement"; - -interface SubModuleStore { - subModule: SubModule; - setSubModule: (subModule: SubModule) => void; -} - -const useSubModuleStore = create((set) => ({ - subModule: "properties", // Initial subModule state - setSubModule: (value) => set({ subModule: value }), // Update subModule state -})); - -export { useSubModuleStore }; - -interface ThreeDState { - toggleThreeD: boolean; - setToggleThreeD: (value: boolean) => void; -} - -// Create the Zustand store -const useThreeDStore = create((set) => ({ - toggleThreeD: true, // Initial state - setToggleThreeD: (value) => set({ toggleThreeD: value }), // Action to update the state -})); - +import { create } from "zustand"; + +interface ModuleStore { + activeModule: string; + setActiveModule: (module: string) => void; +} + +const useModuleStore = create((set) => ({ + activeModule: "builder", // Initial state + setActiveModule: (module) => set({ activeModule: module }), // Update state +})); + +export default useModuleStore; + +// New store for subModule + +type SubModule = 'properties' | 'simulations' | 'mechanics' | 'analysis' | 'zoneProperties'|"resourceManagement"; + +interface SubModuleStore { + subModule: SubModule; + setSubModule: (subModule: SubModule) => void; +} + +const useSubModuleStore = create((set) => ({ + subModule: "properties", // Initial subModule state + setSubModule: (value) => set({ subModule: value }), // Update subModule state +})); + +export { useSubModuleStore }; + +interface ThreeDState { + toggleThreeD: boolean; + setToggleThreeD: (value: boolean) => void; +} + +// Create the Zustand store +const useThreeDStore = create((set) => ({ + toggleThreeD: true, // Initial state + setToggleThreeD: (value) => set({ toggleThreeD: value }), // Action to update the state +})); + export { useThreeDStore }; \ No newline at end of file diff --git a/app/src/store/usePlayButtonStore.ts b/app/src/store/ui/usePlayButtonStore.ts similarity index 97% rename from app/src/store/usePlayButtonStore.ts rename to app/src/store/ui/usePlayButtonStore.ts index fe85d6a..a9eaf69 100644 --- a/app/src/store/usePlayButtonStore.ts +++ b/app/src/store/ui/usePlayButtonStore.ts @@ -1,49 +1,49 @@ -import { create } from "zustand"; - -type PlayButtonStore = { - isPlaying: boolean; // Updated state name to reflect the play/pause status more clearly - setIsPlaying: (value: boolean) => void; // Updated setter function name for clarity -}; -type PauseButtonStore = { - isPaused: boolean; // Updated state name to reflect the play/pause status more clearly - setIsPaused: (value: boolean) => void; // Updated setter function name for clarity -}; -type ResetButtonStore = { - isReset: boolean; // Updated state name to reflect the play/pause status more clearly - setReset: (value: boolean) => void; // Updated setter function name for clarity -}; -interface AnimationSpeedState { - speed: number; - setSpeed: (value: number) => void; -} - -export const usePlayButtonStore = create((set) => ({ - isPlaying: false, // Default state for play/pause - setIsPlaying: (value) => set({ isPlaying: value }), // Update isPlaying state -})); -export const useResetButtonStore = create((set) => ({ - isReset: false, // Default state for play/pause - setReset: (value) => set({ isReset: value }), // Update isPlaying state -})); -export const usePauseButtonStore = create((set) => ({ - isPaused: false, // Default state for play/pause - setIsPaused: (value) => set({ isPaused: value }), // Update isPlaying state -})); -export const useAnimationPlaySpeed = create((set) => ({ - speed: 1, - setSpeed: (value) => set({ speed: value }), -})); - -interface CameraModeState { - walkMode: boolean; - setWalkMode: (enabled: boolean) => void; - toggleWalkMode: () => void; -} - -const useCameraModeStore = create((set) => ({ - walkMode: false, - setWalkMode: (enabled) => set({ walkMode: enabled }), - toggleWalkMode: () => set((state) => ({ walkMode: !state.walkMode })), -})); - -export default useCameraModeStore; +import { create } from "zustand"; + +type PlayButtonStore = { + isPlaying: boolean; // Updated state name to reflect the play/pause status more clearly + setIsPlaying: (value: boolean) => void; // Updated setter function name for clarity +}; +type PauseButtonStore = { + isPaused: boolean; // Updated state name to reflect the play/pause status more clearly + setIsPaused: (value: boolean) => void; // Updated setter function name for clarity +}; +type ResetButtonStore = { + isReset: boolean; // Updated state name to reflect the play/pause status more clearly + setReset: (value: boolean) => void; // Updated setter function name for clarity +}; +interface AnimationSpeedState { + speed: number; + setSpeed: (value: number) => void; +} + +export const usePlayButtonStore = create((set) => ({ + isPlaying: false, // Default state for play/pause + setIsPlaying: (value) => set({ isPlaying: value }), // Update isPlaying state +})); +export const useResetButtonStore = create((set) => ({ + isReset: false, // Default state for play/pause + setReset: (value) => set({ isReset: value }), // Update isPlaying state +})); +export const usePauseButtonStore = create((set) => ({ + isPaused: false, // Default state for play/pause + setIsPaused: (value) => set({ isPaused: value }), // Update isPlaying state +})); +export const useAnimationPlaySpeed = create((set) => ({ + speed: 1, + setSpeed: (value) => set({ speed: value }), +})); + +interface CameraModeState { + walkMode: boolean; + setWalkMode: (enabled: boolean) => void; + toggleWalkMode: () => void; +} + +const useCameraModeStore = create((set) => ({ + walkMode: false, + setWalkMode: (enabled) => set({ walkMode: enabled }), + toggleWalkMode: () => set((state) => ({ walkMode: !state.walkMode })), +})); + +export default useCameraModeStore; diff --git a/app/src/store/useTemplateStore.ts b/app/src/store/ui/useTemplateStore.ts similarity index 95% rename from app/src/store/useTemplateStore.ts rename to app/src/store/ui/useTemplateStore.ts index d416154..ed446ef 100644 --- a/app/src/store/useTemplateStore.ts +++ b/app/src/store/ui/useTemplateStore.ts @@ -1,51 +1,51 @@ -import { create } from "zustand"; - -export interface Widget { - id: string; - type: string; - title: string; - panel: string; - data: any; -} - -export interface Template { - id: string; - name: string; - panelOrder: string[]; - widgets: Widget[]; - floatingWidget: any[]; // Fixed empty array type - widgets3D: any[]; // Fixed empty array type - snapshot?: string | null; -} - -interface TemplateStore { - templates: Template[]; - addTemplate: (template: Template) => void; - setTemplates: (templates: Template[]) => void; // Changed from `setTemplate` - removeTemplate: (id: string) => void; -} - -export const useTemplateStore = create((set) => ({ - templates: [], - - // Add a new template to the list - addTemplate: (template) => - set((state) => ({ - templates: [...state.templates, template], - })), - - // Set (replace) the templates list with a new array - setTemplates: (templates) => - set(() => ({ - templates, // Ensures no duplication - })), - - // Remove a template by ID - removeTemplate: (id) => - set((state) => ({ - templates: state.templates.filter((t) => t.id !== id), - })), -})); - -export default useTemplateStore; - +import { create } from "zustand"; + +export interface Widget { + id: string; + type: string; + title: string; + panel: string; + data: any; +} + +export interface Template { + id: string; + name: string; + panelOrder: string[]; + widgets: Widget[]; + floatingWidget: any[]; // Fixed empty array type + widgets3D: any[]; // Fixed empty array type + snapshot?: string | null; +} + +interface TemplateStore { + templates: Template[]; + addTemplate: (template: Template) => void; + setTemplates: (templates: Template[]) => void; // Changed from `setTemplate` + removeTemplate: (id: string) => void; +} + +export const useTemplateStore = create((set) => ({ + templates: [], + + // Add a new template to the list + addTemplate: (template) => + set((state) => ({ + templates: [...state.templates, template], + })), + + // Set (replace) the templates list with a new array + setTemplates: (templates) => + set(() => ({ + templates, // Ensures no duplication + })), + + // Remove a template by ID + removeTemplate: (id) => + set((state) => ({ + templates: state.templates.filter((t) => t.id !== id), + })), +})); + +export default useTemplateStore; + diff --git a/app/src/store/useThemeStore.ts b/app/src/store/ui/useThemeStore.ts similarity index 97% rename from app/src/store/useThemeStore.ts rename to app/src/store/ui/useThemeStore.ts index cab0940..944a77f 100644 --- a/app/src/store/useThemeStore.ts +++ b/app/src/store/ui/useThemeStore.ts @@ -1,11 +1,11 @@ -import { create } from "zustand"; - -interface ThemeState { - themeColor: string[]; // This should be an array of strings - setThemeColor: (colors: string[]) => void; // This function will accept an array of strings -} - -export const useThemeStore = create((set) => ({ - themeColor: ["#5c87df", "#EEEEFE", "#969BA7"], - setThemeColor: (colors) => set({ themeColor: colors }), -})); +import { create } from "zustand"; + +interface ThemeState { + themeColor: string[]; // This should be an array of strings + setThemeColor: (colors: string[]) => void; // This function will accept an array of strings +} + +export const useThemeStore = create((set) => ({ + themeColor: ["#5c87df", "#EEEEFE", "#969BA7"], + setThemeColor: (colors) => set({ themeColor: colors }), +})); diff --git a/app/src/store/useUIToggleStore.ts b/app/src/store/ui/useUIToggleStore.ts similarity index 96% rename from app/src/store/useUIToggleStore.ts rename to app/src/store/ui/useUIToggleStore.ts index cbee72f..71ca96b 100644 --- a/app/src/store/useUIToggleStore.ts +++ b/app/src/store/ui/useUIToggleStore.ts @@ -1,53 +1,53 @@ -import { create } from "zustand"; - -interface ToggleState { - toggleUILeft: boolean; - toggleUIRight: boolean; - setToggleUI: (value1: boolean, value2: boolean) => void; -} - -export const useToggleStore = create((set) => ({ - toggleUILeft: true, - toggleUIRight: false, - setToggleUI: (value1: boolean, value2: boolean) => { - set({ toggleUILeft: value1, toggleUIRight: value2 }); - }, -})); - -interface PlayerState { - hidePlayer: boolean; - setHidePlayer: (hide: boolean) => void; -} - -// Create the Zustand store -export const usePlayerStore = create((set) => ({ - hidePlayer: false, // initial state - setHidePlayer: (hide) => set({ hidePlayer: hide }), // state updater -})); - -interface MouseNoteState { - Leftnote: string; - Middlenote: string; - Rightnote: string; - setNotes: (notes: { - Leftnote: string; - Middlenote: string; - Rightnote: string; - }) => void; - setLeftnote: (note: string) => void; - setMiddlenote: (note: string) => void; - setRightnote: (note: string) => void; - resetNotes: () => void; -} - -export const useMouseNoteStore = create((set) => ({ - Leftnote: '', - Middlenote: '', - Rightnote: '', - setNotes: (notes) => set(notes), - setLeftnote: (note) => set({ Leftnote: note }), - setMiddlenote: (note) => set({ Middlenote: note }), - setRightnote: (note) => set({ Rightnote: note }), - resetNotes: () => - set({ Leftnote: '', Middlenote: '', Rightnote: '' }), -})); +import { create } from "zustand"; + +interface ToggleState { + toggleUILeft: boolean; + toggleUIRight: boolean; + setToggleUI: (value1: boolean, value2: boolean) => void; +} + +export const useToggleStore = create((set) => ({ + toggleUILeft: true, + toggleUIRight: false, + setToggleUI: (value1: boolean, value2: boolean) => { + set({ toggleUILeft: value1, toggleUIRight: value2 }); + }, +})); + +interface PlayerState { + hidePlayer: boolean; + setHidePlayer: (hide: boolean) => void; +} + +// Create the Zustand store +export const usePlayerStore = create((set) => ({ + hidePlayer: false, // initial state + setHidePlayer: (hide) => set({ hidePlayer: hide }), // state updater +})); + +interface MouseNoteState { + Leftnote: string; + Middlenote: string; + Rightnote: string; + setNotes: (notes: { + Leftnote: string; + Middlenote: string; + Rightnote: string; + }) => void; + setLeftnote: (note: string) => void; + setMiddlenote: (note: string) => void; + setRightnote: (note: string) => void; + resetNotes: () => void; +} + +export const useMouseNoteStore = create((set) => ({ + Leftnote: '', + Middlenote: '', + Rightnote: '', + setNotes: (notes) => set(notes), + setLeftnote: (note) => set({ Leftnote: note }), + setMiddlenote: (note) => set({ Middlenote: note }), + setRightnote: (note) => set({ Rightnote: note }), + resetNotes: () => + set({ Leftnote: '', Middlenote: '', Rightnote: '' }), +})); diff --git a/app/src/store/useWidgetStore.ts b/app/src/store/ui/useWidgetStore.ts similarity index 97% rename from app/src/store/useWidgetStore.ts rename to app/src/store/ui/useWidgetStore.ts index 2d73c77..ff70d6b 100644 --- a/app/src/store/useWidgetStore.ts +++ b/app/src/store/ui/useWidgetStore.ts @@ -1,35 +1,35 @@ -import { create } from "zustand"; - -export interface Widget { - id: string; - type: string; // Can be chart type or "progress" - panel: "top" | "bottom" | "left" | "right"; - title: string; - fontFamily?: string; - fontSize?: string; - fontWeight?: string; - data?: any; - Data?:any; -} - -interface WidgetStore { - draggedAsset: Widget | null; // The currently dragged widget asset - widgets: Widget[]; // List of all widgets - selectedChartId: any; - setDraggedAsset: (asset: Widget | null) => void; // Setter for draggedAsset - addWidget: (widget: Widget) => void; // Add a new widget - setWidgets: (widgets: Widget[]) => void; // Replace the entire widgets array - setSelectedChartId: (widget: any | null) => void; // Set the selected chart/widget -} - -// Create the store with Zustand -export const useWidgetStore = create((set) => ({ - draggedAsset: null, - widgets: [], - selectedChartId: null, // Initialize as null, not as an array - setDraggedAsset: (asset) => set({ draggedAsset: asset }), - addWidget: (widget) => - set((state) => ({ widgets: [...state.widgets, widget] })), - setWidgets: (widgets) => set({ widgets }), - setSelectedChartId: (widget) => set({ selectedChartId: widget }), -})); +import { create } from "zustand"; + +export interface Widget { + id: string; + type: string; // Can be chart type or "progress" + panel: "top" | "bottom" | "left" | "right"; + title: string; + fontFamily?: string; + fontSize?: string; + fontWeight?: string; + data?: any; + Data?:any; +} + +interface WidgetStore { + draggedAsset: Widget | null; // The currently dragged widget asset + widgets: Widget[]; // List of all widgets + selectedChartId: any; + setDraggedAsset: (asset: Widget | null) => void; // Setter for draggedAsset + addWidget: (widget: Widget) => void; // Add a new widget + setWidgets: (widgets: Widget[]) => void; // Replace the entire widgets array + setSelectedChartId: (widget: any | null) => void; // Set the selected chart/widget +} + +// Create the store with Zustand +export const useWidgetStore = create((set) => ({ + draggedAsset: null, + widgets: [], + selectedChartId: null, // Initialize as null, not as an array + setDraggedAsset: (asset) => set({ draggedAsset: asset }), + addWidget: (widget) => + set((state) => ({ widgets: [...state.widgets, widget] })), + setWidgets: (widgets) => set({ widgets }), + setSelectedChartId: (widget) => set({ selectedChartId: widget }), +})); diff --git a/app/src/utils/mouseUtils/mouseHelper.ts b/app/src/utils/mouseUtils/mouseHelper.ts index fa309cc..b0f1101 100644 --- a/app/src/utils/mouseUtils/mouseHelper.ts +++ b/app/src/utils/mouseUtils/mouseHelper.ts @@ -1,4 +1,4 @@ -import { useMouseNoteStore } from "../../store/useUIToggleStore"; +import { useMouseNoteStore } from "../../store/ui/useUIToggleStore"; const actionNotes: Record = { 'left+CONTROL': 'Box Select', diff --git a/app/src/utils/shortcutkeys/handleShortcutKeys.ts b/app/src/utils/shortcutkeys/handleShortcutKeys.ts index 159eceb..cfedb34 100644 --- a/app/src/utils/shortcutkeys/handleShortcutKeys.ts +++ b/app/src/utils/shortcutkeys/handleShortcutKeys.ts @@ -1,8 +1,8 @@ import React, { useEffect } from "react"; -import useModuleStore, { useSubModuleStore, useThreeDStore } from "../../store/useModuleStore"; -import { usePlayerStore, useToggleStore } from "../../store/useUIToggleStore"; +import useModuleStore, { useSubModuleStore, useThreeDStore } from "../../store/ui/useModuleStore"; +import { usePlayerStore, useToggleStore } from "../../store/ui/useUIToggleStore"; import useVersionHistoryVisibleStore, { useActiveSubTool, useActiveTool, useAddAction, useDfxUpload, useRenameModeStore, useSaveVersion, useSelectedComment, useShortcutStore, useToggleView, useToolMode, useViewSceneStore } from "../../store/builder/store"; -import useCameraModeStore, { usePlayButtonStore } from "../../store/usePlayButtonStore"; +import useCameraModeStore, { usePlayButtonStore } from "../../store/ui/usePlayButtonStore"; import { detectModifierKeys } from "./detectModifierKeys"; import { useSelectedZoneStore } from "../../store/visualization/useZoneStore"; import { useLogger } from "../../components/ui/log/LoggerContext"; From 77dc8214316a9320b33a3bdcf43bd4e891cd631a Mon Sep 17 00:00:00 2001 From: Gomathi9520 Date: Fri, 5 Sep 2025 15:00:16 +0530 Subject: [PATCH 06/19] add useHeatMapStore for managing monitoring of vehicles and humans in HeatMap component --- app/src/components/HeatMap/HeatMap.tsx | 61 +++++------- app/src/store/simulation/useHeatMapStore.ts | 100 ++++++++++++++++++++ 2 files changed, 126 insertions(+), 35 deletions(-) create mode 100644 app/src/store/simulation/useHeatMapStore.ts diff --git a/app/src/components/HeatMap/HeatMap.tsx b/app/src/components/HeatMap/HeatMap.tsx index 7ae98c9..fdf0920 100644 --- a/app/src/components/HeatMap/HeatMap.tsx +++ b/app/src/components/HeatMap/HeatMap.tsx @@ -6,6 +6,7 @@ import { useSceneContext } from "../../modules/scene/sceneContext"; import * as CONSTANTS from "../../types/world/worldConstants"; import { determineExecutionMachineSequences } from "../../modules/simulation/simulator/functions/determineExecutionMachineSequences"; import { useAnimationPlaySpeed, usePauseButtonStore, usePlayButtonStore, useResetButtonStore } from "../../store/usePlayButtonStore"; +import { useHeatMapStore } from "../../store/simulation/useHeatMapStore"; const DECAY_RATE = 0.01; const GROWTH_TIME_MULTIPLIER = 20; @@ -32,6 +33,7 @@ const HeatMap = () => { const { getProductById, products } = productStore(); const { selectedProductStore } = useProductContext(); const { selectedProduct } = selectedProductStore(); + const { hasHuman, hasVehicle, monitoringHuman, monitoringVehicle, addMonitoringHuman, addMonitoringVehicle } = useHeatMapStore(); const { isPlaying } = usePlayButtonStore(); const { isReset } = useResetButtonStore(); const { isPaused } = usePauseButtonStore(); @@ -62,6 +64,11 @@ const HeatMap = () => { } }, [isReset, isPlaying]); + useEffect(() => { + addMonitoringVehicle("26770368-55e8-4d40-87f7-8eacb48dc236"); + addMonitoringHuman("264a51e7-d8b9-4093-95ac-fa7e2dc49cfa"); + }, []); + useEffect(() => { const selectedProductData = getProductById(selectedProduct.productUuid); const newEvents: EventsSchema[] = []; @@ -70,21 +77,26 @@ const HeatMap = () => { determineExecutionMachineSequences([selectedProductData]).then((sequences) => { sequences.forEach((sequence) => { sequence.forEach((event) => { - if (event.type === "human" || event.type === "vehicle") { - newEvents.push(event); + if (event.type === "human") { + if (hasHuman(event.modelUuid)) { + newEvents.push(event); + } + } else if (event.type === "vehicle") { + if (hasVehicle(event.modelUuid)) { + newEvents.push(event); + } } }); }); setEvents(newEvents); }); } - }, [selectedProduct, products]); + }, [selectedProduct, products, monitoringHuman, monitoringVehicle]); useFrame((state) => { if (!scene || !isPlaying || isReset) return; const now = state.clock.elapsedTime; - if (isPaused || speed === 0) { lastFrameTime.current = now; return; @@ -95,16 +107,13 @@ const HeatMap = () => { delta = now - lastFrameTime.current; } lastFrameTime.current = now; - + if (delta <= 0) return; - const updateInterval = UPDATE_INTERVAL / Math.max(speed, 0.1); if (now - lastUpdateTime.current < updateInterval) return; lastUpdateTime.current = now; - const scaledDelta = delta * speed; - let updatedPoints = [...points]; events.forEach((event) => { @@ -113,35 +122,23 @@ const HeatMap = () => { const pos = isUsingBBOX ? (() => { - const box = new THREE.Box3().setFromObject(model); - const { min, max } = box; - return new THREE.Vector3((min.x + max.x) / 2, 0, (min.z + max.z) / 2); - })() + const box = new THREE.Box3().setFromObject(model); + const { min, max } = box; + return new THREE.Vector3((min.x + max.x) / 2, 0, (min.z + max.z) / 2); + })() : model.position; - updatedPoints.push({ - x: pos.x, - y: pos.z, - strength: 0.3, - lastUpdated: now, - }); + updatedPoints.push({ x: pos.x, y: pos.z, strength: 0.3, lastUpdated: now }); }); - updatedPoints = updatedPoints - .map((p) => ({ - ...p, - strength: Math.max(0, p.strength - DECAY_RATE * scaledDelta), - })) - .filter((p) => p.strength > 0.01); + updatedPoints = updatedPoints.map((p) => ({ ...p, strength: Math.max(0, p.strength - DECAY_RATE * scaledDelta) })).filter((p) => p.strength > 0.01); setPoints(updatedPoints); }); const pointTexture = useMemo(() => { if (points.length === 0) return null; - const data = new Float32Array(points.length * 4); - points.forEach((p, i) => { const index = i * 4; data[index] = (p.x + width / 2) / width; @@ -150,13 +147,7 @@ const HeatMap = () => { data[index + 3] = 0.0; }); - const texture = new THREE.DataTexture( - data, - points.length, - 1, - THREE.RGBAFormat, - THREE.FloatType - ); + const texture = new THREE.DataTexture(data, points.length, 1, THREE.RGBAFormat, THREE.FloatType); texture.needsUpdate = true; return texture; }, [points, width, height]); @@ -234,7 +225,7 @@ const HeatMap = () => { float adjustedIntensity = intensity * u_growthRate; // Normalize intensity between 0-1 - float normalized = clamp(intensity / max(u_growthRate, 0.0001), 0.0, 1.0); + float normalized = clamp(intensity / max(u_growthRate, 0.0001), 0.0, 1.0); vec3 color = vec3(0.0); if (normalized < 0.33) { @@ -254,4 +245,4 @@ const HeatMap = () => { ); }; -export default HeatMap; \ No newline at end of file +export default HeatMap; diff --git a/app/src/store/simulation/useHeatMapStore.ts b/app/src/store/simulation/useHeatMapStore.ts new file mode 100644 index 0000000..a156ccf --- /dev/null +++ b/app/src/store/simulation/useHeatMapStore.ts @@ -0,0 +1,100 @@ +import { create } from "zustand"; +import { immer } from "zustand/middleware/immer"; + +interface HeatMapState { + monitoringVehicle: string[]; + monitoringHuman: string[]; + + setMonitoringVehicle: (vehiclesUuid: string[]) => void; + addMonitoringVehicle: (vehicleUuid: string) => void; + removeMonitoringVehicle: (vehicleUuid: string) => void; + clearMonitoringVehicle: () => void; + + setMonitoringHuman: (humansUuid: string[]) => void; + addMonitoringHuman: (humanUuid: string) => void; + removeMonitoringHuman: (humanUuid: string) => void; + clearMonitoringHuman: () => void; + + clearAllMonitors: () => void; + + hasVehicle: (vehicleUuid: string) => boolean; + hasHuman: (humanUuid: string) => boolean; +} + +export const useHeatMapStore = create()( + immer((set, get) => ({ + monitoringVehicle: [], + monitoringHuman: [], + + setMonitoringVehicle: (vehiclesUuid) => + set((state) => { + state.monitoringVehicle = vehiclesUuid; + }), + + addMonitoringVehicle: (vehicleUuid) => + set((state) => { + if (!state.monitoringVehicle.includes(vehicleUuid)) { + state.monitoringVehicle.push(vehicleUuid); + } + }), + + removeMonitoringVehicle: (vehicleUuid) => + set((state) => { + state.monitoringVehicle = state.monitoringVehicle.filter((v) => v !== vehicleUuid); + }), + + clearMonitoringVehicle: () => + set((state) => { + state.monitoringVehicle = []; + }), + + setMonitoringHuman: (humansUuid) => + set((state) => { + state.monitoringHuman = humansUuid; + }), + + addMonitoringHuman: (humanUuid) => + set((state) => { + if (!state.monitoringHuman.includes(humanUuid)) { + state.monitoringHuman.push(humanUuid); + } + }), + + removeMonitoringHuman: (humanUuid) => + set((state) => { + state.monitoringHuman = state.monitoringHuman.filter((h) => h !== humanUuid); + }), + + clearMonitoringHuman: () => + set((state) => { + state.monitoringHuman = []; + }), + + clearAllMonitors: () => + set((state) => { + state.monitoringVehicle = []; + state.monitoringHuman = []; + }), + + hasVehicle: (vehicleUuid) => get().monitoringVehicle.includes(vehicleUuid), + hasHuman: (humanUuid) => get().monitoringHuman.includes(humanUuid), + })) +); + +// useEffect(() => { +// const selectedProductData = getProductById(selectedProduct.productUuid); +// const newEvents: EventsSchema[] = []; + +// if (selectedProductData) { +// determineExecutionMachineSequences([selectedProductData]).then((sequences) => { +// sequences.forEach((sequence) => { +// sequence.forEach((event) => { +// if (event.type === "human" || event.type === "vehicle") { +// newEvents.push(event); +// } +// }); +// }); +// setEvents(newEvents); +// }); +// } +// }, [selectedProduct, products, monitoringHuman, monitoringVehicle]); \ No newline at end of file From 9904a5079d60eb0575752991ae5341abe5b4c980 Mon Sep 17 00:00:00 2001 From: Jerald-Golden-B Date: Fri, 5 Sep 2025 15:17:43 +0530 Subject: [PATCH 07/19] integerated version context with scene context --- app/src/components/footer/Footer.tsx | 6 +- .../layout/scenes/ComparisonScene.tsx | 105 +- .../components/layout/scenes/MainScene.tsx | 107 +- .../properties/SelectedAisleProperties.tsx | 6 +- .../properties/SelectedDecalProperties.tsx | 6 +- .../properties/SelectedFloorProperties.tsx | 6 +- .../properties/SelectedWallProperties.tsx | 6 +- .../properties/ZoneProperties.tsx | 8 +- .../eventProperties/EventProperties.tsx | 7 +- .../components/ActionsList.tsx | 266 ++-- .../mechanics/conveyorMechanics.tsx | 6 +- .../mechanics/craneMechanics.tsx | 6 +- .../mechanics/humanMechanics.tsx | 6 +- .../mechanics/machineMechanics.tsx | 6 +- .../mechanics/roboticArmMechanics.tsx | 6 +- .../mechanics/storageMechanics.tsx | 6 +- .../mechanics/vehicleMechanics.tsx | 6 +- .../eventProperties/trigger/Trigger.tsx | 8 +- .../sidebarRight/simulation/Simulations.tsx | 6 +- .../versionHisory/VersionHistory.tsx | 17 +- .../versionHisory/VersionSaved.tsx | 13 +- .../IotInputCards/BarChartInput.tsx | 308 ++-- .../FleetEfficiencyInputComponent.tsx | 288 ++-- .../IotInputCards/FlotingWidgetInput.tsx | 293 ++-- .../IotInputCards/LineGrapInput.tsx | 428 ++--- .../IotInputCards/PieChartInput.tsx | 314 ++-- .../IotInputCards/Progress1Input.tsx | 282 ++-- .../IotInputCards/Progress2Input.tsx | 282 ++-- .../WarehouseThroughputInputComponent.tsx | 307 ++-- .../IotInputCards/Widget2InputCard3D.tsx | 302 ++-- .../IotInputCards/Widget3InputCard3D.tsx | 298 ++-- .../IotInputCards/Widget4InputCard3D.tsx | 325 ++-- .../visualization/Visualization.tsx | 26 +- app/src/components/ui/ModuleToggle.tsx | 4 +- app/src/components/ui/Tools.tsx | 167 +- .../ui/analysis/ProductionCapacity.tsx | 335 ++-- .../components/ui/collaboration/Messages.tsx | 462 +++--- .../ui/collaboration/ThreadChat.tsx | 686 ++++---- .../ui/compareVersion/CompareLayOut.tsx | 344 ++-- app/src/components/ui/list/List.tsx | 588 ++++--- app/src/components/ui/menu/menu.tsx | 443 +++--- app/src/hooks/useResetStates.ts | 7 - .../Decal/decalCreator/decalCreator.tsx | 75 +- .../eventHandler/useDecalEventHandlers.ts | 6 +- .../aisle/aisleCreator/aisleCreator.tsx | 75 +- app/src/modules/builder/aisle/aislesGroup.tsx | 49 +- app/src/modules/builder/asset/assetsGroup.tsx | 176 ++- ...ntHandlers.ts => useModelEventHandlers.ts} | 6 +- .../builder/asset/models/model/model.tsx | 2 +- app/src/modules/builder/dfx/LoadBlueprint.tsx | 67 +- .../floor/floorCreator/floorCreator.tsx | 132 +- app/src/modules/builder/floor/floorGroup.tsx | 56 +- app/src/modules/builder/line/line.tsx | 394 +++-- app/src/modules/builder/point/point.tsx | 495 +++--- .../builder/version/versionContext.tsx | 37 - .../builder/wall/wallCreator/wallCreator.tsx | 249 ++- app/src/modules/builder/wall/wallGroup.tsx | 56 +- .../eventHandler/useWallAssetEventHandler.ts | 6 +- .../builder/wallAsset/wallAssetCreator.tsx | 62 +- .../builder/wallAsset/wallAssetGroup.tsx | 56 +- .../builder/zone/zoneCreator/zoneCreator.tsx | 138 +- app/src/modules/builder/zone/zoneGroup.tsx | 56 +- .../comments/instances/commentInstances.tsx | 68 +- .../selection2D/moveControls2D.tsx | 228 ++- .../selection2D/selectionControls2D.tsx | 213 ++- .../selection3D/copyPasteControls3D.tsx | 151 +- .../selection3D/duplicationControls3D.tsx | 166 +- .../selection3D/moveControls3D.tsx | 130 +- .../selection3D/rotateControls3D.tsx | 114 +- .../selection3D/selectionControls3D.tsx | 81 +- .../selection3D/transformControls3D.tsx | 135 +- .../transformControls/transformControls.tsx | 76 +- .../handlers/use2DRedoHandler.ts | 6 +- .../handlers/use2DUndoHandler.ts | 6 +- .../handlers/use3DRedoHandler.ts | 6 +- .../handlers/use3DUndoHandler.ts | 6 +- .../undoRedo2D/undoRedo2DControls.tsx | 26 +- .../undoRedo3D/undoRedo3DControls.tsx | 30 +- app/src/modules/scene/gizmo/gizmo.tsx | 88 +- app/src/modules/scene/sceneContext.tsx | 12 +- .../productionCapacityData.tsx | 16 +- .../simulation/events/arrows/arrows.tsx | 105 +- .../events/points/creator/pointsCreator.tsx | 81 +- .../instances/instance/pointInstance.tsx | 55 +- .../triggerConnections/triggerConnector.tsx | 252 ++- .../human/instances/instance/humanUi.tsx | 190 +-- .../modules/simulation/products/products.tsx | 6 +- .../simulation/spatialUI/arm/armBotUI.tsx | 128 +- .../spatialUI/vehicle/vehicleUI.tsx | 246 +-- .../visualization/RealTimeVisulization.tsx | 398 ++--- .../visualization/template/Templates.tsx | 217 ++- .../widgets/2d/DraggableWidget.tsx | 437 +++--- .../widgets/2d/charts/BarGraphComponent.tsx | 338 ++-- .../2d/charts/DoughnutGraphComponent.tsx | 316 ++-- .../widgets/2d/charts/LineGraphComponent.tsx | 339 ++-- .../widgets/2d/charts/PieGraphComponent.tsx | 341 ++-- .../2d/charts/PolarAreaGraphComponent.tsx | 339 ++-- .../widgets/2d/charts/ProgressCard1.tsx | 159 +- .../widgets/2d/charts/ProgressCard2.tsx | 191 ++- .../widgets/3d/Dropped3dWidget.tsx | 1387 +++++++---------- .../widgets/3d/cards/ProductionCapacity.tsx | 494 +++--- .../widgets/3d/cards/ReturnOfInvestment.tsx | 460 +++--- .../widgets/3d/cards/StateWorking.tsx | 354 ++--- .../widgets/3d/cards/Throughput.tsx | 458 +++--- .../floating/DroppedFloatingWidgets.tsx | 1001 ++++++------ .../cards/FleetEfficiencyComponent.tsx | 178 +-- .../floating/cards/TotalCardComponent.tsx | 178 ++- .../cards/WarehouseThroughputComponent.tsx | 325 ++-- .../widgets/panel/AddButtons.tsx | 524 +++---- .../visualization/widgets/panel/Panel.tsx | 801 +++++----- .../visualization/zone/DisplayZone.tsx | 447 +++--- app/src/pages/Project.tsx | 53 +- app/src/services/visulization/zone/panel.ts | 62 +- .../store/builder/useVersionHistoryStore.ts | 76 - app/src/store/builder/useVersionStore.ts | 97 ++ app/src/store/scene/useSceneStore.ts | 28 - .../simulation/useCompareProductStore.ts | 18 - .../store/simulation/useSimulationStore.ts | 26 - .../utils/shortcutkeys/handleShortcutKeys.ts | 17 +- 119 files changed, 9540 insertions(+), 12431 deletions(-) rename app/src/modules/builder/asset/models/model/eventHandlers/{useEventHandlers.ts => useModelEventHandlers.ts} (98%) delete mode 100644 app/src/modules/builder/version/versionContext.tsx delete mode 100644 app/src/store/builder/useVersionHistoryStore.ts create mode 100644 app/src/store/builder/useVersionStore.ts delete mode 100644 app/src/store/scene/useSceneStore.ts delete mode 100644 app/src/store/simulation/useCompareProductStore.ts diff --git a/app/src/components/footer/Footer.tsx b/app/src/components/footer/Footer.tsx index d6075f8..eb1a430 100644 --- a/app/src/components/footer/Footer.tsx +++ b/app/src/components/footer/Footer.tsx @@ -7,9 +7,9 @@ import ShortcutHelper from "./shortcutHelper"; import useVersionHistoryVisibleStore, { useShortcutStore } from "../../store/builder/store"; import { usePlayButtonStore } from "../../store/ui/usePlayButtonStore"; import useModuleStore, { useSubModuleStore } from "../../store/ui/useModuleStore"; -import { useVersionContext } from "../../modules/builder/version/versionContext"; import { mouseActionHelper } from "../../utils/mouseUtils/mouseHelper"; import { useMouseNoteStore } from "../../store/ui/useUIToggleStore"; +import { useSceneContext } from "../../modules/scene/sceneContext"; const Footer: React.FC = () => { const { logs, setIsLogListVisible } = useLogger(); @@ -20,8 +20,8 @@ const Footer: React.FC = () => { const { setVersionHistoryVisible } = useVersionHistoryVisibleStore(); const { isPlaying } = usePlayButtonStore(); const { showShortcuts, setShowShortcuts } = useShortcutStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); const { Leftnote, Middlenote, Rightnote } = useMouseNoteStore(); const [isOnline, setIsOnline] = useState(navigator.onLine); diff --git a/app/src/components/layout/scenes/ComparisonScene.tsx b/app/src/components/layout/scenes/ComparisonScene.tsx index 142a13e..2938f27 100644 --- a/app/src/components/layout/scenes/ComparisonScene.tsx +++ b/app/src/components/layout/scenes/ComparisonScene.tsx @@ -1,19 +1,21 @@ -import { useProductContext } from '../../../modules/simulation/products/productContext' -import RegularDropDown from '../../ui/inputs/RegularDropDown'; -import { useCompareProductDataStore, useLoadingProgress, useSaveVersion } from '../../../store/builder/store'; -import useModuleStore from '../../../store/ui/useModuleStore'; -import CompareLayOut from '../../ui/compareVersion/CompareLayOut'; -import ComparisonResult from '../../ui/compareVersion/ComparisonResult'; -import { useComparisonProduct, useMainProduct } from '../../../store/simulation/useSimulationStore'; -import { usePlayButtonStore } from '../../../store/ui/usePlayButtonStore'; -import { useEffect, useState } from 'react'; -import { useVersionHistoryStore } from '../../../store/builder/useVersionHistoryStore'; -import { useVersionContext } from '../../../modules/builder/version/versionContext'; -import { useSceneContext } from '../../../modules/scene/sceneContext'; +import { useParams } from "react-router-dom"; +import { useProductContext } from "../../../modules/simulation/products/productContext"; +import { useCompareProductDataStore, useLoadingProgress, useSaveVersion } from "../../../store/builder/store"; +import { useComparisonProduct, useMainProduct } from "../../../store/simulation/useSimulationStore"; +import { usePlayButtonStore } from "../../../store/ui/usePlayButtonStore"; +import { useEffect, useState } from "react"; +import { useSceneContext } from "../../../modules/scene/sceneContext"; +import useModuleStore from "../../../store/ui/useModuleStore"; +import CompareLayOut from "../../ui/compareVersion/CompareLayOut"; +import ComparisonResult from "../../ui/compareVersion/ComparisonResult"; +import RegularDropDown from "../../ui/inputs/RegularDropDown"; + +import { getVersionHistoryApi } from "../../../services/factoryBuilder/versionControl/getVersionHistoryApi"; function ComparisonScene() { const { isPlaying } = usePlayButtonStore(); - const { productStore } = useSceneContext(); + const { productStore, versionStore } = useSceneContext(); + const { versionHistory, selectedVersion, setSelectedVersion, setVersions } = versionStore(); const { products } = productStore(); const { isVersionSaved } = useSaveVersion(); const { activeModule } = useModuleStore(); @@ -22,11 +24,9 @@ function ComparisonScene() { const { comparisonProduct, setComparisonProduct } = useComparisonProduct(); const { mainProduct } = useMainProduct(); const { loadingProgress } = useLoadingProgress(); - const { compareProductsData, setCompareProductsData } = useCompareProductDataStore(); + const { compareProductsData } = useCompareProductDataStore(); const [shouldShowComparisonResult, setShouldShowComparisonResult] = useState(false); - const { versionHistory } = useVersionHistoryStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion, setSelectedVersion } = selectedVersionStore(); + const { projectId } = useParams() const handleSelectVersion = (option: string) => { const version = versionHistory.find((version) => version.versionName === option); @@ -42,49 +42,34 @@ function ComparisonScene() { } }; - // useEffect(() => { - // if (versionHistory.length > 0) { - // setSelectedVersion(versionHistory[0]) - // } - // }, [versionHistory]) - - // useEffect(() => { - // setCompareProductsData([ - // { - // "productUuid": "15193386-ec58-4ec6-8a92-e665a39eebf1", - // "productName": "Product 1", - // "simulationData": { - // "roiPercentage": 273.9428571428571, - // "paybackPeriod": 1.8251981643721318, - // "netProfit": 9588000, - // "productionCapacity": 4508.5, - // "machineIdleTime": 1450, - // "machineActiveTime": 430, - // "throughputData": 180.34 - // } - // }, - // { - // "productUuid": "f614bf50-f61d-41c5-acc0-3783fb4da6b8", - // "productName": "Product 2", - // "simulationData": { - // "roiPercentage": 281.7214285714286, - // "paybackPeriod": 1.7748028701097842, - // "netProfit": 9860250, - // "productionCapacity": 4599.25, - // "machineIdleTime": 1885, - // "machineActiveTime": 646, - // "throughputData": 183.97 - // } - // } - // ]) - // }, []); + useEffect(() => { + if (!projectId) return; + getVersionHistoryApi(projectId) + .then((data) => { + const versions: VersionHistory = []; + data.versions.forEach((version: any) => { + versions.push({ + version: version.version, + versionId: version.versionId, + versionName: version.versionName, + versionDescription: version.description, + timeStamp: version.createdAt, + createdBy: version.createdBy.userName, + }); + }); + setVersions(versions); + }) + .catch(() => { + console.error("Error fetching version history"); + }); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [projectId]); useEffect(() => { if (mainProduct && comparisonProduct && compareProductsData.length > 1) { - // console.log('compareProductsData: ', compareProductsData); - const hasMain = compareProductsData.some(val => val.productUuid === mainProduct.productUuid); - const hasComparison = compareProductsData.some(val => val.productUuid === comparisonProduct.productUuid); + const hasMain = compareProductsData.some((val) => val.productUuid === mainProduct.productUuid); + const hasComparison = compareProductsData.some((val) => val.productUuid === comparisonProduct.productUuid); if (hasMain && hasComparison && mainProduct.productUuid !== comparisonProduct.productUuid) { setShouldShowComparisonResult(true); } else { @@ -99,7 +84,7 @@ function ComparisonScene() { <> {isVersionSaved && activeModule === "simulation" && selectedProduct && ( <> - {selectedVersion && !isPlaying && + {selectedVersion && !isPlaying && (
- } + )} - {(shouldShowComparisonResult && !loadingProgress) && } + {shouldShowComparisonResult && !loadingProgress && } )} - ) + ); } export default ComparisonScene; diff --git a/app/src/components/layout/scenes/MainScene.tsx b/app/src/components/layout/scenes/MainScene.tsx index 6dfb061..34a1672 100644 --- a/app/src/components/layout/scenes/MainScene.tsx +++ b/app/src/components/layout/scenes/MainScene.tsx @@ -1,5 +1,18 @@ import { useEffect } from "react"; import { useLoadingProgress, useRenameModeStore, useSaveVersion, useSelectedComment, useSocketStore, useWidgetSubOption } from "../../../store/builder/store"; +import useModuleStore, { useThreeDStore } from "../../../store/ui/useModuleStore"; +import { usePlayButtonStore } from "../../../store/ui/usePlayButtonStore"; +import { useSelectedZoneStore } from "../../../store/visualization/useZoneStore"; +import { useFloatingWidget } from "../../../store/visualization/useDroppedObjectsStore"; +import { useSelectedUserStore } from "../../../store/collaboration/useCollabStore"; +import { createHandleDrop } from "../../../modules/visualization/functions/handleUiDrop"; +import { useComparisonProduct, useMainProduct } from "../../../store/simulation/useSimulationStore"; +import { useProductContext } from "../../../modules/simulation/products/productContext"; +import { useParams } from "react-router-dom"; +import { useSceneContext } from "../../../modules/scene/sceneContext"; +import { useBuilderStore } from "../../../store/builder/useBuilderStore"; +import { getUserData } from "../../../functions/getUserData"; +import useRestStates from "../../../hooks/useResetStates"; import KeyPressListener from "../../../utils/shortcutkeys/handleShortcutKeys"; import LoadingPage from "../../templates/LoadingPage"; import ModuleToggle from "../../ui/ModuleToggle"; @@ -17,23 +30,10 @@ import VersionSaved from "../sidebarRight/versionHisory/VersionSaved"; import Footer from "../../footer/Footer"; import ThreadChat from "../../ui/collaboration/ThreadChat"; import Scene from "../../../modules/scene/scene"; -import useModuleStore, { useThreeDStore } from "../../../store/ui/useModuleStore"; -import { usePlayButtonStore } from "../../../store/ui/usePlayButtonStore"; -import { useSelectedZoneStore } from "../../../store/visualization/useZoneStore"; -import { useFloatingWidget } from "../../../store/visualization/useDroppedObjectsStore"; -import { useSelectedUserStore } from "../../../store/collaboration/useCollabStore"; -import { createHandleDrop } from "../../../modules/visualization/functions/handleUiDrop"; -import { useComparisonProduct, useMainProduct } from "../../../store/simulation/useSimulationStore"; -import { useProductContext } from "../../../modules/simulation/products/productContext"; -import { setAssetsApi } from "../../../services/factoryBuilder/asset/floorAsset/setAssetsApi"; -import { useParams } from "react-router-dom"; -import { useSceneContext } from "../../../modules/scene/sceneContext"; -import { useVersionHistoryStore } from "../../../store/builder/useVersionHistoryStore"; -import { useVersionContext } from "../../../modules/builder/version/versionContext"; -import { useBuilderStore } from "../../../store/builder/useBuilderStore"; + import { recentlyViewed } from "../../../services/dashboard/recentlyViewed"; -import { getUserData } from "../../../functions/getUserData"; -import useRestStates from "../../../hooks/useResetStates"; +import { setAssetsApi } from "../../../services/factoryBuilder/asset/floorAsset/setAssetsApi"; +import { getVersionHistoryApi } from "../../../services/factoryBuilder/versionControl/getVersionHistoryApi"; function MainScene() { const { setMainProduct } = useMainProduct(); @@ -51,30 +51,52 @@ function MainScene() { const { setFloatingWidget } = useFloatingWidget(); const { clearComparisonProduct } = useComparisonProduct(); const { selectedFloorAsset, setSelectedFloorAsset } = useBuilderStore(); - const { assetStore, productStore } = useSceneContext(); + const { assetStore, productStore, versionStore } = useSceneContext(); const { products } = productStore(); + const { versionHistory, setVersions, selectedVersion, setSelectedVersion } = versionStore(); const { setName, selectedAssets, setSelectedAssets } = assetStore(); - const { projectId } = useParams() + const { projectId } = useParams(); const { organization, userId } = getUserData(); const { isRenameMode, setIsRenameMode } = useRenameModeStore(); - const { versionHistory } = useVersionHistoryStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion, setSelectedVersion } = selectedVersionStore(); const { selectedComment, commentPositionState } = useSelectedComment(); const { resetStates } = useRestStates(); useEffect(() => { return () => { resetStates(); - } - }, []) + }; + }, []); useEffect(() => { - if (activeModule !== 'simulation') { + if (activeModule !== "simulation") { clearComparisonProduct(); setIsVersionSaved(false); } - }, [activeModule, clearComparisonProduct, setIsVersionSaved]) + }, [activeModule, clearComparisonProduct, setIsVersionSaved]); + + useEffect(() => { + if (!projectId) return; + + getVersionHistoryApi(projectId) + .then((data) => { + const versions: VersionHistory = []; + data.versions.forEach((version: any) => { + versions.push({ + version: version.version, + versionId: version.versionId, + versionName: version.versionName, + versionDescription: version.description, + timeStamp: version.createdAt, + createdBy: version.createdBy.userName, + }); + }); + setVersions(versions); + }) + .catch(() => { + console.error("Error fetching version history"); + }); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [projectId]); useEffect(() => { if (versionHistory.length > 0 && organization && userId) { @@ -88,9 +110,9 @@ function MainScene() { } else { setSelectedVersion(versionHistory[0]); } - }) + }); } - }, [setSelectedVersion, versionHistory, projectId]) + }, [setSelectedVersion, versionHistory, projectId]); const handleSelectVersion = (option: string) => { const version = versionHistory.find((version) => version.versionName === option); @@ -107,33 +129,33 @@ function MainScene() { }; const handleObjectRename = async (newName: string) => { - if (!projectId) return + if (!projectId) return; if (selectedFloorAsset) { setAssetsApi({ modelUuid: selectedFloorAsset.userData.modelUuid, modelName: newName, projectId, - versionId: selectedVersion?.versionId || '' + versionId: selectedVersion?.versionId || "", }).then(() => { selectedFloorAsset.userData = { ...selectedFloorAsset.userData, modelName: newName }; setSelectedFloorAsset(selectedFloorAsset); setIsRenameMode(false); setName(selectedFloorAsset.userData.modelUuid, newName); - }) + }); } else if (selectedAssets.length === 1) { setAssetsApi({ modelUuid: selectedAssets[0].userData.modelUuid, modelName: newName, projectId, - versionId: selectedVersion?.versionId || '' + versionId: selectedVersion?.versionId || "", }).then(() => { selectedAssets[0].userData = { ...selectedAssets[0].userData, modelName: newName }; setSelectedAssets(selectedAssets); setIsRenameMode(false); setName(selectedAssets[0].userData.modelUuid, newName); - }) + }); } - } + }; return ( <> @@ -150,11 +172,9 @@ function MainScene() { )} {activeModule === "market" && } - {activeModule !== "market" && !isPlaying && !isVersionSaved && ( - - )} - {(isPlaying) && activeModule === "simulation" && loadingProgress === 0 && } - {(isPlaying) && activeModule !== "simulation" && } + {activeModule !== "market" && !isPlaying && !isVersionSaved && } + {isPlaying && activeModule === "simulation" && loadingProgress === 0 && } + {isPlaying && activeModule !== "simulation" && } {isRenameMode && (selectedFloorAsset?.userData.modelName || selectedAssets.length === 1) && } {/* remove this later */} @@ -168,8 +188,7 @@ function MainScene() { height: isPlaying || activeModule !== "visualization" ? "100vh" : "", width: isPlaying || activeModule !== "visualization" ? "100vw" : "", left: isPlaying || activeModule !== "visualization" ? "0%" : "", - borderRadius: - isPlaying || activeModule !== "visualization" ? "" : "6px", + borderRadius: isPlaying || activeModule !== "visualization" ? "" : "6px", }} role="application" onDrop={(event) => @@ -180,7 +199,7 @@ function MainScene() { setFloatingWidget, event, projectId, - versionId: selectedVersion?.versionId || '', + versionId: selectedVersion?.versionId || "", }) } onDragOver={(event) => event.preventDefault()} @@ -210,11 +229,7 @@ function MainScene() { - { - (commentPositionState !== null || selectedComment !== null) && - - } - + {(commentPositionState !== null || selectedComment !== null) && } ); } diff --git a/app/src/components/layout/sidebarRight/properties/SelectedAisleProperties.tsx b/app/src/components/layout/sidebarRight/properties/SelectedAisleProperties.tsx index e4e993f..40da752 100644 --- a/app/src/components/layout/sidebarRight/properties/SelectedAisleProperties.tsx +++ b/app/src/components/layout/sidebarRight/properties/SelectedAisleProperties.tsx @@ -15,7 +15,6 @@ import Solid from "../../../../assets/image/aisleTypes/Solid.png"; import InputToggle from "../../../ui/inputs/InputToggle"; import { useBuilderStore } from "../../../../store/builder/useBuilderStore"; import { useSceneContext } from "../../../../modules/scene/sceneContext"; -import { useVersionContext } from "../../../../modules/builder/version/versionContext"; import { useSocketStore } from "../../../../store/builder/store"; import { getUserData } from "../../../../functions/getUserData"; import { aisleTextureList } from "./AisleProperties"; @@ -25,10 +24,9 @@ import { upsertAisleApi } from "../../../../services/factoryBuilder/aisle/upsert const SelectedAisleProperties: React.FC = () => { const [collapsePresets, setCollapsePresets] = useState(false); const [collapseTexture, setCollapseTexture] = useState(true); - const { aisleStore } = useSceneContext(); + const { aisleStore, versionStore } = useSceneContext(); const { getAisleById, updateAisle, setDashedAisleProperties, setDottedAisleProperties, setArrowsAisleProperties, setArcAisleWidth, setColor } = aisleStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { socket } = useSocketStore(); const { userId, organization } = getUserData(); const { projectId } = useParams(); diff --git a/app/src/components/layout/sidebarRight/properties/SelectedDecalProperties.tsx b/app/src/components/layout/sidebarRight/properties/SelectedDecalProperties.tsx index 196b793..1e2d3f2 100644 --- a/app/src/components/layout/sidebarRight/properties/SelectedDecalProperties.tsx +++ b/app/src/components/layout/sidebarRight/properties/SelectedDecalProperties.tsx @@ -1,5 +1,4 @@ import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../modules/scene/sceneContext"; import { useBuilderStore } from "../../../../store/builder/useBuilderStore"; import { LayeringBottomIcon, LayeringTopIcon } from "../../../icons/ExportCommonIcons"; @@ -12,12 +11,11 @@ import { upsertFloorApi } from "../../../../services/factoryBuilder/floor/upsert const SelectedDecalProperties = () => { const { selectedDecal, setSelectedDecal } = useBuilderStore(); - const { wallStore, floorStore } = useSceneContext(); + const { wallStore, floorStore, versionStore } = useSceneContext(); const { updateDecal: updateDecalInWall } = wallStore(); const { updateDecal: updateDecalInFloor } = floorStore(); const { userId, organization } = getUserData(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { projectId } = useParams(); const { socket } = useSocketStore(); diff --git a/app/src/components/layout/sidebarRight/properties/SelectedFloorProperties.tsx b/app/src/components/layout/sidebarRight/properties/SelectedFloorProperties.tsx index bcb51a1..93432ff 100644 --- a/app/src/components/layout/sidebarRight/properties/SelectedFloorProperties.tsx +++ b/app/src/components/layout/sidebarRight/properties/SelectedFloorProperties.tsx @@ -4,7 +4,6 @@ import InputToggle from "../../../ui/inputs/InputToggle"; import { useBuilderStore } from "../../../../store/builder/useBuilderStore"; import { useSceneContext } from "../../../../modules/scene/sceneContext"; -import { useVersionContext } from "../../../../modules/builder/version/versionContext"; import { useParams } from "react-router-dom"; import { getUserData } from "../../../../functions/getUserData"; import { useSocketStore } from "../../../../store/builder/store"; @@ -17,9 +16,8 @@ const SelectedFloorProperties = () => { const [isBeveled, setIsBeveled] = useState(false); const [bevelStrength, setBevelStrength] = useState(""); const { selectedFloor } = useBuilderStore(); - const { floorStore } = useSceneContext(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { floorStore, versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); const { socket } = useSocketStore(); const { userId, organization } = getUserData(); const { projectId } = useParams(); diff --git a/app/src/components/layout/sidebarRight/properties/SelectedWallProperties.tsx b/app/src/components/layout/sidebarRight/properties/SelectedWallProperties.tsx index c26265a..cd8c7c1 100644 --- a/app/src/components/layout/sidebarRight/properties/SelectedWallProperties.tsx +++ b/app/src/components/layout/sidebarRight/properties/SelectedWallProperties.tsx @@ -6,7 +6,6 @@ import wallTexture1 from '../../../../assets/textures/floor/factory wall texture import { useBuilderStore } from "../../../../store/builder/useBuilderStore"; import { useSceneContext } from "../../../../modules/scene/sceneContext"; -import { useVersionContext } from "../../../../modules/builder/version/versionContext"; import { useParams } from "react-router-dom"; import { getUserData } from "../../../../functions/getUserData"; import { useSocketStore } from "../../../../store/builder/store"; @@ -17,9 +16,8 @@ const SelectedWallProperties = () => { const [height, setHeight] = useState(""); const [thickness, setThickness] = useState(""); const { selectedWall } = useBuilderStore(); - const { wallStore } = useSceneContext(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { wallStore, versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); const { socket } = useSocketStore(); const { userId, organization } = getUserData(); const { projectId } = useParams(); diff --git a/app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx b/app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx index 32bec03..6a0f2e1 100644 --- a/app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx +++ b/app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx @@ -10,7 +10,6 @@ import { import { zoneCameraUpdate } from "../../../../services/visulization/zone/zoneCameraUpdation"; import { useParams } from "react-router-dom"; import { getUserData } from "../../../../functions/getUserData"; -import { useVersionContext } from "../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../modules/scene/sceneContext"; const ZoneProperties: React.FC = () => { @@ -18,13 +17,12 @@ const ZoneProperties: React.FC = () => { const { selectedZone, setSelectedZone } = useSelectedZoneStore(); const { zonePosition, setZonePosition } = usezonePosition(); const { zoneTarget, setZoneTarget } = usezoneTarget(); - const { zoneStore } = useSceneContext(); + const { zoneStore, versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); const { zones, setZoneName } = zoneStore() const { projectId } = useParams(); const { organization } = getUserData(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); useEffect(() => { setZonePosition(selectedZone.zoneViewPortPosition); @@ -85,7 +83,7 @@ const ZoneProperties: React.FC = () => { setSelectedZone((prev) => ({ ...prev, [key]: newValue })); } const checkZoneNameDuplicate = (name: string) => { - + return zones.some( (zone: any) => zone.zoneName?.trim().toLowerCase() === name?.trim().toLowerCase() && diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/EventProperties.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/EventProperties.tsx index a6332db..1ac963f 100644 --- a/app/src/components/layout/sidebarRight/properties/eventProperties/EventProperties.tsx +++ b/app/src/components/layout/sidebarRight/properties/eventProperties/EventProperties.tsx @@ -13,22 +13,21 @@ import { AddIcon } from "../../../../icons/ExportCommonIcons"; import { handleAddEventToProduct } from "../../../../../modules/simulation/events/points/functions/handleAddEventToProduct"; import { useProductContext } from "../../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../../modules/scene/sceneContext"; import CraneMechanics from "./mechanics/craneMechanics"; const EventProperties: React.FC = () => { const { selectedEventData } = useSelectedEventData(); const { selectedProductStore } = useProductContext(); - const { eventStore, productStore } = useSceneContext(); + const { eventStore, productStore, versionStore } = useSceneContext(); const { selectedProduct } = selectedProductStore(); const [currentEventData, setCurrentEventData] = useState(null); const [assetType, setAssetType] = useState(null); const { products, addEvent, getEventByModelUuid } = productStore(); const { selectedEventSphere } = useSelectedEventSphere(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { projectId } = useParams(); + useEffect(() => { const event = getCurrentEventData(); setCurrentEventData(event); diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/components/ActionsList.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/components/ActionsList.tsx index 4656357..284c29e 100644 --- a/app/src/components/layout/sidebarRight/properties/eventProperties/components/ActionsList.tsx +++ b/app/src/components/layout/sidebarRight/properties/eventProperties/components/ActionsList.tsx @@ -1,166 +1,164 @@ import React, { useRef } from "react"; import { - AddIcon, - RemoveIcon, - ResizeHeightIcon, + AddIcon, + RemoveIcon, + ResizeHeightIcon, } from "../../../../../icons/ExportCommonIcons"; import RenameInput from "../../../../../ui/inputs/RenameInput"; import { handleResize } from "../../../../../../functions/handleResizePannel"; import { - useSelectedAction, + useSelectedAction, } from "../../../../../../store/simulation/useSimulationStore"; import { upsertProductOrEventApi } from "../../../../../../services/simulation/products/UpsertProductOrEventApi"; import { useProductContext } from "../../../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../../../modules/scene/sceneContext"; interface ActionsListProps { - selectedPointData: any; - multipleAction?: boolean; - handleAddAction?: () => void; - handleDeleteAction?: (actionUuid: string) => void; + selectedPointData: any; + multipleAction?: boolean; + handleAddAction?: () => void; + handleDeleteAction?: (actionUuid: string) => void; } const ActionsList: React.FC = ({ - selectedPointData, - multipleAction = false, - handleAddAction, - handleDeleteAction, + selectedPointData, + multipleAction = false, + handleAddAction, + handleDeleteAction, }) => { - const actionsContainerRef = useRef(null); + const actionsContainerRef = useRef(null); - // store + // store - const { productStore } = useSceneContext(); - const { renameAction } = productStore(); - const { selectedProductStore } = useProductContext(); - const { selectedProduct } = selectedProductStore(); - const { selectedAction, setSelectedAction } = useSelectedAction(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); - const { projectId } = useParams(); + const { productStore, versionStore } = useSceneContext(); + const { renameAction } = productStore(); + const { selectedProductStore } = useProductContext(); + const { selectedProduct } = selectedProductStore(); + const { selectedAction, setSelectedAction } = useSelectedAction(); + const { selectedVersion } = versionStore(); + const { projectId } = useParams(); - const handleRenameAction = (newName: string) => { - if (!selectedAction.actionId) return; - const event = renameAction( - selectedProduct.productUuid, - selectedAction.actionId, - newName - ); - setSelectedAction(selectedAction.actionId, newName); - if (event) { - upsertProductOrEventApi({ - productName: selectedProduct.productName, - productUuid: selectedProduct.productUuid, - projectId, - eventDatas: event, - versionId: selectedVersion?.versionId || '', - }); - } - }; + const handleRenameAction = (newName: string) => { + if (!selectedAction.actionId) return; + const event = renameAction( + selectedProduct.productUuid, + selectedAction.actionId, + newName + ); + setSelectedAction(selectedAction.actionId, newName); + if (event) { + upsertProductOrEventApi({ + productName: selectedProduct.productName, + productUuid: selectedProduct.productUuid, + projectId, + eventDatas: event, + versionId: selectedVersion?.versionId || '', + }); + } + }; - const handleActionSelect = (actionUuid: string, actionName: string) => { - setSelectedAction(actionUuid, actionName); - }; + const handleActionSelect = (actionUuid: string, actionName: string) => { + setSelectedAction(actionUuid, actionName); + }; - return ( -
-
-
-
Actions
+ return ( +
+
+
+
Actions
- -
-
-
- {multipleAction && - selectedPointData?.actions?.map((action: any) => ( -
- - {selectedPointData?.actions?.length > 1 && ( - )}
- ))} - {!multipleAction && selectedPointData?.action && ( -
- -
- )} -
- {multipleAction && ( - - )} +
+ {multipleAction && + selectedPointData?.actions?.map((action: any) => ( +
+ + {selectedPointData?.actions?.length > 1 && ( + + )} +
+ ))} + {!multipleAction && selectedPointData?.action && ( +
+ +
+ )} +
+ {multipleAction && ( + + )} +
+
-
-
- ); + ); }; export default ActionsList; diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/conveyorMechanics.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/conveyorMechanics.tsx index 20ce08a..45f9aa1 100644 --- a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/conveyorMechanics.tsx +++ b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/conveyorMechanics.tsx @@ -13,7 +13,6 @@ import ActionsList from "../components/ActionsList"; import { upsertProductOrEventApi } from "../../../../../../services/simulation/products/UpsertProductOrEventApi"; import { useProductContext } from "../../../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../../../modules/scene/sceneContext"; function ConveyorMechanics() { @@ -27,14 +26,13 @@ function ConveyorMechanics() { const [selectedPointData, setSelectedPointData] = useState(); const { selectedEventData } = useSelectedEventData(); - const { productStore } = useSceneContext(); + const { productStore, versionStore } = useSceneContext(); const { getPointByUuid, updateEvent, updateAction, getEventByModelUuid } = productStore(); const { selectedProductStore } = useProductContext(); const { selectedProduct } = selectedProductStore(); const { setSelectedAction, clearSelectedAction } = useSelectedAction(); + const { selectedVersion } = versionStore(); const { projectId } = useParams(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); useEffect(() => { if (selectedEventData) { diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/craneMechanics.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/craneMechanics.tsx index 3df0401..8c667a4 100644 --- a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/craneMechanics.tsx +++ b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/craneMechanics.tsx @@ -8,7 +8,6 @@ import ActionsList from "../components/ActionsList"; import { upsertProductOrEventApi } from "../../../../../../services/simulation/products/UpsertProductOrEventApi"; import { useProductContext } from "../../../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../../../modules/scene/sceneContext"; function CraneMechanics() { @@ -16,13 +15,12 @@ function CraneMechanics() { const [selectedPointData, setSelectedPointData] = useState(); const { selectedEventData } = useSelectedEventData(); - const { productStore } = useSceneContext(); + const { productStore, versionStore } = useSceneContext(); const { getPointByUuid, addAction, removeAction } = productStore(); const { selectedProductStore } = useProductContext(); const { selectedProduct } = selectedProductStore(); const { selectedAction, setSelectedAction, clearSelectedAction } = useSelectedAction(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { projectId } = useParams(); useEffect(() => { diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/humanMechanics.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/humanMechanics.tsx index 99c1a0c..2dc1431 100644 --- a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/humanMechanics.tsx +++ b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/humanMechanics.tsx @@ -12,7 +12,6 @@ import ManufactureAction from "../actions/ManufactureAction"; import { useSelectedEventData, useSelectedAction } from "../../../../../../store/simulation/useSimulationStore"; import { upsertProductOrEventApi } from "../../../../../../services/simulation/products/UpsertProductOrEventApi"; import { useProductContext } from "../../../../../../modules/simulation/products/productContext"; -import { useVersionContext } from "../../../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../../../modules/scene/sceneContext"; import { useParams } from "react-router-dom"; @@ -27,13 +26,12 @@ function HumanMechanics() { const [currentAction, setCurrentAction] = useState(); const [selectedPointData, setSelectedPointData] = useState(); const { selectedEventData } = useSelectedEventData(); - const { productStore } = useSceneContext(); + const { productStore, versionStore } = useSceneContext(); const { getPointByUuid, updateEvent, updateAction, addAction, removeAction, getEventByModelUuid, getActionByUuid } = productStore(); const { selectedProductStore } = useProductContext(); const { selectedProduct } = selectedProductStore(); const { selectedAction, setSelectedAction, clearSelectedAction } = useSelectedAction(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { projectId } = useParams(); useEffect(() => { diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/machineMechanics.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/machineMechanics.tsx index 22b3277..60a8f95 100644 --- a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/machineMechanics.tsx +++ b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/machineMechanics.tsx @@ -8,7 +8,6 @@ import ActionsList from "../components/ActionsList"; import { upsertProductOrEventApi } from "../../../../../../services/simulation/products/UpsertProductOrEventApi"; import { useProductContext } from "../../../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../../../modules/scene/sceneContext"; function MachineMechanics() { @@ -19,13 +18,12 @@ function MachineMechanics() { const [selectedPointData, setSelectedPointData] = useState(); const { selectedEventData } = useSelectedEventData(); - const { productStore } = useSceneContext(); + const { productStore, versionStore } = useSceneContext(); const { getPointByUuid, updateAction } = productStore(); const { selectedProductStore } = useProductContext(); const { selectedProduct } = selectedProductStore(); const { setSelectedAction, clearSelectedAction } = useSelectedAction(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { projectId } = useParams(); useEffect(() => { diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/roboticArmMechanics.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/roboticArmMechanics.tsx index dea6ef5..110af2d 100644 --- a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/roboticArmMechanics.tsx +++ b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/roboticArmMechanics.tsx @@ -10,7 +10,6 @@ import ActionsList from "../components/ActionsList"; import { upsertProductOrEventApi } from "../../../../../../services/simulation/products/UpsertProductOrEventApi"; import { useProductContext } from "../../../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../../../modules/scene/sceneContext"; function RoboticArmMechanics() { @@ -19,13 +18,12 @@ function RoboticArmMechanics() { const [selectedPointData, setSelectedPointData] = useState(); const { selectedEventData } = useSelectedEventData(); - const { productStore } = useSceneContext(); + const { productStore, versionStore } = useSceneContext(); const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction, addAction, removeAction } = productStore(); const { selectedProductStore } = useProductContext(); const { selectedProduct } = selectedProductStore(); const { selectedAction, setSelectedAction, clearSelectedAction } = useSelectedAction(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { projectId } = useParams(); useEffect(() => { diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/storageMechanics.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/storageMechanics.tsx index bf264fb..c0ad4d8 100644 --- a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/storageMechanics.tsx +++ b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/storageMechanics.tsx @@ -9,7 +9,6 @@ import { upsertProductOrEventApi } from "../../../../../../services/simulation/p import { useSelectedAction, useSelectedEventData } from "../../../../../../store/simulation/useSimulationStore"; import { useProductContext } from "../../../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../../../modules/scene/sceneContext"; function StorageMechanics() { @@ -19,13 +18,12 @@ function StorageMechanics() { const [spawnedMaterial, setSpawnedMaterial] = useState("Default material"); const [selectedPointData, setSelectedPointData] = useState(); const { selectedEventData } = useSelectedEventData(); - const { productStore } = useSceneContext(); + const { productStore, versionStore } = useSceneContext(); const { getPointByUuid, updateAction, updateEvent, getEventByModelUuid, getActionByUuid, addAction, removeAction } = productStore(); const { selectedProductStore } = useProductContext(); const { selectedProduct } = selectedProductStore(); const { selectedAction, setSelectedAction, clearSelectedAction } = useSelectedAction(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { projectId } = useParams(); useEffect(() => { diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/vehicleMechanics.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/vehicleMechanics.tsx index 181252b..b10e4b1 100644 --- a/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/vehicleMechanics.tsx +++ b/app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/vehicleMechanics.tsx @@ -9,7 +9,6 @@ import ActionsList from "../components/ActionsList"; import { upsertProductOrEventApi } from "../../../../../../services/simulation/products/UpsertProductOrEventApi"; import { useProductContext } from "../../../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../../../modules/scene/sceneContext"; import { useSelectedPath } from "../../../../../../store/builder/store"; @@ -22,13 +21,12 @@ function VehicleMechanics() { const [selectedPointData, setSelectedPointData] = useState(); const { selectedEventData } = useSelectedEventData(); - const { productStore } = useSceneContext(); + const { productStore, versionStore } = useSceneContext(); const { getPointByUuid, updateEvent, updateAction, getEventByModelUuid } = productStore(); const { selectedProductStore } = useProductContext(); const { selectedProduct } = selectedProductStore(); const { setSelectedAction, clearSelectedAction } = useSelectedAction(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { projectId } = useParams(); const { setSelectedPath } = useSelectedPath(); diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/trigger/Trigger.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/trigger/Trigger.tsx index 23c060c..852baf0 100644 --- a/app/src/components/layout/sidebarRight/properties/eventProperties/trigger/Trigger.tsx +++ b/app/src/components/layout/sidebarRight/properties/eventProperties/trigger/Trigger.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useMemo, useRef, useState } from "react"; +import { useEffect, useMemo, useRef, useState } from "react"; import * as THREE from "three"; import { AddIcon, RemoveIcon, ResizeHeightIcon } from "../../../../../icons/ExportCommonIcons"; import LabledDropdown from "../../../../../ui/inputs/LabledDropdown"; @@ -8,7 +8,6 @@ import { useSelectedAction } from "../../../../../../store/simulation/useSimulat import { upsertProductOrEventApi } from "../../../../../../services/simulation/products/UpsertProductOrEventApi"; import { useProductContext } from "../../../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../../../modules/scene/sceneContext"; type TriggerProps = { @@ -20,15 +19,14 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => { const [currentAction, setCurrentAction] = useState(); const { selectedProductStore } = useProductContext(); const { selectedProduct } = selectedProductStore(); - const { productStore } = useSceneContext(); + const { productStore, versionStore } = useSceneContext(); const { getActionByUuid, getEventByModelUuid, getPointByUuid, getTriggerByUuid, addTrigger, removeTrigger, updateTrigger, renameTrigger, getProductById, } = productStore(); const [triggers, setTriggers] = useState([]); const [selectedTrigger, setSelectedTrigger] = useState(); const [activeOption, setActiveOption] = useState<"onComplete" | "onStart" | "onStop" | "delay" | "onError">("onComplete"); const triggersContainerRef = useRef(null); const { selectedAction } = useSelectedAction(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { projectId } = useParams(); useEffect(() => { diff --git a/app/src/components/layout/sidebarRight/simulation/Simulations.tsx b/app/src/components/layout/sidebarRight/simulation/Simulations.tsx index 9cb118e..f6eb49b 100644 --- a/app/src/components/layout/sidebarRight/simulation/Simulations.tsx +++ b/app/src/components/layout/sidebarRight/simulation/Simulations.tsx @@ -17,7 +17,6 @@ import { useCompareStore, useSaveVersion, } from "../../../../store/builder/stor import { useToggleStore } from "../../../../store/ui/useUIToggleStore"; import { useProductContext } from "../../../../modules/simulation/products/productContext"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../modules/builder/version/versionContext"; import { useSceneContext } from "../../../../modules/scene/sceneContext"; interface Event { @@ -39,7 +38,7 @@ const List: React.FC = ({ val }) => { const Simulations: React.FC = () => { const productsContainerRef = useRef(null); - const { eventStore, productStore } = useSceneContext(); + const { eventStore, productStore, versionStore } = useSceneContext(); const { products, addProduct, removeProduct, renameProduct, addEvent, removeEvent, getProductById, } = productStore(); const { selectedProductStore } = useProductContext(); const { selectedProduct, setSelectedProduct } = selectedProductStore(); @@ -50,8 +49,7 @@ const Simulations: React.FC = () => { const { setToggleUI } = useToggleStore(); const { projectId } = useParams(); const { setMainProduct } = useMainProduct(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const { selectedVersion } = versionStore(); const { comparePopUp, setComparePopUp } = useCompareStore(); const { setIsVersionSaved } = useSaveVersion(); diff --git a/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx b/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx index 38ef321..14e862f 100644 --- a/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx +++ b/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx @@ -1,18 +1,17 @@ -import { AddIcon, ArrowIcon, CloseIcon, KebabIcon, LocationIcon } from "../../../icons/ExportCommonIcons"; -import RenameInput from "../../../ui/inputs/RenameInput"; -import { useVersionHistoryStore } from "../../../../store/builder/useVersionHistoryStore"; -import { useSubModuleStore } from "../../../../store/ui/useModuleStore"; -import useVersionHistoryVisibleStore from "../../../../store/builder/store"; import { useParams } from "react-router-dom"; +import { AddIcon, ArrowIcon, CloseIcon, KebabIcon, LocationIcon } from "../../../icons/ExportCommonIcons"; +import { useSubModuleStore } from "../../../../store/ui/useModuleStore"; +import { useSceneContext } from "../../../../modules/scene/sceneContext"; +import useVersionHistoryVisibleStore from "../../../../store/builder/store"; +import RenameInput from "../../../ui/inputs/RenameInput"; + import { getVersionDataApi } from "../../../../services/factoryBuilder/versionControl/getVersionDataApi"; -import { useVersionContext } from "../../../../modules/builder/version/versionContext"; const VersionHistory = () => { const { setSubModule } = useSubModuleStore(); + const { versionStore } = useSceneContext(); const { setVersionHistoryVisible } = useVersionHistoryVisibleStore(); - const { versionHistory, setCreateNewVersion } = useVersionHistoryStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion, setSelectedVersion } = selectedVersionStore(); + const { versionHistory, setCreateNewVersion, selectedVersion, setSelectedVersion } = versionStore(); const { projectId } = useParams(); const addNewVersion = () => { diff --git a/app/src/components/layout/sidebarRight/versionHisory/VersionSaved.tsx b/app/src/components/layout/sidebarRight/versionHisory/VersionSaved.tsx index d099b6f..a662bf4 100644 --- a/app/src/components/layout/sidebarRight/versionHisory/VersionSaved.tsx +++ b/app/src/components/layout/sidebarRight/versionHisory/VersionSaved.tsx @@ -1,16 +1,15 @@ +import { useParams } from "react-router-dom"; import { useEffect, useState } from "react"; import { FinishEditIcon, RenameVersionIcon } from "../../../icons/ExportCommonIcons"; -import RenderOverlay from "../../../templates/Overlay"; -import { useVersionHistoryStore } from "../../../../store/builder/useVersionHistoryStore"; import { createVersionApi } from "../../../../services/factoryBuilder/versionControl/addVersionApi"; -import { useParams } from "react-router-dom"; +import { useSceneContext } from "../../../../modules/scene/sceneContext"; +import RenderOverlay from "../../../templates/Overlay"; + import { getUserData } from "../../../../functions/getUserData"; -import { useVersionContext } from "../../../../modules/builder/version/versionContext"; const VersionSaved = () => { - const { addVersion, createNewVersion, setCreateNewVersion } = useVersionHistoryStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion, setSelectedVersion } = selectedVersionStore(); + const { versionStore } = useSceneContext(); + const { addVersion, createNewVersion, setCreateNewVersion, selectedVersion, setSelectedVersion } = versionStore(); const [newName, setNewName] = useState(new Date().toLocaleString("en-US", { month: "short", day: "numeric", diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/BarChartInput.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/BarChartInput.tsx index 0b2338e..e413f42 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/BarChartInput.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/BarChartInput.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; @@ -8,187 +8,167 @@ import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { useParams } from "react-router-dom"; -import { useSocketStore } from "../../../../../store/builder/store"; import { getUserData } from "../../../../../functions/getUserData"; import { addingWidgets } from "../../../../../services/visulization/zone/addWidgets"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { getWidgetInputData } from "../../../../../services/visulization/zone/getWidgetInputData"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; type Props = {}; const BarChartInput = (props: Props) => { - const [widgetName, setWidgetName] = useState("Widget"); - const { setMeasurements, updateDuration, updateName } = useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const { selectedChartId } = useWidgetStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { projectId } = useParams(); - const { visualizationSocket } = useSocketStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const [widgetName, setWidgetName] = useState("Widget"); + const { setMeasurements, updateDuration, updateName } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownData, setDropDownData] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const { selectedChartId } = useWidgetStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { projectId } = useParams(); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); - useEffect(() => { - const fetchZoneData = async () => { - try { - setLoading(true); - const response = await axios.get(`http://${iotApiUrl}/floatinput`); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchZoneData = async () => { + try { + setIsLoading(true); + const response = await axios.get(`http://${iotApiUrl}/floatinput`); + if (response.status === 200) { + setDropDownData(response.data); + setIsLoading(false); + } + } catch { + echo.log("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); + + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await getWidgetInputData(selectedChartId.id, selectedZone.zoneUuid, projectId, selectedVersion?.versionId || "") + + if (response) { + setSelections(response.Datastructure.measurements); + setDuration(response.Datastructure.duration); + setWidgetName(response.widgetName); + } + } + }; + fetchSavedInputes(); + }, [selectedChartId]); + + useEffect(() => { + setMeasurements(selections); + updateDuration(duration); + updateName(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async ( + inputMeasurement: any, + inputDuration: any, + inputName: any + ) => { + let newWidget = { + id: selectedChartId.id, + panel: selectedChartId.panel, + widgetName: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + } + } + + let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); + + + if (response.message === "Widget updated successfully") { + return true; } else { + return false; + }; + }; + + const handleSelect = async ( + inputKey: string, + selectedData: { name: string; fields: string } | null + ) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; } - } catch (error) { - echo.log("Failed to fetch zone data"); - - } - }; - fetchZoneData(); - }, []); - - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - let response = await getWidgetInputData(selectedChartId.id, selectedZone.zoneUuid, projectId, selectedVersion?.versionId || "") - - if (response) { - setSelections(response.Datastructure.measurements); - setDuration(response.Datastructure.duration); - setWidgetName(response.widgetName); + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); } - } - }; - fetchSavedInputes(); - }, [selectedChartId]); - - // Sync Zustand state when component mounts - useEffect(() => { - setMeasurements(selections); - updateDuration(duration); - updateName(widgetName); - }, [selections, duration, widgetName]); - - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { - // const userId = localStorage.getItem("userId"); - let newWidget = { - id: selectedChartId.id, - panel: selectedChartId.panel, - widgetName: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - } - } - - let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); - - - if (response.message === "Widget updated successfully") { - return true; - } else { - - return false; }; - }; + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - // sendInputes(newSelections, duration); // Send data to server - // return newSelections; - // }; - }; + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - // setDuration(option); - }; - - const handleNameChange = async (name: any) => { - - - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(3)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- + return ( + <> +
+
+
Title
+
-
+ {[...Array(3)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ + handleSelect(inputKey, selectedData) + } + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })}
- ); - })} -
-
-
-
Duration
-
- -
-
-
- - ); +
+
+
Duration
+
+ +
+
+
+ + ); }; export default BarChartInput; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/FleetEfficiencyInputComponent.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/FleetEfficiencyInputComponent.tsx index 6be8f9a..49cb1bc 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/FleetEfficiencyInputComponent.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/FleetEfficiencyInputComponent.tsx @@ -1,7 +1,6 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; -import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; @@ -10,174 +9,151 @@ import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; import { addingFloatingWidgets } from "../../../../../services/visulization/zone/addFloatingWidgets"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { getFloatingWidgetInput } from "../../../../../services/visulization/zone/getFloatingWidgetInput"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; type Props = {}; const FleetEfficiencyInputComponent = (props: Props) => { - const [widgetName, setWidgetName] = useState("Widget"); - const { setFlotingMeasurements, updateFlotingDuration, updateHeader } = - useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const { selectedChartId } = useWidgetStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); - const { projectId } = useParams() + const [widgetName, setWidgetName] = useState("Widget"); + const { setFlotingMeasurements, updateFlotingDuration, updateHeader } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownData, setDropDownData] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const { selectedChartId } = useWidgetStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); + const { projectId } = useParams() - const isSelected = () => { }; + useEffect(() => { + const fetchZoneData = async () => { + try { + const response = await axios.get(`http://${iotApiUrl}/floatinput`); + setIsLoading(true); + if (response.status === 200) { + setDropDownData(response.data); + setIsLoading(false); + } + } catch { + echo.error("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); - useEffect(() => { - const fetchZoneData = async () => { - try { - const response = await axios.get(`http://${iotApiUrl}/floatinput`); - setLoading(true); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await getFloatingWidgetInput(selectedChartId.id, organization, projectId, selectedVersion?.versionId || "") + + if (response) { + setSelections(response.Data.Datastructure.measurements); + setDuration(response.Data.Datastructure.duration); + setWidgetName(response.Data.header); + } + } + }; + + fetchSavedInputes(); + }, [selectedChartId.id]); + + useEffect(() => { + setFlotingMeasurements(selections); + updateFlotingDuration(duration); + updateHeader(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async ( + inputMeasurement: any, + inputDuration: any, + inputName: any + ) => { + let newWidget = { + id: selectedChartId.id, + header: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + }, + } + + const response = await addingFloatingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || "") + + if (response.message === "Widget updated successfully") { + return true; } else { - // + return false; } - } catch (error) { - echo.error("Failed to fetch zone data"); - - } - }; - fetchZoneData(); - }, []); - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - let response = await getFloatingWidgetInput(selectedChartId.id, organization,projectId,selectedVersion?.versionId||"") - - if (response) { - - setSelections(response.Data.Datastructure.measurements); - setDuration(response.Data.Datastructure.duration); - setWidgetName(response.Data.header); - } - - } }; - fetchSavedInputes(); - }, [selectedChartId.id]); + const handleSelect = async ( + inputKey: string, + selectedData: { name: string; fields: string } | null + ) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; + } + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); + } + }; - // Sync Zustand state when component mounts - useEffect(() => { - setFlotingMeasurements(selections); - updateFlotingDuration(duration); - updateHeader(widgetName); - }, [selections, duration, widgetName]); + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { - let newWidget = { - id: selectedChartId.id, - header: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - }, - } + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - - const response = await addingFloatingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || "") - - if (response.message === "Widget updated successfully") { - return true; - } else { - - return false; - } - - }; - - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - // sendInputes(newSelections, duration); // Send data to server - // return newSelections; - // }; - }; - - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - // setDuration(option); - }; - - const handleNameChange = async (name: any) => { - - - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(1)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- + return ( + <> +
+
+
Title
+
-
+ {[...Array(1)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ + handleSelect(inputKey, selectedData) + } + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })}
- ); - })} -
-
- {/*
+
+ {/*
Duration
{ />
*/} -
- - ); +
+ + ); }; export default FleetEfficiencyInputComponent; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/FlotingWidgetInput.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/FlotingWidgetInput.tsx index d41f998..faafc1c 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/FlotingWidgetInput.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/FlotingWidgetInput.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; @@ -10,185 +10,148 @@ import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; import { addingFloatingWidgets } from "../../../../../services/visulization/zone/addFloatingWidgets"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { getFloatingWidgetInput } from "../../../../../services/visulization/zone/getFloatingWidgetInput"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; type Props = {}; const FlotingWidgetInput = (props: Props) => { - const [widgetName, setWidgetName] = useState("Widget"); - const { setFlotingMeasurements, updateFlotingDuration, updateHeader } = - useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const { selectedChartId } = useWidgetStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { projectId } = useParams() - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const [widgetName, setWidgetName] = useState("Widget"); + const { setFlotingMeasurements, updateFlotingDuration, updateHeader } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownData, setDropDownData] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const { selectedChartId } = useWidgetStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { projectId } = useParams(); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); - useEffect(() => { - const fetchZoneData = async () => { - try { - setLoading(true); - const response = await axios.get(`http://${iotApiUrl}/floatinput`); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchZoneData = async () => { + try { + setIsLoading(true); + const response = await axios.get(`http://${iotApiUrl}/floatinput`); + if (response.status === 200) { + // + setDropDownData(response.data); + setIsLoading(false); + } + } catch { + echo.error("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); + + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await getFloatingWidgetInput(selectedChartId.id, organization, projectId, selectedVersion?.versionId || ""); + + if (response) { + setSelections(response.Data.Datastructure.measurements); + setDuration(response.Data.Datastructure.duration); + setWidgetName(response.Data.header); + } + } + }; + + fetchSavedInputes(); + }, [selectedChartId.id]); + + useEffect(() => { + setFlotingMeasurements(selections); + updateFlotingDuration(duration); + updateHeader(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async (inputMeasurement: any, inputDuration: any, inputName: any) => { + let newWidget = { + id: selectedChartId.id, + header: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + }, + }; + + const response = await addingFloatingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); + + if (response.message === "Widget updated successfully") { + return true; } else { - // + // + return false; } - } catch (error) { - echo.error("Failed to fetch zone data"); - - - } - }; - fetchZoneData(); - }, []); - - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - let response = await getFloatingWidgetInput(selectedChartId.id, organization, projectId, selectedVersion?.versionId || "") - - if (response) { - setSelections(response.Data.Datastructure.measurements); - setDuration(response.Data.Datastructure.duration); - setWidgetName(response.Data.header); - } - - } }; - fetchSavedInputes(); - }, [selectedChartId.id]); + const handleSelect = async (inputKey: string, selectedData: { name: string; fields: string } | null) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; + } + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); + } + }; - // Sync Zustand state when component mounts - useEffect(() => { - setFlotingMeasurements(selections); - updateFlotingDuration(duration); - updateHeader(widgetName); - }, [selections, duration, widgetName]); + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { - let newWidget = { - id: selectedChartId.id, - header: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - }, - } + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - - const response = await addingFloatingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || "") - - if (response.message === "Widget updated successfully") { - return true; - } else { - // - return false; - } - - }; - - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - // sendInputes(newSelections, duration); // Send data to server - // return newSelections; - // }; - }; - - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - // setDuration(option); - }; - - const handleNameChange = async (name: any) => { - - - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(6)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- + return ( + <> +
+
+
Title
+
-
+ {[...Array(6)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ handleSelect(inputKey, selectedData)} + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })}
- ); - })} -
-
-
-
Duration
-
- -
-
-
- - ); +
+
+
Duration
+
+ +
+
+
+ + ); }; export default FlotingWidgetInput; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/LineGrapInput.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/LineGrapInput.tsx index 93a9908..1ba3abb 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/LineGrapInput.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/LineGrapInput.tsx @@ -1,120 +1,4 @@ -// import React, { useEffect, useState } from 'react' -// import MultiLevelDropdown from '../../../../ui/inputs/MultiLevelDropDown' -// import { AddIcon } from '../../../../icons/ExportCommonIcons' -// import RegularDropDown from '../../../../ui/inputs/RegularDropDown' -// import useChartStore from '../../../../../store/useChartStore' -// import axios from 'axios' - -// type Props = {} - -// const LineGrapInput = (props: Props) => { -// const [dropDowndata, setDropDownData] = useState({}) -// const [selections, setSelections] = useState>({}) -// const [selectedOption, setSelectedOption] = useState('1h') -// const { measurements, setMeasurements, updateDuration, duration } = useChartStore(); -// const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - -// const handleSelectDuration = (option: string) => { -// updateDuration(option); // Normalize for key matching -// }; - -// useEffect(() => { -// const fetchZoneData = async () => { -// try { -// const response = await axios.get(`http://${iotApiUrl}/getinput`); -// if (response.status === 200) { -// -// setDropDownData(response.data) -// } else { -// -// } -// } catch (error) { -// -// } -// }; -// fetchZoneData(); -// }, []); - -// useEffect(() => { -// -// }, [selections]) - -// const handleSelect = (inputKey: string, selectedData: { name: string, fields: string } | null) => { -// setSelections(prev => { -// if (selectedData === null) { -// const newSelections = { ...prev }; -// delete newSelections[inputKey]; -// return newSelections; -// } else { -// return { -// ...prev, -// [inputKey]: selectedData -// }; -// } -// }); -// }; - -// interface Measurement { -// name: string; -// fields: string; -// } - -// interface InputData { -// [key: string]: Measurement; -// } - -// const extractMeasurements = (input: InputData): Measurement[] => { -// return Object.values(input); -// }; - -// useEffect(() => { -// const measurementsData = extractMeasurements(selections); -// setMeasurements(measurementsData); -// }, [selections]); - -// return ( -// <> -//
-// {[...Array(6)].map((_, index) => { -// const inputKey = `input${index + 1}`; -// return ( -//
-//
Input {index + 1}
-//
-// handleSelect(inputKey, selectedData)} -// onUnselect={() => handleSelect(inputKey, null)} -// selectedValue={selections[inputKey]} -// /> -//
-// -//
-//
-//
-// ); -// })} -//
-//
-//
-//
duration
-//
-// -//
-//
-//
-// -// ) -// } - -// export default LineGrapInput - -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; @@ -124,190 +8,168 @@ import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { useParams } from "react-router-dom"; -import { useSocketStore } from "../../../../../store/builder/store"; import { getUserData } from "../../../../../functions/getUserData"; import { addingWidgets } from "../../../../../services/visulization/zone/addWidgets"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { getWidgetInputData } from "../../../../../services/visulization/zone/getWidgetInputData"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; type Props = {}; const LineGrapInput = (props: Props) => { - const [widgetName, setWidgetName] = useState("Widget"); - const { setMeasurements, updateDuration, updateName } = useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const { selectedChartId } = useWidgetStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { projectId } = useParams(); - const { visualizationSocket } = useSocketStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const [widgetName, setWidgetName] = useState("Widget"); + const { setMeasurements, updateDuration, updateName } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownData, setDropDownData] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const { selectedChartId } = useWidgetStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { projectId } = useParams(); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); - useEffect(() => { - const fetchZoneData = async () => { - try { - setLoading(true); - const response = await axios.get(`http://${iotApiUrl}/floatinput`); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchZoneData = async () => { + try { + setIsLoading(true); + const response = await axios.get(`http://${iotApiUrl}/floatinput`); + if (response.status === 200) { + setDropDownData(response.data); + setIsLoading(false); + } + } catch { + echo.error("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); + + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await getWidgetInputData(selectedChartId.id, selectedZone.zoneUuid, projectId, selectedVersion?.versionId || "") + + if (response) { + setSelections(response.Datastructure.measurements); + setDuration(response.Datastructure.duration); + setWidgetName(response.widgetName); + } + } + }; + + fetchSavedInputes(); + }, [selectedChartId.id]); + + useEffect(() => { + setMeasurements(selections); + updateDuration(duration); + updateName(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async ( + inputMeasurement: any, + inputDuration: any, + inputName: any + ) => { + let newWidget = { + id: selectedChartId.id, + panel: selectedChartId.panel, + widgetName: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + } + } + + let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); + + if (response.message === "Widget updated successfully") { + + return true; } else { + return false; } - } catch (error) { - echo.error("Failed to fetch zone data"); - - } - }; - fetchZoneData(); - }, []); - - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - let response = await getWidgetInputData(selectedChartId.id, selectedZone.zoneUuid, projectId, selectedVersion?.versionId || "") - - if (response) { - setSelections(response.Datastructure.measurements); - setDuration(response.Datastructure.duration); - setWidgetName(response.widgetName); - } - - } }; - fetchSavedInputes(); - }, [selectedChartId.id]); + const handleSelect = async ( + inputKey: string, + selectedData: { name: string; fields: string } | null + ) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; + } + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); + } + }; - // Sync Zustand state when component mounts - useEffect(() => { - setMeasurements(selections); - updateDuration(duration); - updateName(widgetName); - }, [selections, duration, widgetName]); + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { - // const userId = localStorage.getItem("userId"); - let newWidget = { - id: selectedChartId.id, - panel: selectedChartId.panel, - widgetName: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - } - } + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - - let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); - - if (response.message === "Widget updated successfully") { - - return true; - } else { - - return false; - } - - }; - - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - // sendInputes(newSelections, duration); // Send data to server - // return newSelections; - // }; - }; - - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - // setDuration(option); - }; - - const handleNameChange = async (name: any) => { - - - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(4)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- + return ( + <> +
+
+
Title
+
-
+ {[...Array(4)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ + handleSelect(inputKey, selectedData) + } + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })}
- ); - })} -
-
-
-
Duration
-
- -
-
-
- - ); +
+
+
Duration
+
+ +
+
+
+ + ); }; export default LineGrapInput; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/PieChartInput.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/PieChartInput.tsx index 106ca5c..1e9c0de 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/PieChartInput.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/PieChartInput.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; @@ -8,192 +8,166 @@ import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { useParams } from "react-router-dom"; -import { useSocketStore } from "../../../../../store/builder/store"; import { getUserData } from "../../../../../functions/getUserData"; import { addingWidgets } from "../../../../../services/visulization/zone/addWidgets"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { getWidgetInputData } from "../../../../../services/visulization/zone/getWidgetInputData"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; type Props = {}; const PieChartInput = (props: Props) => { - const [widgetName, setWidgetName] = useState("Widget"); - const { setMeasurements, updateDuration, updateName } = useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const { selectedChartId } = useWidgetStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { projectId } = useParams(); - const { visualizationSocket } = useSocketStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const [widgetName, setWidgetName] = useState("Widget"); + const { setMeasurements, updateDuration, updateName } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownData, setDropDownData] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const { selectedChartId } = useWidgetStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { projectId } = useParams(); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); - useEffect(() => { - const fetchZoneData = async () => { - try { - setLoading(true); - const response = await axios.get(`http://${iotApiUrl}/floatinput`); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchZoneData = async () => { + try { + setIsLoading(true); + const response = await axios.get(`http://${iotApiUrl}/floatinput`); + if (response.status === 200) { + setDropDownData(response.data); + setIsLoading(false); + } + } catch { + echo.error("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); + + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await getWidgetInputData(selectedChartId.id, selectedZone.zoneUuid, projectId, selectedVersion?.versionId || "") + + if (response) { + setSelections(response.Datastructure.measurements); + setDuration(response.Datastructure.duration); + setWidgetName(response.widgetName); + } + } + }; + + fetchSavedInputes(); + }, [selectedChartId.id]); + + useEffect(() => { + setMeasurements(selections); + updateDuration(duration); + updateName(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async ( + inputMeasurement: any, + inputDuration: any, + inputName: any + ) => { + let newWidget = { + id: selectedChartId.id, + panel: selectedChartId.panel, + widgetName: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + }, + } + + let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); + + if (response.message === "Widget updated successfully") { + return true; } else { - + return false; } - } catch (error) { - echo.error("Failed to fetch zone data"); - - } - }; - fetchZoneData(); - }, []); - - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - let response = await getWidgetInputData(selectedChartId.id, selectedZone.zoneUuid, projectId, selectedVersion?.versionId || "") - - if (response) { - setSelections(response.Datastructure.measurements); - setDuration(response.Datastructure.duration); - setWidgetName(response.widgetName); - } - - } }; - fetchSavedInputes(); - }, [selectedChartId.id]); + const handleSelect = async ( + inputKey: string, + selectedData: { name: string; fields: string } | null + ) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; + } + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); + } + }; - // Sync Zustand state when component mounts - useEffect(() => { - setMeasurements(selections); - updateDuration(duration); - updateName(widgetName); - }, [selections, duration, widgetName]); + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - // const userId = localStorage.getItem("userId"); - let newWidget = { - id: selectedChartId.id, - panel: selectedChartId.panel, - widgetName: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - }, - } - - - let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); - - if (response.message === "Widget updated successfully") { - - return true; - } else { - - - return false; - } - - }; - - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - // sendInputes(newSelections, duration); // Send data to server - // return newSelections; - // }; - }; - - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - // setDuration(option); - }; - - const handleNameChange = async (name: any) => { - - - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(2)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- + return ( + <> +
+
+
Title
+
-
+ {[...Array(2)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ + handleSelect(inputKey, selectedData) + } + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })}
- ); - })} -
-
-
-
Duration
-
- -
-
-
- - ); +
+
+
Duration
+
+ +
+
+
+ + ); }; export default PieChartInput; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress1Input.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress1Input.tsx index c4be0ba..b6c6fba 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress1Input.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress1Input.tsx @@ -1,177 +1,157 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; -import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { useParams } from "react-router-dom"; -import { useSocketStore } from "../../../../../store/builder/store"; import { getUserData } from "../../../../../functions/getUserData"; import { addingWidgets } from "../../../../../services/visulization/zone/addWidgets"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { getWidgetInputData } from "../../../../../services/visulization/zone/getWidgetInputData"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; type Props = {}; const Progress1Input = (props: Props) => { - const [widgetName, setWidgetName] = useState("Widget"); - const { setMeasurements, updateDuration, updateName } = useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const { selectedChartId } = useWidgetStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { projectId } = useParams(); - const { visualizationSocket } = useSocketStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const [widgetName, setWidgetName] = useState("Widget"); + const { setMeasurements, updateDuration, updateName } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownData, setDropDownData] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const { selectedChartId } = useWidgetStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { projectId } = useParams(); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); - useEffect(() => { - const fetchZoneData = async () => { - try { - setLoading(true); - const response = await axios.get(`http://${iotApiUrl}/floatinput`); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchZoneData = async () => { + try { + setIsLoading(true); + const response = await axios.get(`http://${iotApiUrl}/floatinput`); + if (response.status === 200) { + setDropDownData(response.data); + setIsLoading(false); + } + } catch { + echo.error("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); + + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await getWidgetInputData(selectedChartId.id, selectedZone.zoneUuid, projectId, selectedVersion?.versionId || "") + if (response) { + setSelections(response.Datastructure.measurements); + setDuration(response.Datastructure.duration); + setWidgetName(response.widgetName); + } + } + }; + + fetchSavedInputes(); + }, [selectedChartId.id]); + + useEffect(() => { + setMeasurements(selections); + updateDuration(duration); + updateName(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async ( + inputMeasurement: any, + inputDuration: any, + inputName: any + ) => { + let newWidget = { + id: selectedChartId.id, + panel: selectedChartId.panel, + widgetName: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + }, + } + + let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); + + if (response.message === "Widget updated successfully") { + return true; } else { - + return false; } - } catch (error) { - echo.error("Failed to fetch zone data"); - - } - }; - fetchZoneData(); - }, []); - - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - let response = await getWidgetInputData(selectedChartId.id, selectedZone.zoneUuid, projectId, selectedVersion?.versionId || "") - - if (response) { - setSelections(response.Datastructure.measurements); - setDuration(response.Datastructure.duration); - setWidgetName(response.widgetName); - } - - } }; - fetchSavedInputes(); - }, [selectedChartId.id]); + const handleSelect = async ( + inputKey: string, + selectedData: { name: string; fields: string } | null + ) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; + } + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); + } + }; - // Sync Zustand state when component mounts - useEffect(() => { - setMeasurements(selections); - updateDuration(duration); - updateName(widgetName); - }, [selections, duration, widgetName]); + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { - // const userId = localStorage.getItem("userId"); - let newWidget = { - id: selectedChartId.id, - panel: selectedChartId.panel, - widgetName: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - }, - } + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); - - if (response.message === "Widget updated successfully") { - - return true; - } else { - - - return false; - } - - }; - - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - }; - - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - }; - - const handleNameChange = async (name: any) => { - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(1)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- + return ( + <> +
+
+
Title
+
-
+ {[...Array(1)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ + handleSelect(inputKey, selectedData) + } + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })}
- ); - })} -
- {/*
+ {/*
Duration
@@ -184,8 +164,8 @@ const Progress1Input = (props: Props) => {
*/} - - ); + + ); }; export default Progress1Input; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress2Input.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress2Input.tsx index 32f5ebe..24576fd 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress2Input.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Progress2Input.tsx @@ -1,177 +1,157 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; -import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { useParams } from "react-router-dom"; -import { useSocketStore } from "../../../../../store/builder/store"; import { getUserData } from "../../../../../functions/getUserData"; import { addingWidgets } from "../../../../../services/visulization/zone/addWidgets"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { getWidgetInputData } from "../../../../../services/visulization/zone/getWidgetInputData"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; type Props = {}; const Progress2Input = (props: Props) => { - const [widgetName, setWidgetName] = useState("Widget"); - const { setMeasurements, updateDuration, updateName } = useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const { selectedChartId } = useWidgetStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { projectId } = useParams(); - const { visualizationSocket } = useSocketStore(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const [widgetName, setWidgetName] = useState("Widget"); + const { setMeasurements, updateDuration, updateName } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownData, setDropDownData] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const { selectedChartId } = useWidgetStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { projectId } = useParams(); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); - useEffect(() => { - const fetchZoneData = async () => { - try { - setLoading(true); - const response = await axios.get(`http://${iotApiUrl}/floatinput`); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchZoneData = async () => { + try { + setIsLoading(true); + const response = await axios.get(`http://${iotApiUrl}/floatinput`); + if (response.status === 200) { + setDropDownData(response.data); + setIsLoading(false); + } + } catch { + echo.error("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); + + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await getWidgetInputData(selectedChartId.id, selectedZone.zoneUuid, projectId, selectedVersion?.versionId || "") + if (response) { + setSelections(response.Datastructure.measurements); + setDuration(response.Datastructure.duration); + setWidgetName(response.widgetName); + } + } + }; + + fetchSavedInputes(); + }, [selectedChartId.id]); + + useEffect(() => { + setMeasurements(selections); + updateDuration(duration); + updateName(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async ( + inputMeasurement: any, + inputDuration: any, + inputName: any + ) => { + let newWidget = { + id: selectedChartId.id, + panel: selectedChartId.panel, + widgetName: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + } + } + + let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); + + if (response.message === "Widget updated successfully") { + return true; } else { - + return false; } - } catch (error) { - echo.error("Failed to fetch zone data"); - - } - }; - fetchZoneData(); - }, []); - - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - let response = await getWidgetInputData(selectedChartId.id, selectedZone.zoneUuid, projectId, selectedVersion?.versionId || "") - - if (response) { - setSelections(response.Datastructure.measurements); - setDuration(response.Datastructure.duration); - setWidgetName(response.widgetName); - } - - } }; - fetchSavedInputes(); - }, [selectedChartId.id]); + const handleSelect = async ( + inputKey: string, + selectedData: { name: string; fields: string } | null + ) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; + } + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); + } + }; - // Sync Zustand state when component mounts - useEffect(() => { - setMeasurements(selections); - updateDuration(duration); - updateName(widgetName); - }, [selections, duration, widgetName]); + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { - // const userId = localStorage.getItem("userId"); - let newWidget = { - id: selectedChartId.id, - panel: selectedChartId.panel, - widgetName: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - } - } + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - let response = await addingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); - - if (response.message === "Widget updated successfully") { - - return true; - } else { - - - return false; - } - - }; - - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - }; - - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - }; - - const handleNameChange = async (name: any) => { - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(2)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- + return ( + <> +
+
+
Title
+
-
+ {[...Array(2)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ + handleSelect(inputKey, selectedData) + } + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })}
- ); - })} -
- {/*
+ {/*
Duration
@@ -184,8 +164,8 @@ const Progress2Input = (props: Props) => {
*/} - - ); + + ); }; export default Progress2Input; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/WarehouseThroughputInputComponent.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/WarehouseThroughputInputComponent.tsx index 69801df..d360d04 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/WarehouseThroughputInputComponent.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/WarehouseThroughputInputComponent.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; @@ -10,184 +10,165 @@ import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; import { addingFloatingWidgets } from "../../../../../services/visulization/zone/addFloatingWidgets"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { getFloatingWidgetInput } from "../../../../../services/visulization/zone/getFloatingWidgetInput"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; type Props = {}; const WarehouseThroughputInputComponent = (props: Props) => { - const [widgetName, setWidgetName] = useState("Widget"); - const { setFlotingMeasurements, updateFlotingDuration, updateHeader } = - useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const { selectedChartId } = useWidgetStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { projectId } = useParams(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const [widgetName, setWidgetName] = useState("Widget"); + const { setFlotingMeasurements, updateFlotingDuration, updateHeader } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownData, setDropDownData] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const { selectedChartId } = useWidgetStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { projectId } = useParams(); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); - useEffect(() => { - const fetchZoneData = async () => { - try { - setLoading(true); - const response = await axios.get(`http://${iotApiUrl}/floatinput`); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchZoneData = async () => { + try { + setIsLoading(true); + const response = await axios.get(`http://${iotApiUrl}/floatinput`); + if (response.status === 200) { + setDropDownData(response.data); + setIsLoading(false); + } + } catch { + echo.error("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); + + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await getFloatingWidgetInput(selectedChartId.id, organization, projectId, selectedVersion?.versionId || "") + + if (response) { + setSelections(response.Data.Datastructure.measurements); + setDuration(response.Data.Datastructure.duration); + setWidgetName(response.Data.header); + } + } + }; + + fetchSavedInputes(); + }, [selectedChartId.id]); + + useEffect(() => { + setFlotingMeasurements(selections); + updateFlotingDuration(duration); + updateHeader(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async ( + inputMeasurement: any, + inputDuration: any, + inputName: any + ) => { + + let newWidget = { + id: selectedChartId.id, + header: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + }, + } + + const response = await addingFloatingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || "") + + if (response.message === "Widget updated successfully") { + return true; } else { - // + return false; } - } catch (error) { - echo.error("Failed to fetch zone data"); - - } - }; - fetchZoneData(); - }, []); - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - let response = await getFloatingWidgetInput(selectedChartId.id, organization,projectId,selectedVersion?.versionId||"") - - if (response) { - setSelections(response.Data.Datastructure.measurements); - setDuration(response.Data.Datastructure.duration); - setWidgetName(response.Data.header); - } - - } }; - fetchSavedInputes(); - }, [selectedChartId.id]); + const handleSelect = async ( + inputKey: string, + selectedData: { name: string; fields: string } | null + ) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; + } + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); + } + }; - // Sync Zustand state when component mounts - useEffect(() => { - setFlotingMeasurements(selections); - updateFlotingDuration(duration); - updateHeader(widgetName); - }, [selections, duration, widgetName]); + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - let newWidget = { - id: selectedChartId.id, - header: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - }, - } - - const response = await addingFloatingWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || "") - // - if (response.message === "Widget updated successfully") { - return true; - } else { - // - return false; - } - - }; - - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - // sendInputes(newSelections, duration); // Send data to server - // return newSelections; - // }; - }; - - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - // setDuration(option); - }; - - const handleNameChange = async (name: any) => { - // - - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(1)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- + return ( + <> +
+
+
Title
+
-
+ {[...Array(1)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ + handleSelect(inputKey, selectedData) + } + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })}
- ); - })} -
-
-
-
Duration
-
- -
-
-
- - ); +
+
+
Duration
+
+ +
+
+
+ + ); }; export default WarehouseThroughputInputComponent; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget2InputCard3D.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget2InputCard3D.tsx index d360122..868df41 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget2InputCard3D.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget2InputCard3D.tsx @@ -1,7 +1,6 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; -import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; @@ -10,203 +9,136 @@ import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; import { get3dWidgetInput } from "../../../../../services/visulization/zone/get3dWidgetInput"; import { adding3dWidgets } from "../../../../../services/visulization/zone/add3dWidget"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { useParams } from "react-router-dom"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; type Props = {}; const Widget2InputCard3D = (props: Props) => { - const { selectedChartId } = useWidgetStore(); - const [widgetName, setWidgetName] = useState("untited"); - const { setMeasurements, updateDuration, updateName } = useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); - const { projectId } = useParams() + const { selectedChartId } = useWidgetStore(); + const [widgetName, setWidgetName] = useState("untited"); + const { setMeasurements, updateDuration, updateName } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownData, setDropDownData] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); + const { projectId } = useParams(); - useEffect(() => { - const fetchZoneData = async () => { - try { - setLoading(true); - const response = await axios.get(`http://${iotApiUrl}/floatinput`); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchZoneData = async () => { + try { + setIsLoading(true); + const response = await axios.get(`http://${iotApiUrl}/floatinput`); + if (response.status === 200) { + setDropDownData(response.data); + setIsLoading(false); + } + } catch { + echo.error("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); + + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await get3dWidgetInput(selectedChartId.id, organization, projectId, selectedVersion?.versionId || ""); + + if (response) { + setSelections(response.Datastructure.measurements); + setDuration(response.Datastructure.duration); + setWidgetName(response.widgetName); + } + } + }; + + fetchSavedInputes(); + }, [selectedChartId.id]); + + useEffect(() => { + setMeasurements(selections); + updateDuration(duration); + updateName(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async (inputMeasurement: any, inputDuration: any, inputName: any) => { + let newWidget = { + id: selectedChartId.id, + widgetName: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + }, + }; + + let response = await adding3dWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); + + if (response.message === "widget update successfully") { + return true; } else { - // + return false; } - } catch (error) { - echo.error("Failed to fetch zone data"); - - } - }; - fetchZoneData(); - }, []); - - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - let response = await get3dWidgetInput(selectedChartId.id, organization, projectId, selectedVersion?.versionId || "") - - if (response) { - setSelections(response.Datastructure.measurements); - setDuration(response.Datastructure.duration); - setWidgetName(response.widgetName); - } - - } }; - fetchSavedInputes(); - }, [selectedChartId.id]); + const handleSelect = async (inputKey: string, selectedData: { name: string; fields: string } | null) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; + } + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); + } + }; - // Sync Zustand state when component mounts - useEffect(() => { - setMeasurements(selections); - updateDuration(duration); - updateName(widgetName); - }, [selections, duration, widgetName]); + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { - let newWidget = { - id: selectedChartId.id, - widgetName: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - }, - } + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - let response = await adding3dWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || "") - - if (response.message === "widget update successfully") { - return true; - } else { - return false - } - // try { - // const response = await axios.post( - // `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget3d/save`, - // { - // headers: { - // Authorization: "Bearer ", - // "Content-Type": "application/json", - // token: localStorage.getItem("token") || "", - // refresh_token: localStorage.getItem("refreshToken") || "", - // }, - // }, - // { - // organization, - // zoneUuid: selectedZone.zoneUuid, - // widget: { - // id: selectedChartId.id, - // widgetName: inputName, - // Data: { - // measurements: inputMeasurement, - // duration: inputDuration, - // }, - // }, - // projectId: projectId, - // versionId: selectedVersion?.versionId || "" - // } as any, - - // ); - // - // if (response.status === 200) { - // return true; - // } else { - // // - // return false; - // } - // } catch (error) { - // echo.error("Failed to send input"); - // - // return false; - // } - }; - - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - // sendInputes(newSelections, duration); // Send data to server - // return newSelections; - // }; - }; - - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - // setDuration(option); - }; - - const handleNameChange = async (name: any) => { - // - - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(2)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- -
-
+ return ( +
+
+
Title
+
- ); - })} -
- - ); + {[...Array(2)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ handleSelect(inputKey, selectedData)} + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })} +
+ ); }; export default Widget2InputCard3D; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget3InputCard3D.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget3InputCard3D.tsx index ad91d4d..33dac38 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget3InputCard3D.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget3InputCard3D.tsx @@ -1,7 +1,6 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; -import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; import useChartStore from "../../../../../store/visualization/useChartStore"; import { useSelectedZoneStore } from "../../../../../store/visualization/useZoneStore"; import { useWidgetStore } from "../../../../../store/ui/useWidgetStore"; @@ -9,198 +8,135 @@ import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; import { get3dWidgetInput } from "../../../../../services/visulization/zone/get3dWidgetInput"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { useParams } from "react-router-dom"; import { adding3dWidgets } from "../../../../../services/visulization/zone/add3dWidget"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; const Widget3InputCard3D = () => { - const { selectedChartId } = useWidgetStore(); - const [widgetName, setWidgetName] = useState("untited"); - const { setMeasurements, updateDuration, updateName } = useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); - const { projectId } = useParams() + const { selectedChartId } = useWidgetStore(); + const [widgetName, setWidgetName] = useState("untited"); + const { setMeasurements, updateDuration, updateName } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownData, setDropDownData] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); + const { projectId } = useParams(); - useEffect(() => { - const fetchZoneData = async () => { - try { - setLoading(true); - const response = await axios.get(`http://${iotApiUrl}/getinput`); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchZoneData = async () => { + try { + setIsLoading(true); + const response = await axios.get(`http://${iotApiUrl}/getinput`); + if (response.status === 200) { + setDropDownData(response.data); + setIsLoading(false); + } + } catch { + echo.error("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); + + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await get3dWidgetInput(selectedChartId.id, organization, projectId, selectedVersion?.versionId || ""); + + if (response) { + setSelections(response.Datastructure.measurements); + setDuration(response.Datastructure.duration); + setWidgetName(response.widgetName); + } + } + }; + + fetchSavedInputes(); + }, [selectedChartId.id]); + + useEffect(() => { + setMeasurements(selections); + updateDuration(duration); + updateName(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async (inputMeasurement: any, inputDuration: any, inputName: any) => { + let newWidget = { + id: selectedChartId.id, + widgetName: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + }, + }; + + let response = await adding3dWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); + + if (response.message === "widget update successfully") { + return true; } else { - // + return false; } - } catch (error) { - echo.error("Failed to fetch zone data"); - - } - }; - fetchZoneData(); - }, []); - - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - let response = await get3dWidgetInput(selectedChartId.id, organization, projectId, selectedVersion?.versionId || "") - - if (response) { - setSelections(response.Datastructure.measurements); - setDuration(response.Datastructure.duration); - setWidgetName(response.widgetName); - } - - } }; - fetchSavedInputes(); - }, [selectedChartId.id]); + const handleSelect = async (inputKey: string, selectedData: { name: string; fields: string } | null) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; + } + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); + } + }; - useEffect(() => { - setMeasurements(selections); - updateDuration(duration); - updateName(widgetName); - }, [selections, duration, widgetName]); + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - let newWidget = { - id: selectedChartId.id, - widgetName: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - }, - } - - let response = await adding3dWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || "") - - if (response.message === "widget update successfully") { - return true; - } else { - return false - } - - // try { - // const response = await axios.post( - // `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget3d/save`, - // { - // headers: { - // Authorization: "Bearer ", - // "Content-Type": "application/json", - // token: localStorage.getItem("token") || "", - // refresh_token: localStorage.getItem("refreshToken") || "", - // }, - // }, - // { - // organization, - // zoneUuid: selectedZone.zoneUuid, - // widget: { - // id: selectedChartId.id, - // widgetName: inputName, - // Data: { - // measurements: inputMeasurement, - // duration: inputDuration, - // }, - // }, - // projectId: projectId, - // versionId: selectedVersion?.versionId || "" - // } as any - // ); - // - // if (response.status === 200) { - // return true; - // } else { - // // - // return false; - // } - // } catch (error) { - // echo.error("Failed to send input"); - // - // return false; - // } - }; - - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - }; - - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - }; - - const handleNameChange = async (name: any) => { - // - - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(7)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- -
-
+ return ( +
+
+
Title
+
- ); - })} -
- - ); + {[...Array(7)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ handleSelect(inputKey, selectedData)} + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })} +
+ ); }; export default Widget3InputCard3D; diff --git a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget4InputCard3D.tsx b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget4InputCard3D.tsx index 9bdeb5e..f83aa38 100644 --- a/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget4InputCard3D.tsx +++ b/app/src/components/layout/sidebarRight/visualization/IotInputCards/Widget4InputCard3D.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import MultiLevelDropdown from "../../../../ui/inputs/MultiLevelDropDown"; import { AddIcon } from "../../../../icons/ExportCommonIcons"; import RegularDropDown from "../../../../ui/inputs/RegularDropDown"; @@ -9,220 +9,147 @@ import axios from "axios"; import RenameInput from "../../../../ui/inputs/RenameInput"; import { getUserData } from "../../../../../functions/getUserData"; import { get3dWidgetInput } from "../../../../../services/visulization/zone/get3dWidgetInput"; -import { useVersionContext } from "../../../../../modules/builder/version/versionContext"; import { useParams } from "react-router-dom"; import { adding3dWidgets } from "../../../../../services/visulization/zone/add3dWidget"; +import { useSceneContext } from "../../../../../modules/scene/sceneContext"; type Props = {}; const Widget4InputCard3D = (props: Props) => { - const { selectedChartId } = useWidgetStore(); - const [widgetName, setWidgetName] = useState("untited"); - const { setMeasurements, updateDuration, updateName } = useChartStore(); - const [duration, setDuration] = useState("1h"); - const [dropDowndata, setDropDownData] = useState({}); - const [selections, setSelections] = useState< - Record - >({}); - const { selectedZone } = useSelectedZoneStore(); - const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; - const { userName, userId, organization, email } = getUserData(); - const [isLoading, setLoading] = useState(true); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); - const { projectId } = useParams() + const { selectedChartId } = useWidgetStore(); + const [widgetName, setWidgetName] = useState("untited"); + const { setMeasurements, updateDuration, updateName } = useChartStore(); + const [duration, setDuration] = useState("1h"); + const [dropDownSata, setDropDownSata] = useState({}); + const [selections, setSelections] = useState>({}); + const { selectedZone } = useSelectedZoneStore(); + const iotApiUrl = process.env.REACT_APP_IOT_SOCKET_SERVER_URL; + const { organization } = getUserData(); + const [isLoading, setIsLoading] = useState(true); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); + const { projectId } = useParams(); - useEffect(() => { - const fetchZoneData = async () => { - try { - setLoading(true); - const response = await axios.get(`http://${iotApiUrl}/floatinput`); - if (response.status === 200) { - // - setDropDownData(response.data); - setLoading(false); + useEffect(() => { + const fetchZoneData = async () => { + try { + setIsLoading(true); + const response = await axios.get(`http://${iotApiUrl}/floatinput`); + if (response.status === 200) { + setDropDownSata(response.data); + setIsLoading(false); + } + } catch { + echo.error("Failed to fetch zone data"); + } + }; + fetchZoneData(); + }, []); + + useEffect(() => { + const fetchSavedInputes = async () => { + if (selectedChartId.id !== "") { + let response = await get3dWidgetInput(selectedChartId.id, organization, projectId, selectedVersion?.versionId || ""); + + if (response) { + setSelections(response.Datastructure.measurements); + setDuration(response.Datastructure.duration); + setWidgetName(response.widgetName); + } + } + }; + + fetchSavedInputes(); + }, [selectedChartId.id]); + + useEffect(() => { + setMeasurements(selections); + updateDuration(duration); + updateName(widgetName); + }, [selections, duration, widgetName]); + + const sendInputes = async (inputMeasurement: any, inputDuration: any, inputName: any) => { + let newWidget = { + id: selectedChartId.id, + widgetName: inputName, + Data: { + measurements: inputMeasurement, + duration: inputDuration, + }, + }; + + let response = await adding3dWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || ""); + + if (response.message === "widget update successfully") { + return true; } else { - // + return false; } - } catch (error) { - echo.error("Failed to fetch zone data"); - - } - }; - fetchZoneData(); - }, []); - - useEffect(() => { - const fetchSavedInputes = async () => { - if (selectedChartId.id !== "") { - - - - let response = await get3dWidgetInput(selectedChartId.id, organization, projectId, selectedVersion?.versionId || "") - - if (response) { - setSelections(response.Datastructure.measurements); - setDuration(response.Datastructure.duration); - setWidgetName(response.widgetName); - } - - } }; - fetchSavedInputes(); - }, [selectedChartId.id]); + const handleSelect = async (inputKey: string, selectedData: { name: string; fields: string } | null) => { + const newSelections = { ...selections }; + if (selectedData === null) { + delete newSelections[inputKey]; + } else { + newSelections[inputKey] = selectedData; + } + if (await sendInputes(newSelections, duration, widgetName)) { + setSelections(newSelections); + } + }; - // Sync Zustand state when component mounts - useEffect(() => { - setMeasurements(selections); - updateDuration(duration); - updateName(widgetName); - }, [selections, duration, widgetName]); + const handleSelectDuration = async (option: string) => { + if (await sendInputes(selections, option, widgetName)) { + setDuration(option); + } + }; - const sendInputes = async ( - inputMeasurement: any, - inputDuration: any, - inputName: any - ) => { - let newWidget = { - id: selectedChartId.id, - widgetName: inputName, - Data: { - measurements: inputMeasurement, - duration: inputDuration, - }, - } + const handleNameChange = async (name: any) => { + if (await sendInputes(selections, duration, name)) { + setWidgetName(name); + } + }; - let response = await adding3dWidgets(selectedZone.zoneUuid, organization, newWidget, projectId, selectedVersion?.versionId || "") - - if (response.message === "widget update successfully") { - return true; - } else { - return false - } - // - // try { - // const response = await axios.post( - // `http://${process.env.REACT_APP_SERVER_REST_API_BASE_URL}/api/V1/widget3d/save`, - // { - // headers: { - // Authorization: "Bearer ", - // "Content-Type": "application/json", - // token: localStorage.getItem("token") || "", - // refresh_token: localStorage.getItem("refreshToken") || "", - // }, - // }, - // { - // organization, - // zoneUuid: selectedZone.zoneUuid, - // widget: { - // id: selectedChartId.id, - // widgetName: inputName, - // Data: { - // measurements: inputMeasurement, - // duration: inputDuration, - // }, - // }, - // projectId: projectId, - // versionId: selectedVersion?.versionId || "" - // } as any - // ); - // - // if (response.status === 200) { - // return true; - // } else { - // // - // return false; - // } - // } catch (error) { - // echo.error("Failed to send input"); - // - // return false; - // } - }; - - const handleSelect = async ( - inputKey: string, - selectedData: { name: string; fields: string } | null - ) => { - // async() => { - const newSelections = { ...selections }; - if (selectedData === null) { - delete newSelections[inputKey]; - } else { - newSelections[inputKey] = selectedData; - } - // setMeasurements(newSelections); // Update Zustand store - // - if (await sendInputes(newSelections, duration, widgetName)) { - setSelections(newSelections); - } - // sendInputes(newSelections, duration); // Send data to server - // return newSelections; - // }; - }; - - const handleSelectDuration = async (option: string) => { - if (await sendInputes(selections, option, widgetName)) { - setDuration(option); - } - // setDuration(option); - }; - - const handleNameChange = async (name: any) => { - - - if (await sendInputes(selections, duration, name)) { - setWidgetName(name); - } - }; - - return ( - <> -
-
-
Title
- -
- {[...Array(1)].map((_, index) => { - const inputKey = `input${index + 1}`; - return ( -
-
Input {index + 1}
-
- - handleSelect(inputKey, selectedData) - } - onUnselect={() => handleSelect(inputKey, null)} - selectedValue={selections[inputKey]} // Load from Zustand - isLoading={isLoading} - allSelections={selections} - /> -
- + return ( + <> +
+
+
Title
+
-
+ {[...Array(1)].map((_, index) => { + const inputKey = `input${index + 1}`; + return ( +
+
Input {index + 1}
+
+ handleSelect(inputKey, selectedData)} + onUnselect={() => handleSelect(inputKey, null)} + selectedValue={selections[inputKey]} // Load from Zustand + isLoading={isLoading} + allSelections={selections} + /> +
+ +
+
+
+ ); + })}
- ); - })} -
-
-
-
Duration
-
- -
-
-
- - ); +
+
+
Duration
+
+ +
+
+
+ + ); }; export default Widget4InputCard3D; diff --git a/app/src/components/layout/sidebarRight/visualization/Visualization.tsx b/app/src/components/layout/sidebarRight/visualization/Visualization.tsx index c24dea2..4460b61 100644 --- a/app/src/components/layout/sidebarRight/visualization/Visualization.tsx +++ b/app/src/components/layout/sidebarRight/visualization/Visualization.tsx @@ -4,24 +4,18 @@ import Data from "./data/Data"; import Design from "./design/Design"; const Visualization = () => { - const [activeOption, setActiveOption] = useState("Data"); + const [activeOption, setActiveOption] = useState("Data"); - const handleToggleClick = (option: string) => { - setActiveOption(option); // Update the active option - }; + const handleToggleClick = (option: string) => { + setActiveOption(option); + }; - return ( -
- -
- {activeOption === "Data" ? : } -
-
- ); + return ( +
+ +
{activeOption === "Data" ? : }
+
+ ); }; export default Visualization; diff --git a/app/src/components/ui/ModuleToggle.tsx b/app/src/components/ui/ModuleToggle.tsx index f3d0407..0ae1ea7 100644 --- a/app/src/components/ui/ModuleToggle.tsx +++ b/app/src/components/ui/ModuleToggle.tsx @@ -7,12 +7,12 @@ import { VisualizationIcon, } from "../icons/ExportModuleIcons"; import {useToggleStore} from "../../store/ui/useUIToggleStore"; -import useVersionHistoryStore from "../../store/builder/store"; +import useVersionStore from "../../store/builder/store"; const ModuleToggle: React.FC = () => { const { activeModule, setActiveModule } = useModuleStore(); const { setToggleUI } = useToggleStore(); - const { setVersionHistoryVisible } = useVersionHistoryStore(); + const { setVersionHistoryVisible } = useVersionStore(); return (
diff --git a/app/src/components/ui/Tools.tsx b/app/src/components/ui/Tools.tsx index a538cbf..ede444a 100644 --- a/app/src/components/ui/Tools.tsx +++ b/app/src/components/ui/Tools.tsx @@ -1,52 +1,21 @@ import React, { useEffect, useRef, useState } from "react"; -import { - AsileIcon, - CommentIcon, - CursorIcon, - DeleteIcon, - FloorIcon, - FreeMoveIcon, - MeasureToolIcon, - PenIcon, - PlayIcon, - SaveTemplateIcon, - WallIcon, - ZoneIcon, -} from "../icons/ExportToolsIcons"; +import { AsileIcon, CommentIcon, CursorIcon, DeleteIcon, FloorIcon, FreeMoveIcon, MeasureToolIcon, PenIcon, PlayIcon, SaveTemplateIcon, WallIcon, ZoneIcon } from "../icons/ExportToolsIcons"; import { ArrowIcon, TickIcon } from "../icons/ExportCommonIcons"; import useModuleStore, { useThreeDStore } from "../../store/ui/useModuleStore"; import { handleSaveTemplate } from "../../modules/visualization/functions/handleSaveTemplate"; import { usePlayButtonStore } from "../../store/ui/usePlayButtonStore"; import useTemplateStore from "../../store/ui/useTemplateStore"; import { useSelectedZoneStore } from "../../store/visualization/useZoneStore"; -import { - useActiveTool, - useAddAction, - useSocketStore, - useToggleView, - useToolMode, - useActiveSubTool, - useShortcutStore, -} from "../../store/builder/store"; +import { useActiveTool, useAddAction, useSocketStore, useToggleView, useToolMode, useActiveSubTool, useShortcutStore } from "../../store/builder/store"; import { useToggleStore } from "../../store/ui/useUIToggleStore"; -import { - use3DWidget, - useFloatingWidget, -} from "../../store/visualization/useDroppedObjectsStore"; +import { use3DWidget, useFloatingWidget } from "../../store/visualization/useDroppedObjectsStore"; import { useParams } from "react-router-dom"; -import { useVersionContext } from "../../modules/builder/version/versionContext"; import { MoveIcon, RotateIcon } from "../icons/ShortcutIcons"; import { useBuilderStore } from "../../store/builder/useBuilderStore"; +import { useSceneContext } from "../../modules/scene/sceneContext"; // Utility component -const ToolButton = ({ - toolKey, - toolId, - icon: Icon, - active, - onClick, - tooltip, -}: any) => ( +const ToolButton = ({ toolKey, toolId, icon: Icon, active, onClick, tooltip }: any) => ( @@ -376,14 +276,7 @@ const Tools: React.FC = () => {
{["move", "rotate"].map((tool) => ( - setActiveTool(tool)} - /> + setActiveTool(tool)} /> ))}
@@ -396,22 +289,8 @@ const Tools: React.FC = () => {
- setActiveTool("comment")} - /> - {toggleThreeD && ( - setIsPlaying(!isPlaying)} - /> - )} + setActiveTool("comment")} /> + {toggleThreeD && setIsPlaying(!isPlaying)} />}
{activeModule === "builder" && ( diff --git a/app/src/components/ui/analysis/ProductionCapacity.tsx b/app/src/components/ui/analysis/ProductionCapacity.tsx index 6ff0b42..d5b0951 100644 --- a/app/src/components/ui/analysis/ProductionCapacity.tsx +++ b/app/src/components/ui/analysis/ProductionCapacity.tsx @@ -1,12 +1,6 @@ import React, { useEffect, useState } from "react"; import { Line } from "react-chartjs-2"; -import { - Chart as ChartJS, - LineElement, - CategoryScale, - LinearScale, - PointElement, -} from "chart.js"; +import { Chart as ChartJS, LineElement, CategoryScale, LinearScale, PointElement } from "chart.js"; import { PowerIcon, ProductionCapacityIcon } from "../../icons/analysis"; import SkeletonUI from "../../templates/SkeletonUI"; import { useInputValues, useMachineUptime, useProductionCapacityData, useThroughPutData } from "../../../store/builder/store"; @@ -14,188 +8,181 @@ import { useInputValues, useMachineUptime, useProductionCapacityData, useThrough ChartJS.register(LineElement, CategoryScale, LinearScale, PointElement); const ThroughputSummary: React.FC = () => { - // Define all data internally within the component - const timeRange = { - startTime: "08:00 AM", - endTime: "06:00 PM", - }; + // Define all data internally within the component + const timeRange = { + startTime: "08:00 AM", + endTime: "06:00 PM", + }; - const { machineActiveTime } = useMachineUptime(); - const energyConsumption = { - energyConsumed: 456, - unit: "KWH", - }; + const { machineActiveTime } = useMachineUptime(); + const energyConsumption = { + energyConsumed: 456, + unit: "KWH", + }; - + // Dynamic shift data + const shiftUtilization = [ + { shift: 1, percentage: 30, color: "#F3C64D" }, + { shift: 2, percentage: 40, color: "#67B3F4" }, + { shift: 3, percentage: 30, color: "#7981F5" }, + ]; - // Dynamic shift data - const shiftUtilization = [ - { shift: 1, percentage: 30, color: "#F3C64D" }, - { shift: 2, percentage: 40, color: "#67B3F4" }, - { shift: 3, percentage: 30, color: "#7981F5" }, - ]; + const { productionCapacityData } = useProductionCapacityData(); + const { throughputData: data } = useThroughPutData(); - const { productionCapacityData } = useProductionCapacityData() - const { throughputData: data } = useThroughPutData() + const chartOptions = { + responsive: true, + scales: { + x: { + display: false, // hide X axis completely + }, + y: { + display: false, // hide Y axis completely + min: 0, // force Y axis to start at 0 + }, + }, + plugins: { + legend: { + display: false, + }, + tooltip: { + enabled: true, + }, + }, + }; + const assetUsage = 85; - const chartOptions = { - responsive: true, - scales: { - x: { - display: false, // hide X axis completely - }, - y: { - display: false, // hide Y axis completely - min: 0, // force Y axis to start at 0 - }, - }, - plugins: { - legend: { - display: false, - }, - tooltip: { - enabled: true, - }, - }, - }; + // machineActiveTime => Throughput + // shiftUtilization.length => Shifts per day + // 8 => Shift length + // assetUsage => Yield rate - const assetUsage = 85; + const throughtputMachineData = machineActiveTime * shiftUtilization.length * 8; - // machineActiveTime => Throughput - // shiftUtilization.length => Shifts per day - // 8 => Shift length - // assetUsage => Yield rate + const throughputData = { + labels: ["08:00", "08:10", "08:20", "08:30", "08:40", "08:50"], + data: [5, 10, 8, 10, 12, 10], + totalThroughput: (throughtputMachineData * assetUsage) / 100, + assetUsage: assetUsage, + }; - const throughtputMachineData = machineActiveTime * shiftUtilization.length * 8 + const { inputValues } = useInputValues(); + // Chart data configuration + const chartData = { + labels: throughputData.labels, + datasets: [ + { + label: "Units/hour", + data: throughputData.data, + borderColor: "#B392F0", + tension: 0.4, + pointRadius: 0, // Hide points + }, + ], + }; - const throughputData = { - labels: ["08:00", "08:10", "08:20", "08:30", "08:40", "08:50"], - data: [5, 10, 8, 10, 12, 10], - totalThroughput: (throughtputMachineData) * assetUsage / 100, - assetUsage: assetUsage, - }; + const [isLoading, setIsLoading] = useState(true); - const { inputValues } = useInputValues(); - // Chart data configuration - const chartData = { - labels: throughputData.labels, - datasets: [ - { - label: "Units/hour", - data: throughputData.data, - borderColor: "#B392F0", - tension: 0.4, - pointRadius: 0, // Hide points - }, - ], - }; + useEffect(() => { + // + if (productionCapacityData > 0) { + setTimeout(() => { + setIsLoading(false); + }, 3000); + } else { + setIsLoading(true); + } + }, [productionCapacityData]); - const [isLoading, setIsLoading] = useState(true); - - useEffect(() => { - // - if (productionCapacityData > 0) { - setTimeout(() => { - - setIsLoading(false); - }, 3000) - - } else { - setIsLoading(true); - } - }, [productionCapacityData]); - - - return ( - <> - {!isLoading &&
-
-
-
-
Production Capacity
-
- {timeRange.startTime} - {timeRange.endTime} -
-
-
- -
-
- - {!isLoading ? ( - <> -
-
- {productionCapacityData}{" "} - Units/Month -
-
-
-
Asset usage
-
{parseFloat(inputValues["Yield rate"])}%
-
- -
-
- -
-
-
Energy Consumption
-
-
- -
-
-
- {energyConsumption.energyConsumed} -
-
{energyConsumption.unit}
-
-
-
-
-
Shift Utilization
-
-
{throughputData.assetUsage}%
- -
- {/* Dynamically create progress bars based on shiftUtilization array */} - {shiftUtilization.map((shift, index) => ( -
- ))} -
- -
- {/* Dynamically create shift indicators with random colors */} - {shiftUtilization.map((shift, index) => ( -
- - + return ( + <> + {!isLoading && ( +
+
+
+
+
Production Capacity
+
+ {timeRange.startTime} - {timeRange.endTime} +
+
+
+ +
- ))} + + {!isLoading ? ( + <> +
+
+ {productionCapacityData} Units/Month +
+
+
+
Asset usage
+
{parseFloat(inputValues["Yield rate"])}%
+
+ +
+
+ +
+
+
Energy Consumption
+
+
+ +
+
+
{energyConsumption.energyConsumed}
+
{energyConsumption.unit}
+
+
+
+
+
Shift Utilization
+
+
{throughputData.assetUsage}%
+ +
+ {/* Dynamically create progress bars based on shiftUtilization array */} + {shiftUtilization.map((shift, index) => ( +
+ ))} +
+ +
+ {/* Dynamically create shift indicators with random colors */} + {shiftUtilization.map((shift, index) => ( +
+ + +
+ ))} +
+
+
+
+ + ) : ( + + )}
-
-
- - ) : ( - - )} -
-
} - - ); + )} + + ); }; export default ThroughputSummary; diff --git a/app/src/components/ui/collaboration/Messages.tsx b/app/src/components/ui/collaboration/Messages.tsx index b02833a..063189a 100644 --- a/app/src/components/ui/collaboration/Messages.tsx +++ b/app/src/components/ui/collaboration/Messages.tsx @@ -4,287 +4,251 @@ import { KebabIcon } from "../../icons/ExportCommonIcons"; import { adjustHeight } from "./function/textAreaHeightAdjust"; import { getUserData } from "../../../functions/getUserData"; import { useParams } from "react-router-dom"; -import { deleteCommentApi } from "../../../services/factoryBuilder/comments/deleteCommentApi"; -import { addCommentsApi } from "../../../services/factoryBuilder/comments/addCommentsApi"; import { useCommentStore } from "../../../store/collaboration/useCommentStore"; import { useSelectedComment, useSocketStore } from "../../../store/builder/store"; import { getRelativeTime } from "./function/getRelativeTime"; import { editThreadTitleApi } from "../../../services/factoryBuilder/comments/editThreadTitleApi"; -import { useVersionContext } from "../../../modules/builder/version/versionContext"; +import { useSceneContext } from "../../../modules/scene/sceneContext"; +// import { deleteCommentApi } from "../../../services/factoryBuilder/comments/deleteCommentApi"; +// import { addCommentsApi } from "../../../services/factoryBuilder/comments/addCommentsApi"; interface MessageProps { - val: Reply | CommentSchema; - // val: Reply | CommentSchema; - i: number; - setMessages?: React.Dispatch> - setIsEditable?: React.Dispatch> - setEditedThread?: React.Dispatch> - setMode?: React.Dispatch> - isEditable?: boolean; - isEditableThread?: boolean - editedThread?: boolean; - mode?: 'create' | 'edit' | null + val: Reply | CommentSchema; + i: number; + setMessages?: React.Dispatch>; + setIsEditable?: React.Dispatch>; + setEditedThread?: React.Dispatch>; + setMode?: React.Dispatch>; + isEditable?: boolean; + isEditableThread?: boolean; + editedThread?: boolean; + mode?: "create" | "edit" | null; } const Messages: React.FC = ({ val, i, setMessages, mode, setIsEditable, setEditedThread, editedThread, isEditableThread, setMode }) => { + const { updateComment, removeReply, updateReply } = useCommentStore(); + const [openOptions, setOpenOptions] = useState(false); + const { projectId } = useParams(); + const { threadSocket } = useSocketStore(); + const { userName, userId, organization } = getUserData(); + const [isEditComment, setIsEditComment] = useState(false); + const { selectedComment, setCommentPositionState } = useSelectedComment(); + const { versionStore } = useSceneContext(); + const { selectedVersion } = versionStore(); - const { comments, updateComment, updateReply, removeReply } = useCommentStore(); - const [openOptions, setOpenOptions] = useState(false); - const { projectId } = useParams(); - const { threadSocket } = useSocketStore(); - const { userName, userId, organization } = getUserData(); - const [isEditComment, setIsEditComment] = useState(false) - const { selectedComment, setCommentPositionState } = useSelectedComment(); - const { selectedVersionStore } = useVersionContext(); - const { selectedVersion } = selectedVersionStore(); + const [value, setValue] = useState("comment" in val ? val.comment : val.threadTitle); - // input - const [value, setValue] = useState( - "comment" in val ? val.comment : val.threadTitle - ); + const textareaRef = useRef(null); - const textareaRef = useRef(null); - const currentUser = "1"; + useEffect(() => { + if (textareaRef.current) adjustHeight(textareaRef.current); + }, [value]); - // const UserName = "username"; + function handleCancelAction() { + setCommentPositionState(null); + if (setIsEditable) setIsEditable(true); + setIsEditComment(false); + } - useEffect(() => { - if (textareaRef.current) adjustHeight(textareaRef.current); - }, [value]); + const handleSaveAction = async () => { + if (!projectId || !selectedVersion) return; - function handleCancelAction() { - setCommentPositionState(null) - setIsEditable && setIsEditable(true); - setIsEditComment(false) - } + if (isEditableThread && editedThread) { + try { + if (!threadSocket?.active) { + const editThreadTitle = await editThreadTitleApi(projectId, (val as CommentSchema).threadId, value, selectedVersion?.versionId || ""); + if (editThreadTitle.message == "ThreadTitle updated Successfully") { + const editedThread: CommentSchema = { + state: "active", + threadId: editThreadTitle.data.replyId, + creatorId: userId, + createdAt: getRelativeTime(editThreadTitle.data.createdAt), + threadTitle: value, + lastUpdatedAt: new Date().toISOString(), + position: editThreadTitle.data.position, + rotation: [0, 0, 0], + comments: [], + }; + updateComment((val as CommentSchema).threadId, editedThread); + } + } else { + const threadEdit = { + projectId, + userId, + threadTitle: value, + organization, + threadId: (val as CommentSchema).threadId || selectedComment.threadId, + versionId: selectedVersion?.versionId || "", + }; - const handleSaveAction = async () => { - - if (!projectId || !selectedVersion) return - - if (isEditableThread && editedThread) { - try { - if (!threadSocket?.active) { - const editThreadTitle = await editThreadTitleApi(projectId, (val as CommentSchema).threadId, value, selectedVersion?.versionId || "") - if (editThreadTitle.message == "ThreadTitle updated Successfully") { - const editedThread: CommentSchema = { - state: 'active', - threadId: editThreadTitle.data.replyId, - creatorId: userId, - createdAt: getRelativeTime(editThreadTitle.data.createdAt), - threadTitle: value, - lastUpdatedAt: new Date().toISOString(), - position: editThreadTitle.data.position, - rotation: [0, 0, 0], - comments: [], - } - updateComment((val as CommentSchema).threadId, editedThread) - } + threadSocket.emit("v1:thread:updateTitle", threadEdit); + } + } catch {} } else { - const threadEdit = { - projectId, - userId, - threadTitle: value, - organization, - threadId: (val as CommentSchema).threadId || selectedComment.threadId, - versionId: selectedVersion?.versionId || "" - } + if (mode === "edit") { + try { + // const editComments = await addCommentsApi(projectId, value, selectedComment?.threadId, (val as Reply).replyId, selectedVersion?.versionId || "") + // + // const commentData = { + // replyId: `${editComments.data?.replyId}`, + // creatorId: `${userId}`, + // createdAt: getRelativeTime(editComments.data?.createdAt), + // lastUpdatedAt: "2 hrs ago", + // comment: value, + // } - threadSocket.emit('v1:thread:updateTitle', threadEdit) - } - } catch { - } - } else { - if (mode === "edit") { - try { - // const editComments = await addCommentsApi(projectId, value, selectedComment?.threadId, (val as Reply).replyId, selectedVersion?.versionId || "") - // - // const commentData = { - // replyId: `${editComments.data?.replyId}`, - // creatorId: `${userId}`, - // createdAt: getRelativeTime(editComments.data?.createdAt), - // lastUpdatedAt: "2 hrs ago", - // comment: value, - // } + // updateReply((val as CommentSchema).threadId, (val as Reply)?.replyId, commentData); - // updateReply((val as CommentSchema).threadId, (val as Reply)?.replyId, commentData); + if (threadSocket) { + // projectId, userId, comment, organization, threadId + const editComment = { + projectId, + userId, + comment: value, + organization, + threadId: selectedComment?.threadId, + commentId: (val as Reply).replyId ?? "", + versionId: selectedVersion?.versionId || "", + }; - if (threadSocket) { - // projectId, userId, comment, organization, threadId - const editComment = { - projectId, - userId, - comment: value, - organization, - threadId: selectedComment?.threadId, - commentId: (val as Reply).replyId ?? "", - versionId: selectedVersion?.versionId || "" + threadSocket.emit("v1-Comment:add", editComment); + setIsEditable && setIsEditable(true); + setEditedThread && setEditedThread(false); + } + } catch {} } - - - threadSocket.emit("v1-Comment:add", editComment); - setIsEditable && setIsEditable(true); - setEditedThread && setEditedThread(false) - } - - } catch { } - } + // setValue(""); + setIsEditComment(false); + }; - } - // setValue(""); - setIsEditComment(false); - } + const handleDeleteAction = async (replyID: any) => { + if (!projectId || !selectedVersion) return; + setOpenOptions(false); + try { + // const deletedComment = await deleteCommentApi(projectId, selectedComment?.threadId, (val as Reply).replyId , selectedVersion?.versionId || "") + // + // if (deletedComment === "'Thread comment deleted Successfully'") { + // setMessages && setMessages(prev => prev.filter(message => message.replyId !== replyID)); + // removeReply(val.creatorId, replyID) + // } + if (threadSocket && setMessages) { + // projectId, userId, commentId, organization, threadId + const deleteComment = { + projectId, + userId, + commentId: (val as Reply).replyId, + organization, + threadId: selectedComment?.threadId, + versionId: selectedVersion?.versionId || "", + }; + setMessages((prev) => { + // 👈 logs the current state + return prev.filter((message) => message.replyId !== (val as Reply).replyId); + }); + removeReply(selectedComment?.threadId, (val as Reply).replyId); // Remove listener after response - const handleDeleteAction = async (replyID: any) => { - if (!projectId || !selectedVersion) return - setOpenOptions(false); - try { - // const deletedComment = await deleteCommentApi(projectId, selectedComment?.threadId, (val as Reply).replyId , selectedVersion?.versionId || "") - // - // if (deletedComment === "'Thread comment deleted Successfully'") { - // setMessages && setMessages(prev => prev.filter(message => message.replyId !== replyID)); - // removeReply(val.creatorId, replyID) - // } - if (threadSocket && setMessages) { + threadSocket.emit("v1-Comment:delete", deleteComment); + } + } catch {} + }; - - // projectId, userId, commentId, organization, threadId - const deleteComment = { - projectId, - userId, - commentId: (val as Reply).replyId, - organization, - threadId: selectedComment?.threadId, - versionId: selectedVersion?.versionId || "" - } - setMessages(prev => { - // 👈 logs the current state - return prev.filter(message => message.replyId !== (val as Reply).replyId); + const handleFocus = (e: React.FocusEvent) => { + requestAnimationFrame(() => { + if (textareaRef.current) { + const length = textareaRef.current.value.length; + textareaRef.current.setSelectionRange(length, length); + } }); - removeReply(selectedComment?.threadId, (val as Reply).replyId); // Remove listener after response + }; + return ( + <> + {isEditComment ? ( +
+
+