2025-06-04 09:49:37 +00:00
|
|
|
import React, { useEffect } from 'react';
|
2025-06-04 04:53:22 +00:00
|
|
|
import { useWallStore } from '../../../../store/builder/useWallStore'
|
|
|
|
import WallInstance from './instance/wallInstance';
|
2025-06-04 09:49:37 +00:00
|
|
|
import Line from '../../line/line';
|
|
|
|
import Point from '../../point/point';
|
|
|
|
import { useToggleView } from '../../../../store/builder/store';
|
|
|
|
import { Geometry } from '@react-three/csg';
|
2025-06-04 04:53:22 +00:00
|
|
|
|
|
|
|
function WallInstances() {
|
|
|
|
const { walls } = useWallStore();
|
2025-06-04 09:49:37 +00:00
|
|
|
const { toggleView } = useToggleView();
|
2025-06-04 04:53:22 +00:00
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
// console.log('walls: ', walls);
|
|
|
|
}, [walls])
|
|
|
|
|
|
|
|
return (
|
|
|
|
<>
|
2025-06-04 09:49:37 +00:00
|
|
|
|
|
|
|
<Geometry computeVertexNormals useGroups>
|
|
|
|
{walls.map((wall) => (
|
|
|
|
<WallInstance key={wall.wallUuid} wall={wall} />
|
|
|
|
))}
|
|
|
|
</Geometry>
|
|
|
|
|
|
|
|
|
|
|
|
{toggleView && (
|
|
|
|
<>
|
|
|
|
{walls.map((wall) => (
|
|
|
|
<React.Fragment key={wall.wallUuid}>
|
|
|
|
<Point point={wall.points[0]} />
|
|
|
|
<Line points={wall.points} />
|
|
|
|
<Point point={wall.points[1]} />
|
|
|
|
</React.Fragment>
|
|
|
|
))}
|
|
|
|
</>
|
|
|
|
)}
|
2025-06-04 04:53:22 +00:00
|
|
|
</>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
export default WallInstances
|