Add robot specific stop button on robot page

equinor · Nov 29, 2024 · 4d96716 · 4d96716
1 parent fa21190
commit 4d96716
Showing 1 changed file with 39 additions and 1 deletion.
diff --git a/frontend/src/components/Pages/RobotPage/RobotPage.tsx b/frontend/src/components/Pages/RobotPage/RobotPage.tsx
@@ -1,4 +1,4 @@
-import { Typography } from '@equinor/eds-core-react'
+import { Icon, Typography } from '@equinor/eds-core-react'
 import { useParams } from 'react-router-dom'
 import styled from 'styled-components'
 import { BackButton } from 'utils/BackButton'
@@ -23,6 +23,11 @@ import { VideoStreamSection } from '../MissionPage/MissionPage'
 import { useEffect, useState } from 'react'
 import { VideoStreamWindow } from '../MissionPage/VideoStream/VideoStreamWindow'
 import { MoveRobotArmSection } from './RobotArmMovement'
+import { Icons } from 'utils/icons'
+import { tokens } from '@equinor/eds-tokens'
+import { StopMissionDialog } from '../FrontPage/MissionOverview/StopDialogs'
+import { TaskType } from 'models/Task'
+import { useMissionsContext } from 'components/Contexts/MissionRunsContext'
 
 const StyledTextButton = styled(StyledButton)`
     text-align: left;
@@ -57,9 +62,22 @@ export const RobotPage = () => {
     const { enabledRobots } = useRobotContext()
     const { mediaStreams } = useMediaStreamContext()
     const [videoMediaStreams, setVideoMediaStreams] = useState<MediaStreamTrack[]>([])
+    const { ongoingMissions } = useMissionsContext()
 
     const selectedRobot = enabledRobots.find((robot) => robot.id === robotId)
 
+    const [isDialogOpen, setIsDialogOpen] = useState(false)
+    const toggleStopMissionDialog = () => {
+        setIsDialogOpen(!isDialogOpen)
+    }
+
+    const mission = ongoingMissions.find((mission) => mission.robot.id === selectedRobot?.id)
+
+    let missionTaskType = undefined
+    if (mission?.tasks.every((task) => task.type === TaskType.Inspection)) missionTaskType = TaskType.Inspection
+    if (mission?.tasks.every((task) => task.type === TaskType.ReturnHome)) missionTaskType = TaskType.ReturnHome
+    if (mission?.tasks.every((task) => task.type === TaskType.Localization)) missionTaskType = TaskType.Localization
+
     const returnRobotToHome = () => {
         if (robotId) {
             BackendAPICaller.returnRobotToHome(robotId).catch((e) => {
@@ -136,6 +154,26 @@ export const RobotPage = () => {
                         {selectedRobot.model.type === RobotType.TaurobInspector && <PressureTable />}
                         <Typography variant="h2">{TranslateText('Actions')}</Typography>
 
+                        <StyledTextButton
+                            variant="contained"
+                            onClick={() => {
+                                toggleStopMissionDialog()
+                            }}
+                        >
+                            <Icon
+                                name={Icons.StopButton}
+                                style={{ color: tokens.colors.interactive.icon_on_interactive_colors.rgba }}
+                                size={24}
+                            />
+                            {TranslateText('Stop')} {selectedRobot.name}
+                            <StopMissionDialog
+                                missionName={mission?.name}
+                                robotId={selectedRobot.id}
+                                missionTaskType={missionTaskType}
+                                isStopMissionDialogOpen={isDialogOpen}
+                                toggleDialog={toggleStopMissionDialog}
+                            />
+                        </StyledTextButton>
                         <StyledTextButton variant="outlined" onClick={returnRobotToHome}>
                             {TranslateText('Return robot to home')}
                         </StyledTextButton>