diff --git a/app/src/components/layout/sidebarRight/SideBarRight.tsx b/app/src/components/layout/sidebarRight/SideBarRight.tsx
index 44199bc..ddb27a0 100644
--- a/app/src/components/layout/sidebarRight/SideBarRight.tsx
+++ b/app/src/components/layout/sidebarRight/SideBarRight.tsx
@@ -28,6 +28,7 @@ import ZoneProperties from "./properties/ZoneProperties";
import EventProperties from "./properties/eventProperties/EventProperties";
import VersionHistory from "./versionHisory/VersionHistory";
import AisleProperties from "./properties/AisleProperties";
+import WallProperties from "./properties/eventProperties/WallProperties";
const SideBarRight: React.FC = () => {
const { activeModule } = useModuleStore();
@@ -145,10 +146,15 @@ const SideBarRight: React.FC = () => {
!selectedFloorItem && (
- {toolMode === "Aisle" ? (
-
) : (
-
- )}
+ {(() => {
+ if (toolMode === "Aisle") {
+ return
;
+ } else if (toolMode === "Wall") {
+ return
;
+ } else {
+ return
;
+ }
+ })()}
)}
diff --git a/app/src/components/layout/sidebarRight/properties/eventProperties/WallProperties.tsx b/app/src/components/layout/sidebarRight/properties/eventProperties/WallProperties.tsx
index ee1d87b..a3e09e9 100644
--- a/app/src/components/layout/sidebarRight/properties/eventProperties/WallProperties.tsx
+++ b/app/src/components/layout/sidebarRight/properties/eventProperties/WallProperties.tsx
@@ -5,6 +5,7 @@ import { AddIcon, RemoveIcon } from "../../../../icons/ExportCommonIcons";
// Texture Imports
import wallTexture1 from "../../../../../assets/image/wallTextures/wallTexture.png";
import defaultTexture from "../../../../../assets/image/wallTextures/defaultTexture.jpg";
+import { useBuilderStore } from "../../../../../store/builder/useBuilderStore";
// Define Material type
type Material = {
@@ -24,11 +25,7 @@ const defaultMaterial: Material = {
};
const WallProperties = () => {
- const [wallProperties, setWallProperties] = useState({
- height: "10",
- thickness: "10",
- length: "10",
- });
+ const { wallHeight, wallThickness, setWallHeight, setWallThickness } = useBuilderStore();
const [activeSide, setActiveSide] = useState<"side1" | "side2">("side1");
@@ -50,14 +47,12 @@ const WallProperties = () => {
});
}, []);
- const handleInputChange = (
- key: keyof typeof wallProperties,
- newValue: string
- ) => {
- setWallProperties((prev) => ({
- ...prev,
- [key]: newValue,
- }));
+ const handleHeightChange = (newValue: string) => {
+ setWallHeight(parseFloat(newValue));
+ };
+
+ const handleThicknessChange = (newValue: string) => {
+ setWallThickness(parseFloat(newValue));
};
const handleAddMaterial = () => {
@@ -104,18 +99,13 @@ const WallProperties = () => {
handleInputChange("height", val)}
+ value={`${wallHeight}`}
+ onChange={(val) => handleHeightChange(val)}
/>
handleInputChange("thickness", val)}
- />
- handleInputChange("length", val)}
+ value={`${wallThickness}`}
+ onChange={(val) => handleThicknessChange(val)}
/>
@@ -130,9 +120,8 @@ const WallProperties = () => {
setActiveSide("side1")}
>
Side 1
@@ -147,9 +136,8 @@ const WallProperties = () => {
setActiveSide("side2")}
>
Side 2
diff --git a/app/src/modules/builder/wall/Instances/wallInstances.tsx b/app/src/modules/builder/wall/Instances/wallInstances.tsx
index 2ec41bf..818134f 100644
--- a/app/src/modules/builder/wall/Instances/wallInstances.tsx
+++ b/app/src/modules/builder/wall/Instances/wallInstances.tsx
@@ -1,14 +1,16 @@
-import React, { useEffect, useMemo } from 'react';
+import React, { useEffect, useMemo, useRef } from 'react';
import { useWallStore } from '../../../../store/builder/useWallStore'
import WallInstance from './instance/wallInstance';
import Line from '../../line/line';
import Point from '../../point/point';
import { useToggleView } from '../../../../store/builder/store';
-import { Geometry } from '@react-three/csg';
+import { Base, Geometry, Subtraction } from '@react-three/csg';
+import { BoxGeometry } from 'three';
function WallInstances() {
const { walls } = useWallStore();
const { toggleView } = useToggleView();
+ const ref = useRef
();
useEffect(() => {
// console.log('walls: ', walls);
@@ -32,11 +34,24 @@ function WallInstances() {
return (
<>
-
-
+
+
+
{walls.map((wall) => (
))}
+
+ {/*
+
+
+
+
+
+
+
+
+
+ */}