Add MQTT URL to environment variables and refactor simulation components

app/src/modules/builder/agv/navMeshDetails.tsx

@@ -34,15 +34,11 @@ export default function NavMeshDetails({
 
         const [positions, indices] = getPositionsAndIndices(meshes);
 
-        const cs = 0.5;
+        const cs = 0.25;
         const ch = 0.5;
-        const walkableRadius = 0.89;
+        const walkableRadius = 0.5;
 
-        const { success, navMesh } = generateSoloNavMesh(positions, indices, {
-          cs,
-          ch,
-          walkableRadius: Math.round(walkableRadius / ch),
-        });
+        const { success, navMesh } = generateSoloNavMesh(positions, indices, { cs, ch, walkableRadius: Math.round(walkableRadius / ch), });
 
         if (!success || !navMesh) {
           return;
@@ -53,7 +49,7 @@ export default function NavMeshDetails({
         const debugDrawer = new DebugDrawer();
         debugDrawer.drawNavMesh(navMesh);
         // scene.add(debugDrawer);
-      } catch (error) {}
+      } catch (error) { }
     };
 
     initializeNavigation();

app/src/modules/builder/agv/pathNavigator.tsx

@@ -86,7 +86,7 @@ export default function PathNavigator({
 
   return (
     <>
-      {path.length > 0 && <Line points={path} color="blue" lineWidth={3} />}
+      {/* {path.length > 0 && <Line points={path} color="blue" lineWidth={3} />} */}
       {path.length > 0 && (
         <mesh ref={meshRef} position={path.length > 0 ? path[0] : [0, 0.1, 0]}>
           <boxGeometry args={[1, 1, 1]} />

app/src/modules/builder/agv/polygonGenerator.tsx

@@ -43,66 +43,46 @@ export default function PolygonGenerator({
 
     const lineFeatures = result?.map((line: any) =>
       turf.lineString(line.map((p: any) => p?.position))
-    );
+  );
 
     const polygons = turf.polygonize(turf.featureCollection(lineFeatures));
     renderWallGeometry(wallPoints);
 
-    let union: any = [];
+    if (polygons.features.length > 1) {
+      polygons.features.forEach((feature) => {
+        if (feature.geometry.type === "Polygon") {
 
-    polygons.features.forEach((feature) => {
-      union.push(feature);
-    });
+          const shape = new THREE.Shape();
+          const coords = feature.geometry.coordinates[0];
 
-    if (union.length > 1) {
-      const unionResult = turf.union(turf.featureCollection(union));
+          shape.moveTo(coords[0][0], coords[0][1]);
 
-      if (unionResult?.geometry.type === "MultiPolygon") {
-        unionResult.geometry.coordinates.forEach((poly) => {
-          const coordinates = poly[0].map(([x, z]) => {
-            return new THREE.Vector3(x, 0, z);
-          });
-          renderBoxGeometry(coordinates);
-        });
-      } else if (unionResult?.geometry.type === "Polygon") {
-        const coordinates = unionResult.geometry.coordinates[0].map(
-          ([x, z]) => {
-            return new THREE.Vector3(x, 0, z);
+          for (let i = 1; i < coords.length; i++) {
+            shape.lineTo(coords[i][0], coords[i][1]);
           }
-        );
-        renderBoxGeometry(coordinates);
-      }
-    } else if (union.length === 1) {
-      const coordinates = union[0].geometry.coordinates[0].map(
-        ([x, z]: [number, number]) => {
-          return new THREE.Vector3(x, 0, z);
+          shape.lineTo(coords[0][0], coords[0][1]);
+
+          const extrudeSettings = {
+            depth: 5,
+            bevelEnabled: false,
+          };
+
+          const geometry = new THREE.ExtrudeGeometry(shape, extrudeSettings);
+
+          const material = new THREE.MeshBasicMaterial({ color: "blue", transparent: true, opacity: 0.5 });
+          const mesh = new THREE.Mesh(geometry, material);
+          mesh.rotateX(Math.PI / 2);
+          mesh.name = "agv-collider";
+          mesh.position.y = 5;
+
+          mesh.receiveShadow = true;
+          groupRef.current?.add(mesh);
         }
-      );
-      // setRooms((prevRooms) => [...prevRooms, coordinates]);
+      });
+
     }
   }, [lines.current]);
 
-  const renderBoxGeometry = (coordinates: THREE.Vector3[]) => {
-    const minX = Math.min(...coordinates.map((p) => p.x));
-    const maxX = Math.max(...coordinates.map((p) => p.x));
-    const minZ = Math.min(...coordinates.map((p) => p.z));
-    const maxZ = Math.max(...coordinates.map((p) => p.z));
-
-    const width = maxX - minX;
-    const depth = maxZ - minZ;
-    const height = 3;
-
-    const geometry = new THREE.BoxGeometry(width, height, depth);
-    const material = new THREE.MeshBasicMaterial({
-      color: "#ff66cc",
-      visible: false,
-    });
-
-    const mesh = new THREE.Mesh(geometry, material);
-    mesh.position.set((minX + maxX) / 2, height / 2, (minZ + maxZ) / 2);
-    groupRef.current?.add(mesh);
-  };
-
   const renderWallGeometry = (walls: THREE.Vector3[][]) => {
     walls.forEach((wall) => {
       if (wall.length < 2) return;