diff --git a/packages/dashboard/src/components/map-app.tsx b/packages/dashboard/src/components/map-app.tsx index 69e772269..ae52c7f20 100644 --- 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([]); const [waypoints, setWaypoints] = React.useState([]); + const [currentLevelOfRobots, setCurrentLevelOfRobots] = React.useState<{ + [key: string]: string; + }>({}); const [trajectories, setTrajectories] = React.useState([]); 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>({}); // 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) => ( - { - setOpenRobotSummary(true); - setSelectedRobot(robot); - }} - /> - ))} + robots.map((robot) => { + const robotId = `${robot.fleet}/${robot.name}`; + if (robotId in robotLocations) { + return ( + { + setOpenRobotSummary(true); + setSelectedRobot(robot); + }} + /> + ); + } + return null; + })} {openRobotSummary && selectedRobot && ( diff --git a/packages/dashboard/src/components/three-fiber/robot-three.tsx b/packages/dashboard/src/components/three-fiber/robot-three.tsx index 01cadd881..3664da179 100644 --- 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; + robotLocation: [number, number, number]; onRobotClick?: (ev: ThreeEvent, 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);