refactor: Update color scheme for Floor and Zone components; enhance snapping logic in ReferenceFloor and ReferenceZone

app/src/modules/builder/floor/Instances/Instance/floor2DInstance.tsx

@@ -36,7 +36,7 @@ function Floor2DInstance({ floor }: { floor: Floor }) {
                 userData={floor}
             >
                 <meshBasicMaterial
-                    color={savedTheme === "dark" ? "#d2baff" : "#6f42c1"}
+                    color={savedTheme === "dark" ? "#808080" : "#808080"}
                     side={DoubleSide}
                     transparent
                     opacity={0.4}

app/src/modules/builder/floor/floorCreator/referenceFloor.tsx

@@ -25,7 +25,7 @@ function ReferenceFloor({ tempPoints }: Readonly<ReferenceFloorProps>) {
     const [currentPosition, setCurrentPosition] = useState<[number, number, number]>(tempPoints[0]?.position);
 
     const directionalSnap = useDirectionalSnapping(currentPosition, tempPoints[tempPoints.length - 1]?.position || null);
-    const { snapFloorPoint } = usePointSnapping({ uuid: 'temp-floor', pointType: 'Floor', position: directionalSnap.position || [0, 0, 0], });
+    const { snapFloorPoint } = usePointSnapping({ uuid: 'temp-Floor', pointType: 'Floor', position: directionalSnap.position || [0, 0, 0], });
 
     useFrame(() => {
         if (toolMode === 'Floor' && toggleView && tempPoints.length > 0) {
@@ -36,7 +36,7 @@ function ReferenceFloor({ tempPoints }: Readonly<ReferenceFloorProps>) {
             setCurrentPosition([intersectionPoint.x, intersectionPoint.y, intersectionPoint.z]);
 
             if (!intersectionPoint) return;
-            const snapped = snapFloorPoint([intersectionPoint.x, intersectionPoint.y, intersectionPoint.z], [tempPoints[0]]);
+            const snapped = snapFloorPoint([intersectionPoint.x, intersectionPoint.y, intersectionPoint.z], tempPoints.length > 2 ? [tempPoints[0]] : []);
 
             if (snapped.isSnapped && snapped.snappedPoint) {
                 finalPosition.current = snapped.position;
@@ -158,7 +158,7 @@ function Floor({ floor }: { floor: Point[] }) {
                 position={[0, 0, 0]}
                 receiveShadow
             >
-                <meshStandardMaterial color={savedTheme === "dark" ? "#d2baff" : "#6f42c1"} depthWrite={false} transparent opacity={0.3} side={THREE.DoubleSide} />
+                <meshStandardMaterial color={savedTheme === "dark" ? "#808080" : "#808080"} depthWrite={false} transparent opacity={0.3} side={THREE.DoubleSide} />
             </Extrude>
         </group>
     );

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

@@ -131,7 +131,7 @@ function Point({ point }: { readonly point: Point }) {
                     const finalSnapped = snapFloorPoint(floorSnapped.position);
                     setFloorPosition(point.pointUuid, finalSnapped.position);
                 } else if (point.pointType === 'Zone') {
-                    const zoneSnapped = snapAisleAngle(newPosition);
+                    const zoneSnapped = snapZoneAngle(newPosition);
                     const finalSnapped = snapZonePoint(zoneSnapped.position);
                     setZonePosition(point.pointUuid, finalSnapped.position);
                 }

app/src/modules/builder/zone/Instances/Instance/zone2DInstance.tsx

@@ -36,7 +36,7 @@ function Zone2DInstance({ zone }: { zone: Zone }) {
                 userData={zone}
             >
                 <meshBasicMaterial
-                    color={savedTheme === "dark" ? "green" : "green"}
+                    color={savedTheme === "dark" ? "#007BFF" : "#007BFF"}
                     side={DoubleSide}
                     transparent
                     opacity={0.4}

app/src/modules/builder/zone/Instances/zoneInstances.tsx

@@ -13,6 +13,10 @@ function ZoneInstances() {
     const { zones } = zoneStore();
     const { toggleView } = useToggleView();
 
+    useEffect(() => {
+        // console.log('zones: ', zones);
+    }, [zones])
+
     const allPoints = useMemo(() => {
         const points: Point[] = [];
         const seenUuids = new Set<string>();

app/src/modules/builder/zone/zoneCreator/referenceZone.tsx

@@ -36,7 +36,7 @@ function ReferenceZone({ tempPoints }: Readonly<ReferenceZoneProps>) {
             setCurrentPosition([intersectionPoint.x, intersectionPoint.y, intersectionPoint.z]);
 
             if (!intersectionPoint) return;
-            const snapped = snapZonePoint([intersectionPoint.x, intersectionPoint.y, intersectionPoint.z], [tempPoints[0]]);
+            const snapped = snapZonePoint([intersectionPoint.x, intersectionPoint.y, intersectionPoint.z], tempPoints.length > 2 ? [tempPoints[0]] : []);
 
             if (snapped.isSnapped && snapped.snappedPoint) {
                 finalPosition.current = snapped.position;
@@ -156,7 +156,7 @@ function Zone({ zone }: { zone: Point[] }) {
                 position={[0, 0, 0]}
                 receiveShadow
             >
-                <meshStandardMaterial color={savedTheme === "dark" ? "#d2baff" : "#6f42c1"} depthWrite={false} transparent opacity={0.3} side={THREE.DoubleSide} />
+                <meshStandardMaterial color={savedTheme === "dark" ? "#007BFF" : "#007BFF"} depthWrite={false} transparent opacity={0.3} side={THREE.DoubleSide} />
             </Extrude>
         </group>
     );

app/src/modules/builder/zone/zoneGroup.tsx

@@ -29,6 +29,7 @@ function ZoneGroup() {
     useEffect(() => {
         if (projectId && selectedVersion) {
             getZonesApi(projectId, selectedVersion?.versionId || '').then((zones) => {
+                console.log('zones: ', zones);
                 if (zones && zones.length > 0) {
                     setZones(zones);
                 } else {