"updated single flow"

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

@@ -1,10 +1,11 @@
-import React, { useEffect, useState, useRef } from "react";
+import React, { useEffect, useState, useRef, useMemo } from "react";
 import * as THREE from "three";
 import { useFrame, useThree } from "@react-three/fiber";
 import { NavMeshQuery } from "@recast-navigation/core";
 import { Line } from "@react-three/drei";
 import { usePlayButtonStore } from "../../../store/usePlayButtonStore";
 import { usePlayAgv } from "../../../store/store";
+import crate from "../../../assets/gltf-glb/crate_box.glb";
 
 interface PathNavigatorProps {
   navMesh: any;
@@ -15,6 +16,7 @@ interface PathNavigatorProps {
   hitCount: number;
   processes: any[];
   agvRef: any;
+  MaterialRef: any;
 }
 interface AGVData {
   processId: string;
@@ -23,7 +25,7 @@ interface AGVData {
   totalHits: number;
 }
 type Phase = "initial" | "toDrop" | "toPickup";
-
+type MaterialType = "Box" | "Crate";
 export default function PathNavigator({
   navMesh,
   pathPoints,
@@ -33,11 +35,13 @@ export default function PathNavigator({
   hitCount,
   processes,
   agvRef,
+  MaterialRef,
 }: PathNavigatorProps) {
   const [currentPhase, setCurrentPhase] = useState<Phase>("initial");
-  // console.log('agvRef: ', agvRef);
+  //
 
   const [path, setPath] = useState<[number, number, number][]>([]);
+  const PickUpDrop = useRef([]);
 
   // const [currentPhase, setCurrentPhase] = useState<"initial" | "loop">(
   //   "initial"
@@ -45,6 +49,7 @@ export default function PathNavigator({
   const [toPickupPath, setToPickupPath] = useState<[number, number, number][]>(
     []
   );
+
   const [pickupDropPath, setPickupDropPath] = useState<
     [number, number, number][]
   >([]);
@@ -57,6 +62,7 @@ export default function PathNavigator({
   const [initialRotation, setInitialRotation] = useState<THREE.Euler | null>(
     null
   );
+  const [boxVisible, setBoxVisible] = useState(false);
 
   const distancesRef = useRef<number[]>([]);
   const totalDistanceRef = useRef(0);
@@ -123,6 +129,9 @@ export default function PathNavigator({
     if (!navMesh || pathPoints.length < 2) return;
 
     const [pickup, drop] = pathPoints.slice(-2);
+
+    PickUpDrop.current = pathPoints.slice(-2);
+
     const object = scene.getObjectByProperty("uuid", id);
 
     if (!object) return;
@@ -171,13 +180,101 @@ export default function PathNavigator({
   // Add these refs outside the useFrame if not already present:
   const startPointReached = useRef(false);
 
+  const baseMaterials = useMemo(
+    () => ({
+      Box: new THREE.MeshStandardMaterial({ color: 0x8b4513 }),
+      Crate: new THREE.MeshStandardMaterial({ color: 0x00ff00 }),
+      // Default: new THREE.MeshStandardMaterial({ color: 0x00ff00 }),
+      Default: new THREE.MeshStandardMaterial(),
+    }),
+    []
+  );
+
+  // Example usage:
+  const targetModelUUID = id; // Replace with your target ID
+  const matchedProcess = findProcessByTargetModelUUID(
+    processes,
+    targetModelUUID
+  );
+
+  function findProcessByTargetModelUUID(processes: any, targetModelUUID: any) {
+    for (const process of processes) {
+      for (const path of process.paths) {
+        for (const point of path.points) {
+          if (
+            point.connections?.targets?.some(
+              (target: any) => target.modelUUID === targetModelUUID
+            )
+          ) {
+            //
+            return process.id; // Return the process if a match is found
+          }
+        }
+      }
+    }
+    return null; // Return null if no match is found
+  }
+
   useFrame((_, delta) => {});
+  const boxRef = useRef<THREE.Mesh | null>(null);
+
+  useEffect(() => {
+    if (!scene || !boxRef || !processes) return;
+
+    // 1. Find the existing object by UUID
+    const existingObject = scene.getObjectByProperty("uuid", id);
+    if (!existingObject) return;
+
+    // 2. Find the process that targets this object's modelUUID
+    if (boxVisible) {
+      const matchedProcess = findProcessByTargetModelUUID(processes, id);
+
+      // 3. Determine the material (from materialref) if a process is matched
+      let materialType = "Default";
+
+      if (matchedProcess) {
+        const materialEntry = MaterialRef.current.find((item: any) =>
+          item.objects.some((obj: any) => obj.processId === matchedProcess)
+        );
+        console.log("materialEntry: ", materialEntry);
+        if (materialEntry) {
+          materialType = materialEntry.material; // "Box" or "Crate"
+        }
+      }
+
+      // 4. Create the box mesh with the assigned material
+      const boxGeometry = new THREE.BoxGeometry(0.5, 0.5, 0.5);
+      const boxMaterial = baseMaterials[materialType as MaterialType];
+      const boxMesh = new THREE.Mesh(boxGeometry, boxMaterial);
+      boxMesh.position.y = 1;
+      boxMesh.name = `box-${id}`;
+
+      // 5. Add to scene and cleanup
+      existingObject.add(boxMesh);
+      boxRef.current = boxMesh;
+    }
+
+    if (!startPointReached.current && boxVisible) {
+      setBoxVisible(false);
+    }
+    return () => {
+      if (boxRef.current?.parent) {
+        boxRef.current.parent.remove(boxRef.current);
+      }
+      boxRef.current = null;
+    };
+  }, [
+    processes,
+    MaterialRef,
+    boxVisible,
+    findProcessByTargetModelUUID,
+    startPointReached,
+  ]);
 
   useFrame((_, delta) => {
     const currentAgv = (agvRef.current || []).find(
       (agv: AGVData) => agv.vehicleId === id
     );
-    console.log("currentAgv: ", currentAgv?.isplaying);
 
     if (!scene || !id || !isPlaying) return;
 
@@ -203,6 +300,7 @@ export default function PathNavigator({
 
     // Step 1: Snap to start point on first play
     if (isPlaying && !hasStarted.current && toPickupPath.length > 0) {
+      setBoxVisible(false);
       const startPoint = new THREE.Vector3(...toPickupPath[0]);
       object.position.copy(startPoint);
 
@@ -216,23 +314,23 @@ export default function PathNavigator({
       startPointReached.current = true;
       progressRef.current = 0;
 
+      setToPickupPath(toPickupPath.slice(-1));
+
       return;
     }
 
-    // Step 2: Wait at start point for AGV readiness (only if expected hit count is not met)
-    if (
-      isPlaying &&
-      startPointReached.current &&
-      path.length === 0 &&
-      currentAgv?.isplaying
-    ) {
+    // Step 2: Wait at start point for AGV readiness
+    if (isPlaying && startPointReached.current && path.length === 0) {
       if (!isAgvReady()) {
         return; // Prevent transitioning to the next phase if AGV is not ready
       }
 
+      setBoxVisible(true);
+
       setPath([...toPickupPath]); // Start path transition once the AGV is ready
       setCurrentPhase("toDrop");
       progressRef.current = 0;
+      console.log("startPointReached: ", startPointReached.current);
       startPointReached.current = false;
 
       return;
@@ -283,12 +381,44 @@ export default function PathNavigator({
         if (currentPhase === "toDrop") {
           nextPath = dropPickupPath;
           nextPhase = "toPickup";
+          setBoxVisible(false);
         } else if (currentPhase === "toPickup") {
-          nextPath = pickupDropPath;
-          nextPhase = "toDrop";
+          // When returning to start point (toPickup phase completed)
+          // Set position to toPickupPath[1] instead of [0]
+          if (toPickupPath.length > 1) {
+            object.position.copy(new THREE.Vector3(...toPickupPath[1]));
+            // Also set rotation towards the next point if available
+            if (toPickupPath.length > 2) {
+              const nextPoint = new THREE.Vector3(...toPickupPath[2]);
+              const direction = nextPoint
+                .clone()
+                .sub(object.position)
+                .normalize();
+              object.rotation.y = Math.atan2(direction.x, direction.z);
+            }
+          }
+
+          // Reset the path and mark start point as reached
+          setPath([]);
+          startPointReached.current = true;
+          progressRef.current = 0;
+          distancesRef.current = [];
+
+          // Stop the AGV by setting isplaying to false
+          if (currentAgv) {
+            currentAgv.isplaying = false;
+          }
+
+          // Clear timeout and return to prevent further movement
+          if (timeoutRef.current) {
+            clearTimeout(timeoutRef.current);
+            timeoutRef.current = null;
+          }
+          return;
         } else {
           nextPath = pickupDropPath;
           nextPhase = "toDrop";
+          setBoxVisible(true);
         }
 
         setPath([...nextPath]);
@@ -297,28 +427,12 @@ export default function PathNavigator({
         isWaiting.current = false;
         distancesRef.current = [];
 
-        // Decrease the expected count if AGV is ready and has completed its path
-        if (currentAgv) {
-          currentAgv.expectedCount = Math.max(0, currentAgv.expectedCount - 1); // Decrease but ensure it's not negative
-          console.log(
-            "Decreased expected count to: ",
-            currentAgv.expectedCount
-          );
-        }
-
+        // Reset hit count for the next cycle
         if (agvRef.current) {
           agvRef.current = agvRef.current.map((agv: AGVData) =>
-            agv.vehicleId === id ? { ...agv, hitCount: null } : agv
+            agv.vehicleId === id ? { ...agv, hitCount: 0 } : agv
           );
         }
-
-        // 🔁 Reset and wait again after reaching start
-        if (currentPhase === "toPickup" && currentAgv) {
-          currentAgv.isplaying = false;
-          setPath([]);
-          startPointReached.current = true;
-          progressRef.current = 0;
-        }
       }, bufferTime * 1000);
 
       return;