Refactor restart success message component (#868)

* refactor restart action success message

* pass custom success message

* fix type

Author: Assem-Uber

src/views/workflow-actions/config/workflow-actions.config.ts

@@ -11,7 +11,7 @@ import { type RestartWorkflowResponse } from '@/route-handlers/restart-workflow/
 import { type TerminateWorkflowResponse } from '@/route-handlers/terminate-workflow/terminate-workflow.types';
 
 import getWorkflowIsCompleted from '../../workflow-page/helpers/get-workflow-is-completed';
-import WorkflowActionRestartSuccessMsg from '../workflow-action-restart-success-msg/workflow-action-restart-success-msg';
+import WorkflowActionNewRunSuccessMsg from '../workflow-action-new-run-success-msg/workflow-action-new-run-success-msg';
 import { type WorkflowAction } from '../workflow-actions.types';
 
 const workflowActionsConfig: [
@@ -75,7 +75,10 @@ const workflowActionsConfig: [
     getRunnableStatus: () => 'RUNNABLE',
     apiRoute: 'restart',
     renderSuccessMessage: (props) =>
-      createElement(WorkflowActionRestartSuccessMsg, props),
+      createElement(WorkflowActionNewRunSuccessMsg, {
+        ...props,
+        successMessage: 'Workflow has been restarted.',
+      }),
   },
 ] as const;
 

src/views/workflow-actions/workflow-action-restart-success-msg/__tests__/workflow-action-restart-success-msg.test.tsx renamed to src/views/workflow-actions/workflow-action-new-run-success-msg/__tests__/workflow-action-new-run-success-msg.test.tsx

@@ -2,9 +2,9 @@ import { render, screen } from '@testing-library/react';
 
 import { type RestartWorkflowResponse } from '@/route-handlers/restart-workflow/restart-workflow.types';
 
-import WorkflowActionRestartSuccessMsg from '../workflow-action-restart-success-msg';
+import WorkflowActionNewRunSuccessMsg from '../workflow-action-new-run-success-msg';
 
-describe('WorkflowActionRestartSuccessMsg', () => {
+describe('WorkflowActionNewRunSuccessMsg', () => {
   const mockProps = {
     result: {
       runId: 'test-run-id',
@@ -15,13 +15,14 @@ describe('WorkflowActionRestartSuccessMsg', () => {
       workflowId: 'test-workflow-id',
       runId: 'test-run-id',
     },
+    successMessage: 'Workflow has been restarted.',
   };
 
   it('renders the success message with a link', () => {
-    render(<WorkflowActionRestartSuccessMsg {...mockProps} />);
+    render(<WorkflowActionNewRunSuccessMsg {...mockProps} />);
 
     expect(
-      screen.getByText(/Workflow has been restarted[\.]/)
+      screen.getByText(new RegExp(mockProps.successMessage))
     ).toBeInTheDocument();
     expect(screen.getByText('Click here')).toBeInTheDocument();
     expect(
@@ -30,7 +31,7 @@ describe('WorkflowActionRestartSuccessMsg', () => {
   });
 
   it('renders the link with the correct href', () => {
-    render(<WorkflowActionRestartSuccessMsg {...mockProps} />);
+    render(<WorkflowActionNewRunSuccessMsg {...mockProps} />);
     const { domain, cluster, workflowId, runId } = mockProps.inputParams;
     const link = screen.getByText('Click here');
     expect(link).toHaveAttribute(

src/views/workflow-actions/workflow-action-new-run-success-msg/workflow-action-new-run-success-msg.tsx

@@ -0,0 +1,24 @@
+import Link from '@/components/link/link';
+
+import { type Props } from './workflow-action-new-run-success-msg.types';
+
+const WorkflowActionNewRunSuccessMsg = ({
+  result: { runId },
+  inputParams: { workflowId, cluster, domain },
+  successMessage,
+}: Props) => {
+  return (
+    <>
+      {successMessage}{' '}
+      <Link
+        color="contentInversePrimary"
+        href={`/domains/${domain}/${cluster}/workflows/${workflowId}/${runId}`}
+      >
+        Click here
+      </Link>{' '}
+      to view the new workflow.
+    </>
+  );
+};
+
+export default WorkflowActionNewRunSuccessMsg;

src/views/workflow-actions/workflow-action-new-run-success-msg/workflow-action-new-run-success-msg.types.tsx

@@ -0,0 +1,5 @@
+import { type WorkflowActionSuccessMessageProps } from '../workflow-actions.types';
+
+export type Props = WorkflowActionSuccessMessageProps<{ runId: string }> & {
+  successMessage: string;
+};