From 74fba0c219c397de1131be03d3338aa56f8352bf Mon Sep 17 00:00:00 2001
From: Adhitya Mamallan <adhitya.mamallan@uber.com>
Date: Thu, 16 Jan 2025 12:42:13 +0100
Subject: [PATCH] Move workflow actions to dedicated view (#791)

* Move workflow actions to separate view
---
 .../__fixtures__/workflow-actions-config.ts    |  4 ++--
 .../__tests__/workflow-actions.test.tsx}       | 17 +++++++++--------
 .../config/workflow-actions.config.ts}         |  9 +++++----
 .../__tests__/workflow-actions-menu.test.tsx}  | 15 ++++++++-------
 .../workflow-actions-menu.styles.ts}           |  0
 .../workflow-actions-menu.tsx}                 | 10 +++++-----
 .../workflow-actions-menu.types.ts             |  8 ++++++++
 .../__tests__/workflow-actions-modal.test.tsx} | 13 +++++++------
 .../workflow-actions-modal.styles.ts}          |  0
 .../workflow-actions-modal.tsx}                |  6 +++---
 .../workflow-actions.styles.ts}                |  0
 .../workflow-actions.tsx}                      | 18 +++++++++---------
 .../workflow-actions.types.ts}                 |  5 -----
 .../workflow-page-actions-button.types.ts      |  6 ------
 .../__tests__/workflow-page-tabs.test.tsx      |  5 ++---
 .../workflow-page-tabs/workflow-page-tabs.tsx  |  4 ++--
 16 files changed, 60 insertions(+), 60 deletions(-)
 rename src/views/{workflow-page => workflow-actions}/__fixtures__/workflow-actions-config.ts (75%)
 rename src/views/{workflow-page/workflow-page-actions-button/__tests__/workflow-page-actions-button.test.tsx => workflow-actions/__tests__/workflow-actions.test.tsx} (82%)
 rename src/views/{workflow-page/config/workflow-page-actions.config.ts => workflow-actions/config/workflow-actions.config.ts} (71%)
 rename src/views/{workflow-page/workflow-page-actions-menu/__tests__/workflow-page-actions-menu.test.tsx => workflow-actions/workflow-actions-menu/__tests__/workflow-actions-menu.test.tsx} (78%)
 rename src/views/{workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.styles.ts => workflow-actions/workflow-actions-menu/workflow-actions-menu.styles.ts} (100%)
 rename src/views/{workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.tsx => workflow-actions/workflow-actions-menu/workflow-actions-menu.tsx} (69%)
 create mode 100644 src/views/workflow-actions/workflow-actions-menu/workflow-actions-menu.types.ts
 rename src/views/{workflow-page/workflow-page-actions-modal/__tests__/workflow-page-actions-modal.test.tsx => workflow-actions/workflow-actions-modal/__tests__/workflow-actions-modal.test.tsx} (78%)
 rename src/views/{workflow-page/workflow-page-actions-modal/workflow-page-actions-modal.styles.ts => workflow-actions/workflow-actions-modal/workflow-actions-modal.styles.ts} (100%)
 rename src/views/{workflow-page/workflow-page-actions-modal/workflow-page-actions-modal.tsx => workflow-actions/workflow-actions-modal/workflow-actions-modal.tsx} (84%)
 rename src/views/{workflow-page/workflow-page-actions-button/workflow-page-actions-button.styles.ts => workflow-actions/workflow-actions.styles.ts} (100%)
 rename src/views/{workflow-page/workflow-page-actions-button/workflow-page-actions-button.tsx => workflow-actions/workflow-actions.tsx} (68%)
 rename src/views/{workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.types.ts => workflow-actions/workflow-actions.types.ts} (79%)
 delete mode 100644 src/views/workflow-page/workflow-page-actions-button/workflow-page-actions-button.types.ts

