Dwinzo-Beta/Dwinzo_Demo
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor: Remove deprecated API endpoints and implement new zone management features

Browse Source 
- Deleted obsolete API files for wall items, layers, lines, and points.
- Introduced new zone management APIs including create, delete, and update functionalities.
- Enhanced zone state management in the store with new properties for height and color.
- Implemented 2D and 3D zone rendering components for better visualization.
- Added asset fetching functionalities for marketplace integration.
- Updated types to accommodate new zone properties and API responses.
This commit is contained in:
Jerald-Golden-B
2025-06-27 17:51:57 +05:30
parent 812a4f6aef
commit fa6506c0be
46 changed files with 1301 additions and 1301 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/src/modules/builder/IntialLoad/loadInitialWallItems.ts
View File

@@ -2,7 +2,7 @@
// import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader";
// import * as THREE from "three";
// import * as Types from "../../../types/world/worldTypes";
// import { getWallItems } from "../../../services/factoryBuilder/assest/wallAsset/getWallItemsApi";
// import { getWallItems } from "../../../services/factoryBuilder/asset/wallAsset/getWallItemsApi";
// import { retrieveGLTF, storeGLTF } from "../../../utils/indexDB/idbUtils";
// import { getUserData } from "../../../functions/getUserData";

2
app/src/modules/builder/asset/assetsGroup.tsx
View File

@@ -1,6 +1,6 @@
import * as THREE from "three"
import { useEffect } from 'react'
import { getFloorAssets } from '../../../services/factoryBuilder/assest/floorAsset/getFloorItemsApi';
import { getFloorAssets } from '../../../services/factoryBuilder/asset/floorAsset/getFloorItemsApi';
import { useLoadingProgress, useRenameModeStore, useSelectedFloorItem, useSelectedItem, useSocketStore } from '../../../store/builder/store';
import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader";

2
app/src/modules/builder/asset/functions/addAssetModel.ts
View File

@@ -3,7 +3,7 @@ import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader";
import * as Types from "../../../../types/world/worldTypes";
import { retrieveGLTF, storeGLTF } from "../../../../utils/indexDB/idbUtils";
// import { setAssetsApi } from '../../../../services/factoryBuilder/assest/floorAsset/setAssetsApi';
// import { setAssetsApi } from '../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi';
import { Socket } from "socket.io-client";
import * as CONSTANTS from "../../../../types/world/worldConstants";
import PointsCalculator from "../../../simulation/events/points/functions/pointsCalculator";

39
app/src/modules/builder/builder.tsx
View File

@@ -24,7 +24,7 @@ import * as Types from "../../types/world/worldTypes";
import SocketResponses from "../collaboration/socket/socketResponses.dev";
import Ground from "../scene/environment/ground";
import { findEnvironment } from "../../services/factoryBuilder/environment/findEnvironment";
import ZoneGroup from "./groups/zoneGroup";
import MeasurementTool from "../scene/tools/measurementTool";
import NavMesh from "../simulation/vehicle/navMesh/navMesh";
import CalculateAreaGroup from "./groups/calculateAreaGroup";
@@ -34,21 +34,19 @@ import DxfFile from "./dfx/LoadBlueprint";
import AislesGroup from "./aisle/aislesGroup";
import WallGroup from "./wall/wallGroup";
import FloorGroup from "./floor/floorGroup";
import ZoneGroup from "./zone/zoneGroup";
import { useParams } from "react-router-dom";
import { useBuilderStore } from "../../store/builder/useBuilderStore";
import { getUserData } from "../../functions/getUserData";
export default function Builder() {
const state = useThree<Types.ThreeState>(); // Importing the state from the useThree hook, which contains the scene, camera, and other Three.js elements.
const dragPointControls = useRef() as Types.RefDragControl; // Reference for drag point controls, an array for drag control.
// Assigning the scene and camera from the Three.js state to the references.
const plane = useRef<THREE.Mesh>(null); // Reference for a plane object for raycaster reference.
const grid = useRef() as any; // Reference for a grid object for raycaster reference.
const floorPlanGroupLine = useRef() as Types.RefGroup; // Reference for a THREE.Group that has the lines that are drawn.
const floorPlanGroupPoint = useRef() as Types.RefGroup; // Reference for a THREE.Group that has the points that are created.
const currentLayerPoint = useRef([]) as Types.RefMeshArray; // Reference for points that re in the current layer used to update the points in drag controls.
const { toggleView } = useToggleView(); // State for toggling between 2D and 3D.
const { setToolMode } = useToolMode();
@@ -111,28 +109,25 @@ export default function Builder() {
hoveredDeletableWallItem={hoveredDeletableWallItem}
/> */}
<Bvh firstHitOnly>
<AssetsGroup plane={plane} />
<ZoneGroup />
<AssetsGroup plane={plane} />
<AislesGroup />
<MeasurementTool />
<CalculateAreaGroup />
<NavMesh />
<DxfFile />
<LayoutImage />
</Bvh>
<AislesGroup />
<WallGroup />
<FloorGroup />
<ZoneGroup />
<MeasurementTool />
<CalculateAreaGroup />
<NavMesh />
<DxfFile />
<LayoutImage />
</>
);
}

