diff --git a/plugins/orchestrator/src/components/WorkflowInstancePage.tsx b/plugins/orchestrator/src/components/WorkflowInstancePage.tsx index d498665f7a..98059f89d9 100644 --- a/plugins/orchestrator/src/components/WorkflowInstancePage.tsx +++ b/plugins/orchestrator/src/components/WorkflowInstancePage.tsx @@ -35,10 +35,24 @@ export type AbortConfirmationDialogActionsProps = { handleCancel: () => void; }; +export type AbortAlertDialogActionsProps = { + handleClose: () => void; +}; + +export type AbortAlertDialogContentProps = { + message: string; +}; + const AbortConfirmationDialogContent = () => (
Are you sure you want to abort this workflow instance?
); +const AbortAlertDialogContent = (props: AbortAlertDialogContentProps) => ( +
+ The abort operation failed with the following error: {props.message} +
+); + const AbortConfirmationDialogActions = ( props: AbortConfirmationDialogActionsProps, ) => ( @@ -50,6 +64,12 @@ const AbortConfirmationDialogActions = ( ); +const AbortAlertDialogActions = (props: AbortAlertDialogActionsProps) => ( + +); + export const WorkflowInstancePage = ({ instanceId, }: { @@ -63,6 +83,9 @@ export const WorkflowInstancePage = ({ ); const [isAbortConfirmationDialogOpen, setIsAbortConfirmationDialogOpen] = useState(false); + const [isAbortAlertDialogOpen, setIsAbortAlertDialogOpen] = useState(false); + const [abortWorkflowInstanceErrorMsg, setAbortWorkflowInstanceErrorMsg] = + useState(''); const fetchInstance = React.useCallback(async () => { if (!instanceId && !queryInstanceId) { @@ -100,18 +123,18 @@ export const WorkflowInstancePage = ({ setIsAbortConfirmationDialogOpen(!isAbortConfirmationDialogOpen); }; + const toggleAbortAlertDialog = () => { + setIsAbortAlertDialogOpen(!isAbortAlertDialogOpen); + }; + const handleAbort = React.useCallback(async () => { if (value) { try { await orchestratorApi.abortWorkflow(value.instance.id); restart(); } catch (e) { - // eslint-disable-next-line no-alert - window.alert( - `The abort operation failed with the following error: ${ - (e as Error).message - }`, - ); + setAbortWorkflowInstanceErrorMsg(`${(e as Error).message}`); + setIsAbortAlertDialogOpen(true); } setIsAbortConfirmationDialogOpen(false); } @@ -155,6 +178,19 @@ export const WorkflowInstancePage = ({ } children={} /> + + } + children={ + + } + /> {!canRerun && (