diff --git a/src/views/workflow-page/__fixtures__/workflow-actions-config.ts b/src/views/workflow-actions/__fixtures__/workflow-actions-config.ts
similarity index 75%
rename from src/views/workflow-page/__fixtures__/workflow-actions-config.ts
rename to src/views/workflow-actions/__fixtures__/workflow-actions-config.ts
index 82313fb19..b9455760e 100644
--- a/src/views/workflow-page/__fixtures__/workflow-actions-config.ts
+++ b/src/views/workflow-actions/__fixtures__/workflow-actions-config.ts
@@ -1,8 +1,8 @@
 import { MdHighlightOff, MdPowerSettingsNew } from 'react-icons/md';
 
-import { type WorkflowAction } from '../workflow-page-actions-menu/workflow-page-actions-menu.types';
+import { type WorkflowAction } from '../workflow-actions.types';
 
-export const mockWorkflowPageActionsConfig = [
+export const mockWorkflowActionsConfig = [
   {
     id: 'cancel',
     label: 'Mock cancel',
diff --git a/src/views/workflow-page/workflow-page-actions-button/__tests__/workflow-page-actions-button.test.tsx b/src/views/workflow-actions/__tests__/workflow-actions.test.tsx
similarity index 82%
rename from src/views/workflow-page/workflow-page-actions-button/__tests__/workflow-page-actions-button.test.tsx
rename to src/views/workflow-actions/__tests__/workflow-actions.test.tsx
index 55a401773..fcddae2d4 100644
--- a/src/views/workflow-page/workflow-page-actions-button/__tests__/workflow-page-actions-button.test.tsx
+++ b/src/views/workflow-actions/__tests__/workflow-actions.test.tsx
@@ -4,9 +4,10 @@ import { HttpResponse } from 'msw';
 
 import { act, render, screen, userEvent } from '@/test-utils/rtl';
 
-import { describeWorkflowResponse } from '../../__fixtures__/describe-workflow-response';
-import { mockWorkflowPageActionsConfig } from '../../__fixtures__/workflow-actions-config';
-import WorkflowPageActionsButton from '../workflow-page-actions-button';
+import { describeWorkflowResponse } from '@/views/workflow-page/__fixtures__/describe-workflow-response';
+
+import { mockWorkflowActionsConfig } from '../__fixtures__/workflow-actions-config';
+import WorkflowActions from '../workflow-actions';
 
 jest.mock('next/navigation', () => ({
   ...jest.requireActual('next/navigation'),
@@ -18,7 +19,7 @@ jest.mock('next/navigation', () => ({
   }),
 }));
 
-jest.mock('../../workflow-page-actions-modal/workflow-page-actions-modal', () =>
+jest.mock('../workflow-actions-modal/workflow-actions-modal', () =>
   jest.fn((props) => {
     return props.action ? (
       <div data-testid="actions-modal">Actions Modal</div>
@@ -26,11 +27,11 @@ jest.mock('../../workflow-page-actions-modal/workflow-page-actions-modal', () =>
   })
 );
 
-jest.mock('../../workflow-page-actions-menu/workflow-page-actions-menu', () =>
+jest.mock('../workflow-actions-menu/workflow-actions-menu', () =>
   jest.fn((props) => {
     return (
       <div
-        onClick={() => props.onActionSelect(mockWorkflowPageActionsConfig[0])}
+        onClick={() => props.onActionSelect(mockWorkflowActionsConfig[0])}
         data-testid="actions-menu"
       >
         Actions Menu{props.disabled ? ' (disabled)' : ''}
@@ -39,7 +40,7 @@ jest.mock('../../workflow-page-actions-menu/workflow-page-actions-menu', () =>
   })
 );
 
-describe(WorkflowPageActionsButton.name, () => {
+describe(WorkflowActions.name, () => {
   beforeEach(() => {
     jest.clearAllMocks();
   });
@@ -88,7 +89,7 @@ async function setup({ isError }: { isError?: boolean }) {
 
   const renderResult = render(
     <Suspense>
-      <WorkflowPageActionsButton />
+      <WorkflowActions />
     </Suspense>,
     {
       endpointsMocks: [
diff --git a/src/views/workflow-page/config/workflow-page-actions.config.ts b/src/views/workflow-actions/config/workflow-actions.config.ts
similarity index 71%
rename from src/views/workflow-page/config/workflow-page-actions.config.ts
rename to src/views/workflow-actions/config/workflow-actions.config.ts
index 78c271e25..41f954f7b 100644
--- a/src/views/workflow-page/config/workflow-page-actions.config.ts
+++ b/src/views/workflow-actions/config/workflow-actions.config.ts
@@ -1,9 +1,10 @@
 import { MdHighlightOff, MdPowerSettingsNew } from 'react-icons/md';
 
-import getWorkflowIsCompleted from '../helpers/get-workflow-is-completed';
-import { type WorkflowAction } from '../workflow-page-actions-menu/workflow-page-actions-menu.types';
+import getWorkflowIsCompleted from '@/views/workflow-page/helpers/get-workflow-is-completed';
 
-const workflowPageActionsConfig = [
+import { type WorkflowAction } from '../workflow-actions.types';
+
+const workflowActionsConfig = [
   {
     id: 'cancel',
     label: 'Cancel',
@@ -26,4 +27,4 @@ const workflowPageActionsConfig = [
   },
 ] as const satisfies Array<WorkflowAction>;
 
-export default workflowPageActionsConfig;
+export default workflowActionsConfig;
diff --git a/src/views/workflow-page/workflow-page-actions-menu/__tests__/workflow-page-actions-menu.test.tsx b/src/views/workflow-actions/workflow-actions-menu/__tests__/workflow-actions-menu.test.tsx
similarity index 78%
rename from src/views/workflow-page/workflow-page-actions-menu/__tests__/workflow-page-actions-menu.test.tsx
rename to src/views/workflow-actions/workflow-actions-menu/__tests__/workflow-actions-menu.test.tsx
index 9e083f021..6f139f898 100644
--- a/src/views/workflow-page/workflow-page-actions-menu/__tests__/workflow-page-actions-menu.test.tsx
+++ b/src/views/workflow-actions/workflow-actions-menu/__tests__/workflow-actions-menu.test.tsx
@@ -2,16 +2,17 @@ import React from 'react';
 
 import { render, screen, userEvent, within } from '@/test-utils/rtl';
 
-import { describeWorkflowResponse } from '../../__fixtures__/describe-workflow-response';
-import { mockWorkflowPageActionsConfig } from '../../__fixtures__/workflow-actions-config';
-import WorkflowPageActionsMenu from '../workflow-page-actions-menu';
+import { describeWorkflowResponse } from '@/views/workflow-page/__fixtures__/describe-workflow-response';
+
+import { mockWorkflowActionsConfig } from '../../__fixtures__/workflow-actions-config';
+import WorkflowActionsMenu from '../workflow-actions-menu';
 
 jest.mock(
-  '../../config/workflow-page-actions.config',
-  () => mockWorkflowPageActionsConfig
+  '../../config/workflow-actions.config',
+  () => mockWorkflowActionsConfig
 );
 
-describe(WorkflowPageActionsMenu.name, () => {
+describe(WorkflowActionsMenu.name, () => {
   beforeEach(() => {
     jest.clearAllMocks();
   });
@@ -55,7 +56,7 @@ function setup() {
   const mockOnActionSelect = jest.fn();
 
   const renderResult = render(
-    <WorkflowPageActionsMenu
+    <WorkflowActionsMenu
       workflow={describeWorkflowResponse}
       onActionSelect={mockOnActionSelect}
     />
diff --git a/src/views/workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.styles.ts b/src/views/workflow-actions/workflow-actions-menu/workflow-actions-menu.styles.ts
similarity index 100%
rename from src/views/workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.styles.ts
rename to src/views/workflow-actions/workflow-actions-menu/workflow-actions-menu.styles.ts
diff --git a/src/views/workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.tsx b/src/views/workflow-actions/workflow-actions-menu/workflow-actions-menu.tsx
similarity index 69%
rename from src/views/workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.tsx
rename to src/views/workflow-actions/workflow-actions-menu/workflow-actions-menu.tsx
index 0514888d0..0a0fd5d68 100644
--- a/src/views/workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.tsx
+++ b/src/views/workflow-actions/workflow-actions-menu/workflow-actions-menu.tsx
@@ -1,17 +1,17 @@
 import { Button, KIND } from 'baseui/button';
 
-import workflowPageActionsConfig from '../config/workflow-page-actions.config';
+import workflowActionsConfig from '../config/workflow-actions.config';
 
-import { overrides, styled } from './workflow-page-actions-menu.styles';
-import { type Props } from './workflow-page-actions-menu.types';
+import { overrides, styled } from './workflow-actions-menu.styles';
+import { type Props } from './workflow-actions-menu.types';
 
-export default function WorkflowPageActionsMenu({
+export default function WorkflowActionsMenu({
   workflow,
   onActionSelect,
 }: Props) {
   return (
     <styled.MenuItemsContainer>
-      {workflowPageActionsConfig.map((action) => (
+      {workflowActionsConfig.map((action) => (
         <Button
           key={action.id}
           kind={KIND.tertiary}
diff --git a/src/views/workflow-actions/workflow-actions-menu/workflow-actions-menu.types.ts b/src/views/workflow-actions/workflow-actions-menu/workflow-actions-menu.types.ts
new file mode 100644
index 000000000..f5f571f25
--- /dev/null
+++ b/src/views/workflow-actions/workflow-actions-menu/workflow-actions-menu.types.ts
@@ -0,0 +1,8 @@
+import { type DescribeWorkflowResponse } from '@/route-handlers/describe-workflow/describe-workflow.types';
+
+import { type WorkflowAction } from '../workflow-actions.types';
+
+export type Props = {
+  workflow: DescribeWorkflowResponse;
+  onActionSelect: (action: WorkflowAction) => void;
+};
diff --git a/src/views/workflow-page/workflow-page-actions-modal/__tests__/workflow-page-actions-modal.test.tsx b/src/views/workflow-actions/workflow-actions-modal/__tests__/workflow-actions-modal.test.tsx
similarity index 78%
rename from src/views/workflow-page/workflow-page-actions-modal/__tests__/workflow-page-actions-modal.test.tsx
rename to src/views/workflow-actions/workflow-actions-modal/__tests__/workflow-actions-modal.test.tsx
index b3b8e19f9..fb32521ed 100644
--- a/src/views/workflow-page/workflow-page-actions-modal/__tests__/workflow-page-actions-modal.test.tsx
+++ b/src/views/workflow-actions/workflow-actions-modal/__tests__/workflow-actions-modal.test.tsx
@@ -2,9 +2,10 @@ import { type ModalProps } from 'baseui/modal';
 
 import { render, screen, userEvent } from '@/test-utils/rtl';
 
-import { describeWorkflowResponse } from '../../__fixtures__/describe-workflow-response';
-import { mockWorkflowPageActionsConfig } from '../../__fixtures__/workflow-actions-config';
-import WorkflowPageActionsModal from '../workflow-page-actions-modal';
+import { describeWorkflowResponse } from '@/views/workflow-page/__fixtures__/describe-workflow-response';
+
+import { mockWorkflowActionsConfig } from '../../__fixtures__/workflow-actions-config';
+import WorkflowActionsModal from '../workflow-actions-modal';
 
 jest.mock('baseui/modal', () => ({
   ...jest.requireActual('baseui/modal'),
@@ -16,7 +17,7 @@ jest.mock('baseui/modal', () => ({
     ) : null,
 }));
 
-describe(WorkflowPageActionsModal.name, () => {
+describe(WorkflowActionsModal.name, () => {
   beforeEach(() => {
     jest.clearAllMocks();
   });
@@ -54,9 +55,9 @@ function setup({ omitAction }: { omitAction?: boolean }) {
   const mockOnClose = jest.fn();
 
   render(
-    <WorkflowPageActionsModal
+    <WorkflowActionsModal
       workflow={describeWorkflowResponse}
-      action={omitAction ? undefined : mockWorkflowPageActionsConfig[0]}
+      action={omitAction ? undefined : mockWorkflowActionsConfig[0]}
       onClose={mockOnClose}
     />
   );
diff --git a/src/views/workflow-page/workflow-page-actions-modal/workflow-page-actions-modal.styles.ts b/src/views/workflow-actions/workflow-actions-modal/workflow-actions-modal.styles.ts
similarity index 100%
rename from src/views/workflow-page/workflow-page-actions-modal/workflow-page-actions-modal.styles.ts
rename to src/views/workflow-actions/workflow-actions-modal/workflow-actions-modal.styles.ts
diff --git a/src/views/workflow-page/workflow-page-actions-modal/workflow-page-actions-modal.tsx b/src/views/workflow-actions/workflow-actions-modal/workflow-actions-modal.tsx
similarity index 84%
rename from src/views/workflow-page/workflow-page-actions-modal/workflow-page-actions-modal.tsx
rename to src/views/workflow-actions/workflow-actions-modal/workflow-actions-modal.tsx
index 0fe376d69..36458833b 100644
--- a/src/views/workflow-page/workflow-page-actions-modal/workflow-page-actions-modal.tsx
+++ b/src/views/workflow-actions/workflow-actions-modal/workflow-actions-modal.tsx
@@ -3,11 +3,11 @@ import { Modal, ModalButton } from 'baseui/modal';
 
 import { type DescribeWorkflowResponse } from '@/route-handlers/describe-workflow/describe-workflow.types';
 
-import { type WorkflowAction } from '../workflow-page-actions-menu/workflow-page-actions-menu.types';
+import { type WorkflowAction } from '../workflow-actions.types';
 
-import { overrides, styled } from './workflow-page-actions-modal.styles';
+import { overrides, styled } from './workflow-actions-modal.styles';
 
-export default function WorkflowPageActionsModal({
+export default function WorkflowActionsModal({
   // workflow,
   action,
   onClose,
diff --git a/src/views/workflow-page/workflow-page-actions-button/workflow-page-actions-button.styles.ts b/src/views/workflow-actions/workflow-actions.styles.ts
similarity index 100%
rename from src/views/workflow-page/workflow-page-actions-button/workflow-page-actions-button.styles.ts
rename to src/views/workflow-actions/workflow-actions.styles.ts
diff --git a/src/views/workflow-page/workflow-page-actions-button/workflow-page-actions-button.tsx b/src/views/workflow-actions/workflow-actions.tsx
similarity index 68%
rename from src/views/workflow-page/workflow-page-actions-button/workflow-page-actions-button.tsx
rename to src/views/workflow-actions/workflow-actions.tsx
index 2122a73f0..1d5a060a3 100644
--- a/src/views/workflow-page/workflow-page-actions-button/workflow-page-actions-button.tsx
+++ b/src/views/workflow-actions/workflow-actions.tsx
@@ -7,15 +7,15 @@ import { pick } from 'lodash';
 import { useParams } from 'next/navigation';
 import { MdArrowDropDown } from 'react-icons/md';
 
-import useDescribeWorkflow from '../hooks/use-describe-workflow';
-import WorkflowPageActionsMenu from '../workflow-page-actions-menu/workflow-page-actions-menu';
-import { type WorkflowAction } from '../workflow-page-actions-menu/workflow-page-actions-menu.types';
-import WorkflowPageActionsModal from '../workflow-page-actions-modal/workflow-page-actions-modal';
-import { type WorkflowPageParams } from '../workflow-page.types';
+import useDescribeWorkflow from '../workflow-page/hooks/use-describe-workflow';
+import { type WorkflowPageParams } from '../workflow-page/workflow-page.types';
 
-import { overrides } from './workflow-page-actions-button.styles';
+import WorkflowActionsMenu from './workflow-actions-menu/workflow-actions-menu';
+import WorkflowActionsModal from './workflow-actions-modal/workflow-actions-modal';
+import { overrides } from './workflow-actions.styles';
+import { type WorkflowAction } from './workflow-actions.types';
 
-export default function WorkflowPageActionsButton() {
+export default function WorkflowActions() {
   const params = useParams<WorkflowPageParams>();
   const workflowDetailsParams = pick(
     params,
@@ -39,7 +39,7 @@ export default function WorkflowPageActionsButton() {
         placement={PLACEMENT.bottomRight}
         overrides={overrides.popover}
         content={() => (
-          <WorkflowPageActionsMenu
+          <WorkflowActionsMenu
             workflow={workflow}
             onActionSelect={(action) => setSelectedAction(action)}
           />
@@ -55,7 +55,7 @@ export default function WorkflowPageActionsButton() {
           Workflow Actions
         </Button>
       </StatefulPopover>
-      <WorkflowPageActionsModal
+      <WorkflowActionsModal
         workflow={workflow}
         action={selectedAction}
         onClose={() => setSelectedAction(undefined)}
diff --git a/src/views/workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.types.ts b/src/views/workflow-actions/workflow-actions.types.ts
similarity index 79%
rename from src/views/workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.types.ts
rename to src/views/workflow-actions/workflow-actions.types.ts
index 0f4260d8a..8199df641 100644
--- a/src/views/workflow-page/workflow-page-actions-menu/workflow-page-actions-menu.types.ts
+++ b/src/views/workflow-actions/workflow-actions.types.ts
@@ -13,8 +13,3 @@ export type WorkflowAction = {
   getIsEnabled: (workflow: DescribeWorkflowResponse) => boolean;
   // Add a field for the endpoint to call
 };
-
-export type Props = {
-  workflow: DescribeWorkflowResponse;
-  onActionSelect: (action: WorkflowAction) => void;
-};
diff --git a/src/views/workflow-page/workflow-page-actions-button/workflow-page-actions-button.types.ts b/src/views/workflow-page/workflow-page-actions-button/workflow-page-actions-button.types.ts
deleted file mode 100644
index e06ea334b..000000000
--- a/src/views/workflow-page/workflow-page-actions-button/workflow-page-actions-button.types.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export type Props = {
-  domain: string;
-  cluster: string;
-  workflowId: string;
-  runId: string;
-};
diff --git a/src/views/workflow-page/workflow-page-tabs/__tests__/workflow-page-tabs.test.tsx b/src/views/workflow-page/workflow-page-tabs/__tests__/workflow-page-tabs.test.tsx
index 23214898b..e2ff4cc85 100644
--- a/src/views/workflow-page/workflow-page-tabs/__tests__/workflow-page-tabs.test.tsx
+++ b/src/views/workflow-page/workflow-page-tabs/__tests__/workflow-page-tabs.test.tsx
@@ -43,9 +43,8 @@ jest.mock(
   () => jest.fn(() => <div>CLI Commands</div>)
 );
 
-jest.mock(
-  '../../workflow-page-actions-button/workflow-page-actions-button',
-  () => jest.fn(() => <div>Actions</div>)
+jest.mock('@/views/workflow-actions/workflow-actions', () =>
+  jest.fn(() => <div>Actions</div>)
 );
 
 describe('WorkflowPageTabs', () => {
diff --git a/src/views/workflow-page/workflow-page-tabs/workflow-page-tabs.tsx b/src/views/workflow-page/workflow-page-tabs/workflow-page-tabs.tsx
index 97d9faf3d..a77121f01 100644
--- a/src/views/workflow-page/workflow-page-tabs/workflow-page-tabs.tsx
+++ b/src/views/workflow-page/workflow-page-tabs/workflow-page-tabs.tsx
@@ -6,9 +6,9 @@ import { useRouter, useParams } from 'next/navigation';
 import ErrorBoundary from '@/components/error-boundary/error-boundary';
 import PageTabs from '@/components/page-tabs/page-tabs';
 import decodeUrlParams from '@/utils/decode-url-params';
+import WorkflowActions from '@/views/workflow-actions/workflow-actions';
 
 import workflowPageTabsConfig from '../config/workflow-page-tabs.config';
-import WorkflowPageActionsButton from '../workflow-page-actions-button/workflow-page-actions-button';
 import WorkflowPageCliCommandsButton from '../workflow-page-cli-commands-button/workflow-page-cli-commands-button';
 
 import { styled } from './workflow-page-tabs.styles';
@@ -29,7 +29,7 @@ export default function WorkflowPageTabs() {
         <styled.EndButtonsContainer>
           <WorkflowPageCliCommandsButton />
           <ErrorBoundary fallbackRender={() => null}>
-            <WorkflowPageActionsButton />
+            <WorkflowActions />
           </ErrorBoundary>
         </styled.EndButtonsContainer>
       }