removed bug in wall asset dynamic position updation

app/src/modules/builder/line/line.tsx

@@ -11,6 +11,7 @@ import { useParams } from 'react-router-dom';
 import { getUserData } from '../../../functions/getUserData';
 import { handleCanvasCursors } from '../../../utils/mouseUtils/handleCanvasCursors';
 import { useSelectedPoints } from '../../../store/simulation/useSimulationStore';
+import { calculateAssetTransformationOnWall } from '../wallAsset/Instances/Instance/functions/calculateAssetTransformationOnWall';
 
 // import { upsertWallApi } from '../../../services/factoryBuilder/wall/upsertWallApi';
 // import { deleteWallApi } from '../../../services/factoryBuilder/wall/deleteWallApi';
@@ -18,6 +19,8 @@ import { useSelectedPoints } from '../../../store/simulation/useSimulationStore'
 // import { deleteFloorApi } from '../../../services/factoryBuilder/floor/deleteFloorApi';
 // import { deleteZoneApi } from '../../../services/factoryBuilder/zone/deleteZoneApi';
 // import { upsertZoneApi } from '../../../services/factoryBuilder/zone/upsertZoneApi';
+// import { upsertWallAssetApi } from '../../../services/factoryBuilder/asset/wallAsset/upsertWallAssetApi';
+// import { deleteWallAssetApi } from '../../../services/factoryBuilder/asset/wallAsset/deleteWallAssetApi';
 
 interface LineProps {
     points: [Point, Point];
@@ -30,8 +33,9 @@ function Line({ points }: Readonly<LineProps>) {
     const [isDeletable, setIsDeletable] = useState(false);
     const { socket } = useSocketStore();
     const { toolMode } = useToolMode();
-    const { wallStore, floorStore, zoneStore, undoRedo2DStore } = useSceneContext();
+    const { wallStore, floorStore, zoneStore, undoRedo2DStore, wallAssetStore } = useSceneContext();
     const { push2D } = undoRedo2DStore();
+    const { getWallAssetsByWall, updateWallAsset, removeWallAsset } = wallAssetStore();
     const { removeWallByPoints, setPosition: setWallPosition, getWallByPoints, getConnectedWallsByWallId } = wallStore();
     const { removeFloorByPoints, setPosition: setFloorPosition, getFloorsByPointId, getFloorsByPoints } = floorStore();
     const { removeZoneByPoints, setPosition: setZonePosition, getZonesByPointId, getZonesByPoints } = zoneStore();
@@ -110,6 +114,33 @@ function Line({ points }: Readonly<LineProps>) {
                 const removedWall = removeWallByPoints(points);
                 if (removedWall && projectId) {
 
+                    const assetsOnWall = getWallAssetsByWall(removedWall.wallUuid);
+
+                    assetsOnWall.forEach((asset) => {
+                        if (projectId && asset) {
+
+                            removeWallAsset(asset.modelUuid);
+
+                            // API
+
+                            // deleteWallAssetApi(projectId, selectedVersion?.versionId || '', asset.modelUuid, asset.wallUuid);
+
+                            // SOCKET
+
+                            const data = {
+                                projectId: projectId,
+                                versionId: selectedVersion?.versionId || '',
+                                userId: userId,
+                                organization: organization,
+                                modelUuid: asset.modelUuid,
+                                wallUuid: asset.wallUuid
+                            }
+
+                            socket.emit('v1:wall-asset:delete', data);
+
+                        }
+                    })
+
                     // API
 
                     // deleteWallApi(projectId, selectedVersion?.versionId || '', removedWall.wallUuid);
@@ -377,7 +408,7 @@ function Line({ points }: Readonly<LineProps>) {
         }
     };
 
-    const handleDragEnd = (points: [Point, Point])  => {
+    const handleDragEnd = (points: [Point, Point]) => {
         if (toolMode !== 'move' || !dragOffset) return;
         handleCanvasCursors('default');
         setDragOffset(null);
@@ -390,6 +421,39 @@ function Line({ points }: Readonly<LineProps>) {
             if (updatedWalls.length > 0 && projectId) {
                 updatedWalls.forEach(updatedWall => {
 
+                    const initialWall = initialPositions.walls?.find(w => w.wallUuid === updatedWall.wallUuid);
+
+                    if (initialWall) {
+                        const assetsOnWall = getWallAssetsByWall(updatedWall.wallUuid);
+
+                        assetsOnWall.forEach(asset => {
+                            const { position, rotation } = calculateAssetTransformationOnWall(asset, initialWall, updatedWall);
+
+                            const updatedWallAsset = updateWallAsset(asset.modelUuid, {
+                                position: [position[0], asset.position[1], position[2]],
+                                rotation: rotation
+                            });
+
+                            if (projectId && updatedWallAsset) {
+                                // API
+
+                                // upsertWallAssetApi(projectId, selectedVersion?.versionId || '', updatedWallAsset);
+
+                                // SOCKET
+
+                                const data = {
+                                    wallAssetData: updatedWallAsset,
+                                    projectId: projectId,
+                                    versionId: selectedVersion?.versionId || '',
+                                    userId: userId,
+                                    organization: organization
+                                }
+
+                                socket.emit('v1:wall-asset:add', data);
+                            }
+                        });
+                    }
+
                     // API
 
                     // upsertWallApi(projectId, selectedVersion?.versionId || '', updatedWall);

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

@@ -52,7 +52,7 @@ function Point({ point }: { readonly point: Point }) {
     const boxScale: [number, number, number] = Constants.pointConfig.boxScale;
     const colors = getColor(point);
 
-    const [initialPositions, setInitialPositions] = useState<{
+    const [initialStates, setInitialStates] = useState<{
         aisles?: Aisle[],
         walls?: Wall[],
         floors?: Floor[],
@@ -167,16 +167,16 @@ function Point({ point }: { readonly point: Point }) {
 
             if (point.pointType === 'Aisle') {
                 const aisles = getAislesByPointId(point.pointUuid);
-                setInitialPositions({ aisles });
+                setInitialStates({ aisles });
             } else if (point.pointType === 'Wall') {
                 const walls = getWallsByPointId(point.pointUuid);
-                setInitialPositions({ walls });
+                setInitialStates({ walls });
             } else if (point.pointType === 'Floor') {
                 const floors = getFloorsByPointId(point.pointUuid);
-                setInitialPositions({ floors });
+                setInitialStates({ floors });
             } else if (point.pointType === 'Zone') {
                 const zones = getZonesByPointId(point.pointUuid);
-                setInitialPositions({ zones });
+                setInitialStates({ zones });
             }
         }
     };
@@ -208,8 +208,8 @@ function Point({ point }: { readonly point: Point }) {
                     })
                 })
 
-                if (initialPositions.aisles && initialPositions.aisles.length > 0) {
+                if (initialStates.aisles && initialStates.aisles.length > 0) {
-                    const updatedPoints = initialPositions.aisles.map((aisle) => ({
+                    const updatedPoints = initialStates.aisles.map((aisle) => ({
                         type: "Aisle" as const,
                         lineData: aisle,
                         newData: updatedAisles.find(a => a.aisleUuid === aisle.aisleUuid),
@@ -230,7 +230,7 @@ function Point({ point }: { readonly point: Point }) {
             if (updatedWalls && updatedWalls.length > 0 && projectId) {
                 updatedWalls.forEach((updatedWall) => {
 
-                    const initialWall = initialPositions.walls?.find(w => w.wallUuid === updatedWall.wallUuid);
+                    const initialWall = initialStates.walls?.find(w => w.wallUuid === updatedWall.wallUuid);
 
                     if (initialWall) {
                         const assetsOnWall = getWallAssetsByWall(updatedWall.wallUuid);
@@ -281,8 +281,8 @@ function Point({ point }: { readonly point: Point }) {
                 });
             }
 
-            if (initialPositions.walls && initialPositions.walls.length > 0) {
+            if (initialStates.walls && initialStates.walls.length > 0) {
-                const updatedPoints = initialPositions.walls.map((wall) => ({
+                const updatedPoints = initialStates.walls.map((wall) => ({
                     type: "Wall" as const,
                     lineData: wall,
                     newData: updatedWalls.find(w => w.wallUuid === wall.wallUuid),
@@ -320,8 +320,8 @@ function Point({ point }: { readonly point: Point }) {
                 });
             }
 
-            if (initialPositions.floors && initialPositions.floors.length > 0) {
+            if (initialStates.floors && initialStates.floors.length > 0) {
-                const updatedPoints = initialPositions.floors.map((floor) => ({
+                const updatedPoints = initialStates.floors.map((floor) => ({
                     type: "Floor" as const,
                     lineData: floor,
                     newData: updatedFloors.find(f => f.floorUuid === floor.floorUuid),
@@ -359,8 +359,8 @@ function Point({ point }: { readonly point: Point }) {
                 });
             }
 
-            if (initialPositions.zones && initialPositions.zones.length > 0) {
+            if (initialStates.zones && initialStates.zones.length > 0) {
-                const updatedPoints = initialPositions.zones.map((zone) => ({
+                const updatedPoints = initialStates.zones.map((zone) => ({
                     type: "Zone" as const,
                     lineData: zone,
                     newData: updatedZones.find(z => z.zoneUuid === zone.zoneUuid),
@@ -377,7 +377,7 @@ function Point({ point }: { readonly point: Point }) {
             }
         }
 
-        setInitialPositions({});
+        setInitialStates({});
     }
 
     const handlePointClick = (point: Point) => {

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

@@ -9,6 +9,7 @@ import { useSceneContext } from "../../../sceneContext";
 import { useVersionContext } from "../../../../builder/version/versionContext";
 import { useSelectedPoints } from "../../../../../store/simulation/useSimulationStore";
 import useModuleStore from "../../../../../store/useModuleStore";
+import { calculateAssetTransformationOnWall } from "../../../../builder/wallAsset/Instances/Instance/functions/calculateAssetTransformationOnWall";
 
 // import { upsertAisleApi } from "../../../../../services/factoryBuilder/aisle/upsertAisleApi";
 // import { upsertWallApi } from "../../../../../services/factoryBuilder/wall/upsertWallApi";
@@ -36,7 +37,8 @@ function MoveControls2D({
     const { projectId } = useParams();
     const { selectedVersionStore } = useVersionContext();
     const { selectedVersion } = selectedVersionStore();
-    const { aisleStore, wallStore, floorStore, zoneStore, undoRedo2DStore } = useSceneContext();
+    const { aisleStore, wallStore, floorStore, zoneStore, undoRedo2DStore, wallAssetStore } = useSceneContext();
+    const { getWallAssetsByWall, updateWallAsset } = wallAssetStore();
     const { push2D } = undoRedo2DStore();
     const { setPosition: setAislePosition, getAislesByPointId, getAisleById } = aisleStore();
     const { setPosition: setWallPosition, getWallsByPointId, getWallById } = wallStore();
@@ -45,6 +47,12 @@ function MoveControls2D({
     const [dragOffset, setDragOffset] = useState<THREE.Vector3 | null>(null);
     const [initialPositions, setInitialPositions] = useState<Record<string, THREE.Vector3>>({});
     const [initialStates, setInitialStates] = useState<Record<string, { position: THREE.Vector3; rotation?: THREE.Euler; }>>({});
+    const [initial, setInitial] = useState<{
+        aisles?: Aisle[],
+        walls?: Wall[],
+        floors?: Floor[],
+        zones?: Zone[]
+    }>({});
     const [isMoving, setIsMoving] = useState(false);
 
     useEffect(() => {
@@ -110,7 +118,7 @@ function MoveControls2D({
             canvasElement.removeEventListener("pointerup", onPointerUp);
             canvasElement.removeEventListener("keydown", onKeyDown);
         };
-    }, [camera, controls, scene, toggleView, selectedPoints, socket, pastedObjects, duplicatedObjects, movedObjects, rotatedObjects]);
+    }, [camera, controls, scene, toggleView, selectedPoints, socket, pastedObjects, duplicatedObjects, movedObjects, rotatedObjects, initial]);
 
     useEffect(() => {
         if (toolMode !== 'move' || !toggleView) {
@@ -169,13 +177,35 @@ function MoveControls2D({
         if (selectedPoints.length === 0) return;
 
         const states: Record<string, { position: THREE.Vector3; rotation?: THREE.Euler; }> = {};
+        const initials: {
+            aisles?: Aisle[] | undefined;
+            walls?: Wall[];
+            floors?: Floor[];
+            zones?: Zone[];
+        } = {}
 
         selectedPoints.forEach((point: THREE.Object3D) => {
             states[point.uuid] = {
                 position: new THREE.Vector3().copy(point.position),
                 rotation: point.rotation ? new THREE.Euler().copy(point.rotation) : undefined
             };
+
+            if (point.userData.pointType === "Aisle") {
+                const aisles = getAislesByPointId(point.userData.pointUuid);
+                initials.aisles = [...(initials.aisles ?? []), ...aisles,].filter((aisle, index, self) => index === self.findIndex((a) => a.aisleUuid === aisle.aisleUuid));
+            } else if (point.userData.pointType === "Wall") {
+                const walls = getWallsByPointId(point.userData.pointUuid);
+                initials.walls = [...(initials.walls ?? []), ...walls,].filter((wall, index, self) => index === self.findIndex((w) => w.wallUuid === wall.wallUuid));
+            } else if (point.userData.pointType === "Floor") {
+                const floors = getFloorsByPointId(point.userData.pointUuid);
+                initials.floors = [...(initials.floors ?? []), ...floors,].filter((floor, index, self) => index === self.findIndex((f) => f.floorUuid === floor.floorUuid));
+            } else if (point.userData.pointType === "Zone") {
+                const zones = getZonesByPointId(point.userData.pointUuid);
+                initials.zones = [...(initials.zones ?? []), ...zones,].filter((zone, index, self) => index === self.findIndex((z) => z.zoneUuid === zone.zoneUuid));
+            }
         });
+
+        setInitial(initials)
         setInitialStates(states);
 
         const positions: Record<string, THREE.Vector3> = {};
@@ -229,6 +259,7 @@ function MoveControls2D({
         const processedWalls: UndoRedo2DDataTypeSchema[] = [];
         const processedFloors: UndoRedo2DDataTypeSchema[] = [];
         const processedZones: UndoRedo2DDataTypeSchema[] = [];
+        const wallAssetUpdates: WallAsset[] = [];
 
         movedObjects.forEach((movedObject: THREE.Object3D) => {
             if (movedObject.userData.pointUuid) {
@@ -281,6 +312,24 @@ function MoveControls2D({
                     if (updatedWalls?.length && projectId) {
                         updatedWalls.forEach(updatedWall => {
 
+                            const initialWall = initial.walls?.find(w => w.wallUuid === updatedWall.wallUuid);
+
+                            if (initialWall) {
+                                const assetsOnWall = getWallAssetsByWall(updatedWall.wallUuid);
+
+                                assetsOnWall.forEach((asset) => {
+                                    const { position, rotation } = calculateAssetTransformationOnWall(asset, initialWall, updatedWall);
+
+                                    const updatedWallAsset: WallAsset = {
+                                        ...asset,
+                                        position: [position[0], asset.position[1], position[2]],
+                                        rotation,
+                                    };
+
+                                    wallAssetUpdates.push(updatedWallAsset);
+                                });
+                            }
+
                             // API
 
                             // upsertWallApi(projectId, selectedVersion?.versionId || '', updatedWall);
@@ -399,6 +448,36 @@ function MoveControls2D({
         });
 
         setTimeout(() => {
+
+            if (wallAssetUpdates.length > 0) {
+                wallAssetUpdates.filter((wallAssets, index, self) => index === self.findIndex((w) => w.modelUuid === wallAssets.modelUuid));
+                wallAssetUpdates.forEach((updatedWallAsset) => {
+                    if (projectId && updatedWallAsset) {
+
+                        updateWallAsset(updatedWallAsset.modelUuid, {
+                            position: updatedWallAsset.position,
+                            rotation: updatedWallAsset.rotation
+                        });
+
+                        // API
+
+                        // upsertWallAssetApi(projectId, selectedVersion?.versionId || '', updatedWallAsset);
+
+                        // SOCKET
+
+                        const data = {
+                            wallAssetData: updatedWallAsset,
+                            projectId: projectId,
+                            versionId: selectedVersion?.versionId || '',
+                            userId: userId,
+                            organization: organization
+                        }
+
+                        socket.emit('v1:wall-asset:add', data);
+                    }
+                });
+            }
+
             if (processedWalls.length > 0) {
                 const wallMap = new Map<string, UndoRedo2DDataTypeSchema[]>();
 

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

@@ -38,7 +38,8 @@ const SelectionControls2D: React.FC = () => {
     const { selectedVersion } = selectedVersionStore();
     const { projectId } = useParams();
     const { hoveredLine, hoveredPoint } = useBuilderStore();
-    const { aisleStore, wallStore, floorStore, zoneStore, undoRedo2DStore } = useSceneContext();
+    const { aisleStore, wallStore, floorStore, zoneStore, undoRedo2DStore, wallAssetStore } = useSceneContext();
+    const { getWallAssetsByWall, removeWallAsset } = wallAssetStore();
     const { push2D } = undoRedo2DStore();
     const { removePoint: removeAislePoint } = aisleStore();
     const { removePoint: removeWallPoint } = wallStore();
@@ -271,6 +272,34 @@ const SelectionControls2D: React.FC = () => {
                         const removedWalls = removeWallPoint(point.pointUuid);
                         if (removedWalls.length > 0) {
                             removedWalls.forEach(wall => {
+
+                                const assetsOnWall = getWallAssetsByWall(wall.wallUuid);
+
+                                assetsOnWall.forEach((asset) => {
+                                    if (projectId && asset) {
+
+                                        removeWallAsset(asset.modelUuid);
+
+                                        // API
+
+                                        // deleteWallAssetApi(projectId, selectedVersion?.versionId || '', asset.modelUuid, asset.wallUuid);
+
+                                        // SOCKET
+
+                                        const data = {
+                                            projectId: projectId,
+                                            versionId: selectedVersion?.versionId || '',
+                                            userId: userId,
+                                            organization: organization,
+                                            modelUuid: asset.modelUuid,
+                                            wallUuid: asset.wallUuid
+                                        }
+
+                                        socket.emit('v1:wall-asset:delete', data);
+
+                                    }
+                                })
+
                                 if (projectId) {
 
                                     // API