first commit

app/src/store/builder/useBuilderStore.ts

@@ -0,0 +1,211 @@
+import { Object3D } from 'three';
+import { create } from 'zustand';
+import { immer } from 'zustand/middleware/immer';
+
+interface BuilderState {
+    // Common properties
+
+    hoveredPoint: Point | null;
+    snappedPoint: Point | null;
+    snappedPosition: [number, number, number] | null;
+
+    // Wall
+
+    wallThickness: number;
+    wallHeight: number;
+
+    setWallThickness: (thickness: number) => void;
+    setWallHeight: (height: number) => void;
+
+    // Aisle
+
+    selectedAisle: Object3D | null;
+
+    aisleType: AisleTypes;
+    aisleWidth: number;
+    aisleColor: AisleColors;
+
+    // Dashed aisle properties
+    dashLength: number;
+    gapLength: number;
+
+    // Dotted aisle properties
+    dotRadius: number;
+
+    // Arrows aisle properties
+    aisleLength: number;
+
+    // Junction aisle properties
+    isFlipped: boolean;
+
+    // Setters for common properties
+
+    setHoveredPoint: (point: Point | null) => void;
+    setSnappedPoint: (point: Point | null) => void;
+    setSnappedPosition: (position: [number, number, number] | null) => void;
+
+    setSelectedAisle: (aisle: Object3D | null) => void;
+
+    setAisleType: (type: AisleTypes) => void;
+    setAisleWidth: (width: number) => void;
+    setAisleColor: (color: AisleColors) => void;
+
+    // Setters for dashed aisle
+    setDashLength: (length: number) => void;
+    setGapLength: (length: number) => void;
+
+    // Setters for dotted aisle
+    setDotRadius: (radius: number) => void;
+
+    // Setters for arrows aisle
+    setAisleLength: (length: number) => void;
+
+    // Setters for junction aisle
+    setIsFlipped: (isFlipped: boolean) => void;
+
+    // Batch setters
+    setDashedAisleProperties: (width: number, dashLength: number, gapLength: number) => void;
+    setDottedAisleProperties: (width: number, dotRadius: number, gapLength: number) => void;
+    setArrowsAisleProperties: (width: number, aisleLength: number, gapLength: number) => void;
+    setAisleProperties: (type: AisleTypes, width: number, color: AisleColors) => void;
+}
+
+export const useBuilderStore = create<BuilderState>()(
+    immer((set) => ({
+        // Default values
+
+        hoveredPoint: null,
+        snappedPoint: null,
+        snappedPosition: null,
+
+        // Wall
+
+        wallThickness: 0.1,
+        wallHeight: 7,
+
+        setWallThickness: (thickness: number) => {
+            set((state) => {
+                state.wallThickness = thickness;
+            })
+        },
+        
+        setWallHeight: (height: number) => {
+            set((state) => {
+                state.wallHeight = height;
+            })
+        },
+
+        // Aisle
+
+        selectedAisle: null,
+
+        aisleType: 'solid-aisle',
+        aisleWidth: 0.1,
+        aisleColor: 'yellow',
+        dashLength: 0.5,
+        gapLength: 0.3,
+        dotRadius: 0.1,
+        aisleLength: 0.6,
+        isFlipped: false,
+
+        // Individual setters
+
+        setHoveredPoint: (point: Point | null) => {
+            set((state) => {
+                state.hoveredPoint = point;
+            });
+        },
+
+        setSnappedPoint: (point: Point | null) => {
+            set((state) => {
+                state.snappedPoint = point;
+            });
+        },
+
+        setSnappedPosition: (position: [number, number, number] | null) => {
+            set((state) => {
+                state.snappedPosition = position;
+            });
+        },
+
+        setSelectedAisle: (aisle: Object3D | null) => {
+            set((state) => {
+                state.selectedAisle = aisle;
+            });
+        },
+
+        setAisleType: (type) => {
+            set((state) => {
+                state.aisleType = type;
+            });
+        },
+        setAisleWidth: (width) => {
+            set((state) => {
+                state.aisleWidth = width;
+            });
+        },
+        setAisleColor: (color) => {
+            set((state) => {
+                state.aisleColor = color;
+            });
+        },
+        setDashLength: (length) => {
+            set((state) => {
+                state.dashLength = length;
+            });
+        },
+        setGapLength: (length) => {
+            set((state) => {
+                state.gapLength = length;
+            });
+        },
+        setDotRadius: (radius) => {
+            set((state) => {
+                state.dotRadius = radius;
+            });
+        },
+        setAisleLength: (length) => {
+            set((state) => {
+                state.aisleLength = length;
+            });
+        },
+        setIsFlipped: (isFlipped) => {
+            set((state) => {
+                state.isFlipped = isFlipped;
+            });
+        },
+
+        // Batch setters
+        setDashedAisleProperties: (width, dashLength, gapLength) => {
+            set((state) => {
+                state.aisleType = 'dashed-aisle';
+                state.aisleWidth = width;
+                state.dashLength = dashLength;
+                state.gapLength = gapLength;
+            });
+        },
+        setDottedAisleProperties: (width, dotRadius, gapLength) => {
+            set((state) => {
+                state.aisleType = 'dotted-aisle';
+                state.aisleWidth = width;
+                state.dotRadius = dotRadius;
+                state.gapLength = gapLength;
+            });
+        },
+        setArrowsAisleProperties: (width, aisleLength, gapLength) => {
+            set((state) => {
+                state.aisleType = 'arrows-aisle';
+                state.aisleWidth = width;
+                state.aisleLength = aisleLength;
+                state.gapLength = gapLength;
+            });
+        },
+        setAisleProperties: (type, width, color) => {
+            set((state) => {
+                state.aisleType = type;
+                state.aisleWidth = width;
+                state.aisleColor = color;
+            });
+        }
+    }))
+);