feat: Implement undo and redo functionality for 2D scene controls

- Added useRedoHandler to manage redo actions, including socket communication for wall, floor, zone, and aisle updates.
- Added useUndoHandler to manage undo actions, reversing the effects of previous actions with corresponding socket updates.
- Created UndoRedo2DControls component to handle keyboard shortcuts for undo (Ctrl+Z) and redo (Ctrl+Y).
- Established a Zustand store (useUndoRedo2DStore) to maintain undo and redo stacks, with methods for pushing, popping, and peeking actions.

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

@@ -30,10 +30,11 @@ function Line({ points }: Readonly<LineProps>) {
     const [isDeletable, setIsDeletable] = useState(false);
     const { socket } = useSocketStore();
     const { toolMode } = useToolMode();
-    const { wallStore, floorStore, zoneStore } = useSceneContext();
+    const { wallStore, floorStore, zoneStore, undoRedo2DStore } = useSceneContext();
+    const { push2D } = undoRedo2DStore();
     const { removeWallByPoints, setPosition: setWallPosition, getWallsByPointId } = wallStore();
-    const { removeFloorByPoints, setPosition: setFloorPosition, getFloorsByPointId } = floorStore();
-    const { removeZoneByPoints, setPosition: setZonePosition, getZonesByPointId } = zoneStore();
+    const { removeFloorByPoints, setPosition: setFloorPosition, getFloorsByPointId, getFloorsByPoints } = floorStore();
+    const { removeZoneByPoints, setPosition: setZonePosition, getZonesByPointId, getZonesByPoints } = zoneStore();
     const { userId, organization } = getUserData();
     const { selectedVersionStore } = useVersionContext();
     const { selectedVersion } = selectedVersionStore();
@@ -117,10 +118,26 @@ function Line({ points }: Readonly<LineProps>) {
                     }
 
                     socket.emit('v1:model-Wall:delete', data);
+
+                    push2D({
+                        type: 'Draw',
+                        actions: [
+                            {
+                                actionType: 'Line-Delete',
+                                point: {
+                                    type: 'Wall',
+                                    lineData: removedWall,
+                                    timeStamp: new Date().toISOString(),
+                                }
+                            }
+                        ]
+                    });
                 }
+
                 setHoveredLine(null);
             }
             if (points[0].pointType === 'Floor' && points[1].pointType === 'Floor') {
+                const Floors = getFloorsByPoints(points);
                 const { removedFloors, updatedFloors } = removeFloorByPoints(points);
                 if (removedFloors.length > 0) {
                     removedFloors.forEach(floor => {
@@ -143,6 +160,22 @@ function Line({ points }: Readonly<LineProps>) {
                             socket.emit('v1:model-Floor:delete', data);
                         }
                     });
+
+                    const removedFloorsData = removedFloors.map((floor) => ({
+                        type: "Floor" as const,
+                        lineData: floor,
+                        timeStamp: new Date().toISOString(),
+                    }));
+
+                    push2D({
+                        type: 'Draw',
+                        actions: [
+                            {
+                                actionType: 'Lines-Delete',
+                                points: removedFloorsData
+                            }
+                        ]
+                    });
                 }
                 if (updatedFloors.length > 0) {
                     updatedFloors.forEach(floor => {
@@ -165,11 +198,29 @@ function Line({ points }: Readonly<LineProps>) {
                             socket.emit('v1:model-Floor:add', data);
                         }
                     });
+
+                    const updatedFloorsData = updatedFloors.map((floor) => ({
+                        type: "Floor" as const,
+                        lineData: Floors.find(f => f.floorUuid === floor.floorUuid) || floor,
+                        newData: floor,
+                        timeStamp: new Date().toISOString(),
+                    }));
+
+                    push2D({
+                        type: 'Draw',
+                        actions: [
+                            {
+                                actionType: 'Lines-Update',
+                                points: updatedFloorsData
+                            }
+                        ]
+                    });
                 }
 
                 setHoveredLine(null);
             }
             if (points[0].pointType === 'Zone' && points[1].pointType === 'Zone') {
+                const Zones = getZonesByPoints(points);
                 const { removedZones, updatedZones } = removeZoneByPoints(points);
                 if (removedZones.length > 0) {
                     removedZones.forEach(zone => {
@@ -192,6 +243,22 @@ function Line({ points }: Readonly<LineProps>) {
                             socket.emit('v1:zone:delete', data);
                         }
                     });
+
+                    const removedZonesData = removedZones.map((zone) => ({
+                        type: "Zone" as const,
+                        lineData: zone,
+                        timeStamp: new Date().toISOString(),
+                    }));
+
+                    push2D({
+                        type: 'Draw',
+                        actions: [
+                            {
+                                actionType: 'Lines-Delete',
+                                points: removedZonesData
+                            }
+                        ]
+                    });
                 }
                 if (updatedZones.length > 0) {
                     updatedZones.forEach(zone => {
@@ -214,7 +281,26 @@ function Line({ points }: Readonly<LineProps>) {
                             socket.emit('v1:zone:add', data);
                         }
                     });
+
+                    const updatedZonesData = updatedZones.map((zone) => ({
+                        type: "Zone" as const,
+                        lineData: Zones.find(z => z.zoneUuid === zone.zoneUuid) || zone,
+                        newData: zone,
+                        timeStamp: new Date().toISOString(),
+                    }));
+
+                    push2D({
+                        type: 'Draw',
+                        actions: [
+                            {
+                                actionType: 'Lines-Update',
+                                points: updatedZonesData
+                            }
+                        ]
+                    });
                 }
+
+                setHoveredLine(null);
             }
             handleCanvasCursors('default');
         }