Merge remote-tracking branch 'origin/main-dev' into main-demo

app/src/modules/builder/point/point.tsx

@@ -5,6 +5,7 @@ import { useSocketStore, useToolMode } from '../../../store/builder/store';
 import { DragControls } from '@react-three/drei';
 import { useThree } from '@react-three/fiber';
 import { useBuilderStore } from '../../../store/builder/useBuilderStore';
+import { useSelectedPoints } from '../../../store/simulation/useSimulationStore';
 import { usePointSnapping } from './helpers/usePointSnapping';
 import { useParams } from 'react-router-dom';
 import { useVersionContext } from '../version/versionContext';
@@ -27,6 +28,7 @@ function Point({ point }: { readonly point: Point }) {
     const { raycaster, camera, pointer } = useThree();
     const plane = useMemo(() => new THREE.Plane(new THREE.Vector3(0, 1, 0), 0), []);
     const [isHovered, setIsHovered] = useState(false);
+    const [isSelected, setIsSelected] = useState(false);
     const [dragOffset, setDragOffset] = useState<THREE.Vector3 | null>(null);
     const { socket } = useSocketStore();
     const { toolMode } = useToolMode();
@@ -36,7 +38,8 @@ function Point({ point }: { readonly point: Point }) {
     const { setPosition: setFloorPosition, removePoint: removeFloorPoint, getFloorsByPointId } = floorStore();
     const { setPosition: setZonePosition, removePoint: removeZonePoint, getZonesByPointId } = zoneStore();
     const { snapAislePoint, snapAisleAngle, snapWallPoint, snapWallAngle, snapFloorPoint, snapFloorAngle, snapZonePoint, snapZoneAngle } = usePointSnapping({ uuid: point.pointUuid, pointType: point.pointType, position: point.position });
-    const { hoveredPoint, setHoveredPoint } = useBuilderStore();
+    const { hoveredPoint,hoveredLine, setHoveredPoint } = useBuilderStore();
+    const { selectedPoints } = useSelectedPoints();
     const { userId, organization } = getUserData();
     const { selectedVersionStore } = useVersionContext();
     const { selectedVersion } = selectedVersionStore();
@@ -407,50 +410,63 @@ function Point({ point }: { readonly point: Point }) {
         }
     }, [hoveredPoint])
 
+    useEffect(() => {
+        if (selectedPoints.length > 0 && selectedPoints.some((selectedPoint) => (selectedPoint.userData.pointUuid && selectedPoint.userData.pointUuid === point.pointUuid))) {
+            setIsSelected(true);
+        } else {
+            setIsSelected(false);
+        }
+    }, [selectedPoints])
+
     if (!point) {
         return null;
     }
 
+
     return (
-        <DragControls
-            axisLock='y'
-            autoTransform={false}
-            onDragStart={() => handleDragStart(point)}
-            onDrag={() => handleDrag(point)}
-            onDragEnd={() => handleDragEnd(point)}
-        >
-            <mesh
-                key={point.pointUuid}
-                uuid={point.pointUuid}
-                name={`${point.pointType}-Point`}
-                position={new THREE.Vector3(...point.position)}
-                onClick={() => {
-                    handlePointClick(point);
-                }}
-                onPointerOver={() => {
-                    if (!hoveredPoint) {
-                        setHoveredPoint(point);
-                        setIsHovered(true);
-                        if (toolMode === 'move') {
-                            handleCanvasCursors('grab');
-                        }
-                    }
-                }}
-                onPointerOut={() => {
-                    if (hoveredPoint) {
-                        setHoveredPoint(null);
-                        handleCanvasCursors('default');
-                    }
-                    setIsHovered(false)
-                }}
-                userData={point}
-            >
-                <boxGeometry args={boxScale} />
-                <shaderMaterial
-                    ref={materialRef}
-                    uniforms={uniforms}
-                    vertexShader={
-                        `
+        <>
+            {!isSelected ?
+                <DragControls
+                    axisLock='y'
+                    autoTransform={false}
+                    onDragStart={() => handleDragStart(point)}
+                    onDrag={() => handleDrag(point)}
+                    onDragEnd={() => handleDragEnd(point)}
+                >
+                    <mesh
+                        key={point.pointUuid}
+                        uuid={point.pointUuid}
+                        name={`${point.pointType}-Point`}
+                        position={[...point.position]}
+                        onClick={() => {
+                            handlePointClick(point);
+                        }}
+                        onPointerOver={(e) => {
+                            if (!hoveredPoint && selectedPoints.length === 0 && e.buttons === 0 && !e.ctrlKey) {
+                                setHoveredPoint(point);
+                                setIsHovered(true);
+                                if (toolMode === 'move') {
+                                    handleCanvasCursors('grab');
+                                }
+                            }
+                        }}
+                        onPointerOut={() => {
+                            if (hoveredPoint) {
+                                setHoveredPoint(null);
+                                if(!hoveredLine){
+                                    handleCanvasCursors('default');
+                                }
+                            }
+                            setIsHovered(false)
+                        }}
+                        userData={point}
+                    >
+                        <boxGeometry args={boxScale} />
+                        <shaderMaterial
+                            ref={materialRef}
+                            uniforms={uniforms}
+                            vertexShader={
+                                `
                             varying vec2 vUv;
 
                             void main() {
@@ -458,9 +474,9 @@ function Point({ point }: { readonly point: Point }) {
                                 gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
                             }
                         `
-                    }
-                    fragmentShader={
-                        `
+                            }
+                            fragmentShader={
+                                `
                             varying vec2 vUv;
                             uniform vec3 uOuterColor;
                             uniform vec3 uInnerColor;
@@ -475,10 +491,32 @@ function Point({ point }: { readonly point: Point }) {
                                     }
                                 }
                         `
-                    }
-                />
-            </mesh>
-        </DragControls>
+                            }
+                        />
+                    </mesh>
+                </DragControls>
+                :
+                <group
+                    key={point.pointUuid}
+                    uuid={point.pointUuid}
+                    name={`${point.pointType}-Point`}
+                    position={[point.position[0], 0.3, point.position[2]]}
+                    userData={point}
+                    rotation={[Math.PI / 2, 0, 0]}
+                >
+                    <mesh>
+                        <torusGeometry args={[0.4, 0.1, 2, 16]} />
+                        <meshBasicMaterial color="#6F42C1" />
+                    </mesh>
+
+                    <mesh position={[0, 0, 0]}>
+                        <sphereGeometry args={[0.3, 8, 16]} />
+                        <meshBasicMaterial color="white" />
+                    </mesh>
+                </group>
+
+            }
+        </>
     );
 }