Display robot according to its level correctly (#824)

* Fix the bug that keeps the robot in the opposite position to its task Signed-off-by: angatupyry <fierrofenix@gmail.com> * Delete robot name from state if we can't get the current level Signed-off-by: angatupyry <fierrofenix@gmail.com> * Check if robot location is available before attempting to render (#825) Signed-off-by: Aaron Chong <aaronchongth@gmail.com> --------- Signed-off-by: angatupyry <fierrofenix@gmail.com> Signed-off-by: Aaron Chong <aaronchongth@gmail.com> Co-authored-by: Aaron Chong <aaronchongth@gmail.com>
open-rmf · Nov 2, 2023 · 6f7da8c · 6f7da8c
1 parent 3c19fe6
commit 6f7da8c
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 17 deletions.
diff --git a/packages/dashboard/src/components/map-app.tsx b/packages/dashboard/src/components/map-app.tsx
@@ -137,6 +137,9 @@ export const MapApp = styled(
     const [fleets, setFleets] = React.useState<FleetState[]>([]);
 
     const [waypoints, setWaypoints] = React.useState<Place[]>([]);
+    const [currentLevelOfRobots, setCurrentLevelOfRobots] = React.useState<{
+      [key: string]: string;
+    }>({});
 
     const [trajectories, setTrajectories] = React.useState<TrajectoryData[]>([]);
     const trajectoryTime = 300000;
@@ -288,14 +291,15 @@ export const MapApp = styled(
             ?.filter(
               (r) =>
                 fleetState.robots &&
-                fleetState.robots[r].location?.map === currentLevel.name &&
+                r in currentLevelOfRobots &&
+                currentLevelOfRobots[r] === currentLevel.name &&
                 `${fleetState.name}/${r}` in robotsStore,
             )
             .map((r) => robotsStore[`${fleetState.name}/${r}`]);
         });
         setRobots(newRobots);
       })();
-    }, [fleets, robotsStore, resourceManager, currentLevel]);
+    }, [fleets, robotsStore, resourceManager, currentLevel, currentLevelOfRobots]);
 
     const { current: robotLocations } = React.useRef<Record<string, [number, number, number]>>({});
     // updates the robot location
@@ -326,10 +330,25 @@ export const MapApp = styled(
               robotState.location.y,
               robotState.location.yaw,
             ];
+
+            if (!robotState.location.map) {
+              console.warn(`Map: Fail to update robot level for ${robotId} (missing map)`);
+              if (currentLevelOfRobots.hasOwnProperty(robotName)) {
+                const updatedState = { ...currentLevelOfRobots };
+                delete updatedState[robotName];
+                setCurrentLevelOfRobots(updatedState);
+              }
+              return;
+            }
+
+            setCurrentLevelOfRobots((prevState) => ({
+              ...prevState,
+              [robotName]: robotState.location?.map || '',
+            }));
           });
         });
       return () => sub.unsubscribe();
-    }, [rmf, robotLocations]);
+    }, [rmf, robotLocations, currentLevelOfRobots]);
 
     //Accumulate values over time to persist between tabs
     React.useEffect(() => {
@@ -531,17 +550,23 @@ export const MapApp = styled(
               />
             ))}
           {!disabledLayers['Robots'] &&
-            robots.map((robot) => (
-              <RobotThree
-                key={`${robot.name} ${robot.fleet}`}
-                robot={robot}
-                robotLocations={robotLocations}
-                onRobotClick={(_ev, robot) => {
-                  setOpenRobotSummary(true);
-                  setSelectedRobot(robot);
-                }}
-              />
-            ))}
+            robots.map((robot) => {
+              const robotId = `${robot.fleet}/${robot.name}`;
+              if (robotId in robotLocations) {
+                return (
+                  <RobotThree
+                    key={`${robot.name} ${robot.fleet}`}
+                    robot={robot}
+                    robotLocation={robotLocations[robotId]}
+                    onRobotClick={(_ev, robot) => {
+                      setOpenRobotSummary(true);
+                      setSelectedRobot(robot);
+                    }}
+                  />
+                );
+              }
+              return null;
+            })}
           <ambientLight />
         </Canvas>
         {openRobotSummary && selectedRobot && (

diff --git a/packages/dashboard/src/components/three-fiber/robot-three.tsx b/packages/dashboard/src/components/three-fiber/robot-three.tsx
@@ -5,16 +5,15 @@ import { Euler, Vector3 } from 'three';
 
 interface RobotThreeProps {
   robot: RobotData;
-  robotLocations: Record<string, [number, number, number]>;
+  robotLocation: [number, number, number];
   onRobotClick?: (ev: ThreeEvent<MouseEvent>, robot: RobotData) => void;
 }
 
-export const RobotThree = ({ robot, robotLocations, onRobotClick }: RobotThreeProps) => {
+export const RobotThree = ({ robot, robotLocation, onRobotClick }: RobotThreeProps) => {
   const STANDAR_Z_POSITION = 5;
   const CIRCLE_SEGMENT = 64;
 
   const robotId = `${robot.fleet}/${robot.name}`;
-  const robotLocation = robotLocations[robotId];
   const rotationZ = robotLocation[2] - Math.PI;
 
   const position = new Vector3(robotLocation[0], robotLocation[1], STANDAR_Z_POSITION);