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 && (