1
app/src/modules/builder/floor/Instances/Instance/floor2DInstance.tsx
View File

@@ -32,7 +32,6 @@ function Floor2DInstance({ floor }: { floor: Floor }) {
name={`Floor-${floor.floorUuid}`}
args={[shape, {
depth: Constants.floorConfig.height,
bevelEnabled: floor.isBeveled,
}]}
userData={floor}
>

1302
app/src/modules/builder/groups/zoneGroup.tsx
View File

File diff suppressed because it is too large Load Diff

2
app/src/modules/builder/wall/Instances/wallInstances.tsx
View File

@@ -17,7 +17,7 @@ import texturePathDark from "../../../../assets/textures/floor/black.png";
function WallInstances() {
const { wallStore } = useSceneContext();
const { walls } = wallStore();
const { rooms } = useWallClassification(walls)
const { rooms } = useWallClassification(walls);
const { toggleView } = useToggleView();
useEffect(() => {

50
app/src/modules/builder/zone/Instances/Instance/zone2DInstance.tsx Normal file
View File

@@ -0,0 +1,50 @@
import { useMemo } from 'react';
import { DoubleSide, Shape, Vector2 } from 'three';
import { Extrude } from '@react-three/drei';
import * as Constants from '../../../../../types/world/worldConstants';
function Zone2DInstance({ zone }: { zone: Zone }) {
const savedTheme: string | null = localStorage.getItem("theme");
const shape = useMemo(() => {
const shape = new Shape();
const points = zone.points.map(p => new Vector2(p.position[0], p.position[2]));
if (points.length < 3) return null;
shape.moveTo(points[0].x, points[0].y);
for (let i = 1; i < points.length; i++) {
shape.lineTo(points[i].x, points[i].y);
}
return shape;
}, [zone]);
if (!shape) return null;
return (
<mesh
castShadow
receiveShadow
name={`Zone-2D-${zone.zoneUuid}`}
rotation={[Math.PI / 2, 0, 0]}
position={[0, 0, 0]}
userData={zone}
>
<Extrude
name={`Zone-${zone.zoneUuid}`}
args={[shape, {
depth: Constants.floorConfig.height,
}]}
userData={zone}
>
<meshBasicMaterial
color={savedTheme === "dark" ? "green" : "green"}
side={DoubleSide}
transparent
opacity={0.4}
depthWrite={false}
/>
</Extrude>
</mesh>
);
}
export default Zone2DInstance;

73
app/src/modules/builder/zone/Instances/Instance/zoneInstance.tsx Normal file
View File

@@ -0,0 +1,73 @@
import { useMemo } from 'react'
import { Color, DoubleSide, ShaderMaterial } from 'three';
import { Vector3 } from 'three';
function ZoneInstance({ zone }: { zone: Zone }) {
const zoneLayer = zone.points[0].layer;
const zoneMaterial = useMemo(() => {
return new ShaderMaterial({
side: DoubleSide,
vertexShader: `
varying vec2 vUv;
void main(){
gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
vUv = uv;
}
`,
fragmentShader: `
varying vec2 vUv;
uniform vec3 uOuterColor;
void main(){
float alpha = 1.0 - vUv.y;
gl_FragColor = vec4(uOuterColor, alpha);
}
`,
uniforms: {
uOuterColor: { value: new Color(zone.zoneColor) },
},
transparent: true,
depthWrite: false,
})
}, []);
return (
<>
<mesh
name={`Zone-${zone.zoneUuid}`}
userData={zone}
>
{zone.points.slice(0, -1).map((point, index: number) => {
const nextPoint = zone.points[index + 1];
const point1 = new Vector3(point.position[0], point.position[1], point.position[2]);
const point2 = new Vector3(nextPoint.position[0], nextPoint.position[1], nextPoint.position[2]);
const planeWidth = point1.distanceTo(point2);
const planeHeight = zone.zoneHeight;
const midpoint = new Vector3((point1.x + point2.x) / 2, zone.zoneHeight / 2 + (zoneLayer - 1) * zone.zoneHeight, (point1.z + point2.z) / 2);
const angle = Math.atan2(point2.z - point1.z, point2.x - point1.x);
return (
<mesh
key={index}
position={midpoint}
rotation={[0, -angle, 0]}
>
<planeGeometry args={[planeWidth, planeHeight]} />
<primitive
object={zoneMaterial.clone()}
attach="material"
/>
</mesh>
);
})}
</ mesh>
</>
)
}
export default ZoneInstance

132
app/src/modules/builder/zone/Instances/zoneInstances.tsx Normal file
View File

@@ -0,0 +1,132 @@
import React, { useEffect, useMemo } from 'react';
import { Vector3 } from 'three';
import { Html } from '@react-three/drei';
import { useSceneContext } from '../../../scene/sceneContext';
import { useToggleView } from '../../../../store/builder/store';
import Line from '../../line/line';
import Point from '../../point/point';
import ZoneInstance from './Instance/zoneInstance';
import Zone2DInstance from './Instance/zone2DInstance';
function ZoneInstances() {
const { zoneStore } = useSceneContext();
const { zones } = zoneStore();
const { toggleView } = useToggleView();
useEffect(() => {
console.log('zones: ', zones);
}, [zones]);
const allPoints = useMemo(() => {
const points: Point[] = [];
const seenUuids = new Set<string>();
zones.forEach(zone => {
zone.points.forEach(point => {
if (!seenUuids.has(point.pointUuid)) {
seenUuids.add(point.pointUuid);
points.push(point);
}
});
});
return points;
}, [zones]);
const allLines = useMemo(() => {
const lines: { start: Point; end: Point; key: string }[] = [];
const seenUuids = new Set<string>();
zones.forEach((zone) => {
const points = zone.points;
if (points.length < 2) return;
for (let i = 0; i < points.length; i++) {
const current = points[i];
const next = points[(i + 1) % points.length];
const lineKey = `${current.pointUuid}-${next.pointUuid}`;
if (current.pointUuid !== next.pointUuid && !seenUuids.has(lineKey)) {
seenUuids.add(lineKey);
lines.push({
start: current,
end: next,
key: lineKey
});
}
}
});
return lines;
}, [zones]);
return (
<>
{!toggleView && zones.length > 0 && (
<mesh name='Zones-Group'>
{zones.map((zone) => (
<ZoneInstance key={zone.zoneUuid} zone={zone} />
))}
</mesh>
)}
{toggleView && zones.length > 0 && (
<mesh name='Zones-2D-Group'>
{zones.map((zone) => (
<Zone2DInstance key={zone.zoneUuid} zone={zone} />
))}
</mesh>
)}
{toggleView && (
<>
<group name='Zone-Points-Group'>
{allPoints.map((point) => (
<Point key={point.pointUuid} point={point} />
))}
</group>
<group name='Zone-Lines-Group'>
{allLines.map(({ start, end, key }) => (
<Line key={key} points={[start, end]} />
))}
{allLines.map((line) => {
const { start, end, key } = line;
const textPosition = new Vector3().addVectors(new Vector3(...start.position), new Vector3(...end.position)).divideScalar(2);
const distance = new Vector3(...start.position).distanceTo(new Vector3(...end.position));
return (
<React.Fragment key={key}>
{toggleView &&
<Html
key={`${start.pointUuid}_${end.pointUuid}`}
userData={line}
position={[textPosition.x, 1, textPosition.z]}
wrapperClass="distance-text-wrapper"
className="distance-text"
zIndexRange={[1, 0]}
prepend
sprite
>
<div
key={key}
className={`distance ${key}`}
>
{distance.toFixed(2)} m
</div>
</Html>
}
</React.Fragment>
)
})}
</group>
</>
)}
</>
)
}
export default ZoneInstances

10
app/src/modules/builder/zone/zoneCreator/zoneCreator.tsx Normal file
View File

@@ -0,0 +1,10 @@
import React from 'react'
function ZoneCreator() {
return (
<>
</>
)
}
export default ZoneCreator

54
app/src/modules/builder/zone/zoneGroup.tsx Normal file
View File

@@ -0,0 +1,54 @@
import { useEffect } from 'react';
import { useToggleView } from '../../../store/builder/store';
import { useBuilderStore } from '../../../store/builder/useBuilderStore';
import { useVersionContext } from '../version/versionContext';
import { useSceneContext } from '../../scene/sceneContext';
import { useParams } from 'react-router-dom';
import useModuleStore from '../../../store/useModuleStore';
import ZoneCreator from './zoneCreator/zoneCreator';
import ZoneInstances from './Instances/zoneInstances';
import { getZonesApi } from '../../../services/factoryBuilder/zone/getZonesApi';
function ZoneGroup() {
const { togglView } = useToggleView();
const { setSelectedZone } = useBuilderStore();
const { activeModule } = useModuleStore();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const { zoneStore } = useSceneContext();
const { setZones } = zoneStore();
const { projectId } = useParams();
useEffect(() => {
if (togglView || activeModule !== 'builder') {
setSelectedZone(null);
}
}, [togglView, activeModule])
useEffect(() => {
if (projectId && selectedVersion) {
getZonesApi(projectId, selectedVersion?.versionId || '').then((zones) => {
if (zones && zones.length > 0) {
setZones(zones);
} else {
setZones([]);
}
}).catch((err) => {
console.log(err);
})
}
}, [projectId, selectedVersion?.versionId])
return (
<>
<ZoneCreator />
<ZoneInstances />
</>
)
}
export default ZoneGroup

2
app/src/modules/market/MarketPlace.tsx
View File

@@ -1,7 +1,7 @@
import React, { useEffect, useState } from "react";
import FilterSearch from "./FilterSearch";
import CardsContainer from "./CardsContainer";
import { getAssetImages } from "../../services/factoryBuilder/assest/assets/getAssetImages";
import { getAssetImages } from "../../services/factoryBuilder/asset/assets/getAssetImages";
import SkeletonUI from "../../components/templates/SkeletonUI";
interface ModelData {
CreatedBy: string;

2
app/src/modules/scene/controls/selectionControls/copyPasteControls.tsx
View File

@@ -2,7 +2,7 @@ import * as THREE from "three";
import { useEffect, useMemo } from "react";
import { useFrame, useThree } from "@react-three/fiber";
import { useSelectedAssets, useSocketStore, useToggleView } from "../../../../store/builder/store";
// import { setAssetsApi } from '../../../../services/factoryBuilder/assest/floorAsset/setAssetsApi';
// import { setAssetsApi } from '../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi';
import * as Types from "../../../../types/world/worldTypes";
import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";
import { useParams } from "react-router-dom";

2
app/src/modules/scene/controls/selectionControls/duplicationControls.tsx
View File

@@ -2,7 +2,7 @@ import * as THREE from "three";
import { useEffect, useMemo } from "react";
import { useFrame, useThree } from "@react-three/fiber";
import { useSelectedAssets, useSocketStore, useToggleView } from "../../../../store/builder/store";
// import { setAssetsApi } from '../../../../services/factoryBuilder/assest/floorAsset/setAssetsApi';
// import { setAssetsApi } from '../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi';
import * as Types from "../../../../types/world/worldTypes";
import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";
import { useParams } from "react-router-dom";

2
app/src/modules/scene/controls/selectionControls/moveControls.tsx
View File

@@ -2,7 +2,7 @@ import * as THREE from "three";
import { useEffect, useMemo, useRef, useState } from "react";
import { useFrame, useThree } from "@react-three/fiber";
import { useSelectedAssets, useSocketStore, useToggleView, } from "../../../../store/builder/store";
// import { setAssetsApi } from '../../../../services/factoryBuilder/assest/floorAsset/setAssetsApi';
// import { setAssetsApi } from '../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi';
import * as Types from "../../../../types/world/worldTypes";
import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";
import { upsertProductOrEventApi } from "../../../../services/simulation/products/UpsertProductOrEventApi";

2
app/src/modules/scene/controls/selectionControls/rotateControls.tsx
View File

@@ -2,7 +2,7 @@ import * as THREE from "three";
import { useEffect, useMemo, useRef } from "react";
import { useFrame, useThree } from "@react-three/fiber";
import { useSelectedAssets, useSocketStore, useToggleView } from "../../../../store/builder/store";
// import { setAssetsApi } from '../../../../services/factoryBuilder/assest/floorAsset/setAssetsApi';
// import { setAssetsApi } from '../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi';
import * as Types from "../../../../types/world/worldTypes";
import { upsertProductOrEventApi } from "../../../../services/simulation/products/UpsertProductOrEventApi";
import { useParams } from "react-router-dom";

2
app/src/modules/scene/controls/selectionControls/selectionControls.tsx
View File

@@ -5,7 +5,7 @@ import { SelectionHelper } from "./selectionHelper";
import { useFrame, useThree } from "@react-three/fiber";
import { useSelectedAssets, useSocketStore, useToggleView, useToolMode, } from "../../../../store/builder/store";
import BoundingBox from "./boundingBoxHelper";
// import { deleteFloorItem } from '../../../../services/factoryBuilder/assest/floorAsset/deleteFloorItemApi';
// import { deleteFloorItem } from '../../../../services/factoryBuilder/asset/floorAsset/deleteFloorItemApi';
import * as Types from "../../../../types/world/worldTypes";
import DuplicationControls from "./duplicationControls";

2
app/src/modules/scene/controls/transformControls/transformControls.tsx
View File

@@ -6,7 +6,7 @@ import { useThree } from "@react-three/fiber";
import { useEffect, useState } from "react";
import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";
import { upsertProductOrEventApi } from "../../../../services/simulation/products/UpsertProductOrEventApi";
// import { setAssetsApi } from "../../../../services/factoryBuilder/assest/floorAsset/setAssetsApi";
// import { setAssetsApi } from "../../../../services/factoryBuilder/asset/floorAsset/setAssetsApi";
import { useParams } from "react-router-dom";
import { useProductContext } from "../../../simulation/products/productContext";
import { getUserData } from "../../../../functions/getUserData";