update actions menu

Author: Assem-Uber

src/views/schedule-actions/__fixtures__/schedule-actions-config.tsx

@@ -27,7 +27,7 @@ export const mockPauseActionConfig: ScheduleAction<
   modal: {
     banner: {
       kind: 'warning',
-      icon: ({ size }) => <MdOutlineWarningAmber size={size} />,
+      icon: MdOutlineWarningAmber,
       render: () => 'Mock pause banner message',
     },
     withForm: false,

src/views/schedule-actions/config/schedule-actions-banner-icons.tsx

@@ -0,0 +1,8 @@
+import { type ScheduleActionDisabledValue } from '@/config/dynamic/resolvers/schedule-actions-enabled.types';
+
+const SCHEDULE_ACTIONS_DISABLED_REASONS_CONFIG = {
+  DISABLED_DEFAULT: 'Schedule action has been disabled',
+  DISABLED_UNAUTHORIZED: 'Not authorized to perform this action',
+} as const satisfies Record<ScheduleActionDisabledValue, string>;
+
+export default SCHEDULE_ACTIONS_DISABLED_REASONS_CONFIG;

src/views/schedule-actions/config/schedule-actions-disabled-reasons.config.ts

@@ -1,6 +1,6 @@
 const SCHEDULE_ACTIONS_NON_RUNNABLE_STATUSES_CONFIG = [
   'NOT_RUNNABLE_SCHEDULE_ALREADY_PAUSED',
   'NOT_RUNNABLE_SCHEDULE_NOT_PAUSED',
-] as const;
+] as const satisfies Array<`NOT_RUNNABLE_${string}`>;
 
 export default SCHEDULE_ACTIONS_NON_RUNNABLE_STATUSES_CONFIG;

src/views/schedule-actions/config/schedule-actions-non-runnable-statuses.config.ts

@@ -1,4 +1,8 @@
-import { MdPauseCircleOutline, MdPlayCircleOutline } from 'react-icons/md';
+import {
+  MdOutlineWarningAmber,
+  MdPauseCircleOutline,
+  MdPlayCircleOutline,
+} from 'react-icons/md';
 
 import { type PauseScheduleResponse } from '@/route-handlers/pause-schedule/pause-schedule.types';
 import { type UnpauseScheduleResponse } from '@/route-handlers/unpause-schedule/unpause-schedule.types';
@@ -8,7 +12,6 @@ import {
   type ScheduleAction,
 } from '../schedule-actions.types';
 
-import { pauseScheduleBannerIcon } from './schedule-actions-banner-icons';
 import { PAUSE_SCHEDULE_MODAL_BANNER_MESSAGE } from './schedule-actions.constants';
 
 const pauseScheduleActionConfig: ScheduleAction<
@@ -22,7 +25,7 @@ const pauseScheduleActionConfig: ScheduleAction<
   modal: {
     banner: {
       kind: 'warning',
-      icon: pauseScheduleBannerIcon,
+      icon: MdOutlineWarningAmber,
       render: () => PAUSE_SCHEDULE_MODAL_BANNER_MESSAGE,
     },
     withForm: false,
@@ -34,6 +37,7 @@ const pauseScheduleActionConfig: ScheduleAction<
       : 'RUNNABLE',
   apiRoute: (params) =>
     `/api/domains/${encodeURIComponent(params.domain)}/${encodeURIComponent(params.cluster)}/schedules/${encodeURIComponent(params.scheduleId)}/pause`,
+  // TODO: get reason from UI form
   getConfirmSubmissionData: () => ({
     reason: 'Paused from Cadence Web UI',
   }),

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

@@ -3,10 +3,12 @@ import React from 'react';
 import { render, screen, userEvent, within } from '@/test-utils/rtl';
 
 import {
-  getMockPausedDescribeScheduleResponse,
-  getMockRunningDescribeScheduleResponse,
-  mockDescribeScheduleResponse,
-} from '@/route-handlers/describe-schedule/__fixtures__/mock-describe-schedule-response';
+  type ScheduleActionEnabledConfigValue,
+  type ScheduleActionsEnabledConfig,
+} from '@/config/dynamic/resolvers/schedule-actions-enabled.types';
+import mockResolvedConfigValues from '@/utils/config/__fixtures__/resolved-config-values';
+
+import { mockDescribeScheduleResponse } from '@/route-handlers/describe-schedule/__fixtures__/mock-describe-schedule-response';
 
 import { mockScheduleActionsConfig } from '../../__fixtures__/schedule-actions-config';
 import ScheduleActionsMenu from '../schedule-actions-menu';
@@ -16,72 +18,74 @@ jest.mock(
   () => mockScheduleActionsConfig
 );
 
+jest.mock('../helpers/get-action-disabled-reason', () =>
+  jest.fn(
+    ({
+      actionEnabledConfig,
+    }: {
+      actionEnabledConfig?: ScheduleActionEnabledConfigValue;
+    }) =>
+      actionEnabledConfig === 'ENABLED'
+        ? undefined
+        : 'Mock schedule action disabled reason'
+  )
+);
+
 describe(ScheduleActionsMenu.name, () => {
   beforeEach(() => {
     jest.clearAllMocks();
   });
 
   it('renders the menu items correctly', () => {
-    setup({ schedule: mockDescribeScheduleResponse });
+    setup({
+      actionsEnabledConfig: mockResolvedConfigValues.SCHEDULE_ACTIONS_ENABLED,
+    });
 
     const menuButtons = screen.getAllByRole('button');
     expect(menuButtons).toHaveLength(2);
 
     expect(within(menuButtons[0]).getByText('Mock pause')).toBeInTheDocument();
+    expect(
+      within(menuButtons[0]).getByText('Mock pause a schedule')
+    ).toBeInTheDocument();
     expect(menuButtons[0]).not.toBeDisabled();
 
     expect(within(menuButtons[1]).getByText('Mock resume')).toBeInTheDocument();
-    expect(menuButtons[1]).toBeDisabled();
-  });
-
-  it('disables pause and enables resume when schedule is paused', () => {
-    setup({ schedule: getMockPausedDescribeScheduleResponse() });
-
-    const menuButtons = screen.getAllByRole('button');
-    expect(menuButtons[0]).toBeDisabled();
-    expect(menuButtons[1]).not.toBeDisabled();
-  });
-
-  it('shows tooltip when pause is disabled for a paused schedule', async () => {
-    const { user } = setup({
-      schedule: getMockPausedDescribeScheduleResponse(),
-    });
-
-    await user.hover(screen.getAllByRole('button')[0]);
     expect(
-      await screen.findByText('Schedule is already paused')
+      within(menuButtons[1]).getByText('Mock resume a schedule')
     ).toBeInTheDocument();
+    expect(menuButtons[1]).not.toBeDisabled();
   });
 
-  it('shows tooltip when resume is disabled for a running schedule', async () => {
+  it('disables menu items and shows tooltip if they are disabled from config', async () => {
     const { user } = setup({
-      schedule: getMockRunningDescribeScheduleResponse(),
+      actionsEnabledConfig: {
+        pause: 'DISABLED_DEFAULT',
+        resume: 'DISABLED_DEFAULT',
+      },
     });
 
-    await user.hover(screen.getAllByRole('button')[1]);
+    const menuButtons = screen.getAllByRole('button');
+    expect(menuButtons[0]).toBeDisabled();
+    expect(menuButtons[1]).toBeDisabled();
+
+    await user.hover(menuButtons[0]);
     expect(
-      await screen.findByText('Schedule is not paused')
+      await screen.findByText('Mock schedule action disabled reason')
     ).toBeInTheDocument();
   });
 
-  it('disables all actions while schedule is loading', () => {
-    setup({ schedule: undefined });
+  it('disables menu items if no config is passed', () => {
+    setup({ actionsEnabledConfig: undefined });
 
     const menuButtons = screen.getAllByRole('button');
     expect(menuButtons[0]).toBeDisabled();
     expect(menuButtons[1]).toBeDisabled();
   });
 
-  it('shows tooltip while schedule is loading', async () => {
-    const { user } = setup({ schedule: undefined });
-
-    await user.hover(screen.getAllByRole('button')[0]);
-    expect(await screen.findByText('Loading schedule...')).toBeInTheDocument();
-  });
-
   it('calls onActionSelect when an enabled action button is clicked', async () => {
     const { user, mockOnActionSelect } = setup({
-      schedule: mockDescribeScheduleResponse,
+      actionsEnabledConfig: mockResolvedConfigValues.SCHEDULE_ACTIONS_ENABLED,
     });
 
     await user.click(screen.getAllByRole('button')[0]);
@@ -92,16 +96,19 @@ describe(ScheduleActionsMenu.name, () => {
 });
 
 function setup({
-  schedule,
+  schedule = mockDescribeScheduleResponse,
+  actionsEnabledConfig,
 }: {
-  schedule: typeof mockDescribeScheduleResponse | undefined;
+  schedule?: typeof mockDescribeScheduleResponse | undefined;
+  actionsEnabledConfig?: ScheduleActionsEnabledConfig;
 }) {
   const user = userEvent.setup();
   const mockOnActionSelect = jest.fn();
 
   render(
     <ScheduleActionsMenu
       schedule={schedule}
+      {...(actionsEnabledConfig && { actionsEnabledConfig })}
       onActionSelect={mockOnActionSelect}
     />
   );

src/views/schedule-actions/schedule-actions-menu/__tests__/schedule-actions-menu.test.tsx

@@ -1,16 +1,49 @@
+import { type ScheduleActionEnabledConfigValue } from '@/config/dynamic/resolvers/schedule-actions-enabled.types';
+
 import { type ScheduleActionRunnableStatus } from '../../../schedule-actions.types';
 import getActionDisabledReason from '../get-action-disabled-reason';
 
 describe(getActionDisabledReason.name, () => {
-  it('returns undefined when action is runnable', () => {
+  it('returns undefined when action is enabled and runnable', () => {
     expect(
-      getActionDisabledReason({ actionRunnableStatus: 'RUNNABLE' })
+      getActionDisabledReason({
+        actionEnabledConfig: 'ENABLED',
+        actionRunnableStatus: 'RUNNABLE',
+      })
     ).toBeUndefined();
   });
 
+  it('returns reason when action is disabled by default', () => {
+    expect(
+      getActionDisabledReason({
+        actionEnabledConfig: 'DISABLED_DEFAULT',
+        actionRunnableStatus: 'RUNNABLE',
+      })
+    ).toBe('Schedule action has been disabled');
+  });
+
+  it('returns reason when action is disabled due to unauthorized access', () => {
+    expect(
+      getActionDisabledReason({
+        actionEnabledConfig: 'DISABLED_UNAUTHORIZED',
+        actionRunnableStatus: 'RUNNABLE',
+      })
+    ).toBe('Not authorized to perform this action');
+  });
+
+  it('returns disabled reason over non-runnable reason when both apply', () => {
+    expect(
+      getActionDisabledReason({
+        actionEnabledConfig: 'DISABLED_DEFAULT',
+        actionRunnableStatus: 'NOT_RUNNABLE_SCHEDULE_ALREADY_PAUSED',
+      })
+    ).toBe('Schedule action has been disabled');
+  });
+
   it('returns reason when schedule is already paused', () => {
     expect(
       getActionDisabledReason({
+        actionEnabledConfig: 'ENABLED',
         actionRunnableStatus: 'NOT_RUNNABLE_SCHEDULE_ALREADY_PAUSED',
       })
     ).toBe('Schedule is already paused');
@@ -19,14 +52,37 @@ describe(getActionDisabledReason.name, () => {
   it('returns reason when schedule is not paused', () => {
     expect(
       getActionDisabledReason({
+        actionEnabledConfig: 'ENABLED',
         actionRunnableStatus: 'NOT_RUNNABLE_SCHEDULE_NOT_PAUSED',
       })
     ).toBe('Schedule is not paused');
   });
 
+  it('returns disabled default reason when no config is provided', () => {
+    expect(
+      getActionDisabledReason({
+        actionRunnableStatus: 'RUNNABLE',
+      })
+    ).toBe('Schedule action has been disabled');
+  });
+
   it('returns undefined when runnable status is not provided', () => {
     expect(
       getActionDisabledReason({
+        actionEnabledConfig: 'ENABLED',
+        actionRunnableStatus: undefined as
+          | ScheduleActionRunnableStatus
+          | undefined,
+      })
+    ).toBeUndefined();
+  });
+
+  it('returns undefined when neither config nor runnable status is provided', () => {
+    expect(
+      getActionDisabledReason({
+        actionEnabledConfig: undefined as
+          | ScheduleActionEnabledConfigValue
+          | undefined,
         actionRunnableStatus: undefined as
           | ScheduleActionRunnableStatus
           | undefined,

src/views/schedule-actions/schedule-actions-menu/helpers/__tests__/get-action-disabled-reason.test.ts

@@ -1,15 +1,26 @@
+import { type ScheduleActionEnabledConfigValue } from '@/config/dynamic/resolvers/schedule-actions-enabled.types';
+
+import SCHEDULE_ACTIONS_DISABLED_REASONS_CONFIG from '../../config/schedule-actions-disabled-reasons.config';
 import SCHEDULE_ACTIONS_NON_RUNNABLE_REASONS_CONFIG from '../../config/schedule-actions-non-runnable-reasons.config';
 import { type ScheduleActionRunnableStatus } from '../../schedule-actions.types';
 
 export default function getActionDisabledReason({
+  actionEnabledConfig,
   actionRunnableStatus,
 }: {
+  actionEnabledConfig?: ScheduleActionEnabledConfigValue;
   actionRunnableStatus?: ScheduleActionRunnableStatus;
 }): string | undefined {
   if (!actionRunnableStatus) {
     return undefined;
   }
 
+  if (actionEnabledConfig !== 'ENABLED') {
+    return SCHEDULE_ACTIONS_DISABLED_REASONS_CONFIG[
+      actionEnabledConfig ?? 'DISABLED_DEFAULT'
+    ];
+  }
+
   if (actionRunnableStatus !== 'RUNNABLE') {
     return SCHEDULE_ACTIONS_NON_RUNNABLE_REASONS_CONFIG[actionRunnableStatus];
   }

src/views/schedule-actions/schedule-actions-menu/helpers/get-action-disabled-reason.ts

@@ -7,20 +7,20 @@ import getActionDisabledReason from './helpers/get-action-disabled-reason';
 import { overrides, styled } from './schedule-actions-menu.styles';
 import { type Props } from './schedule-actions-menu.types';
 
-const SCHEDULE_LOADING_DISABLED_REASON = 'Loading schedule...';
-
 export default function ScheduleActionsMenu({
   schedule,
+  actionsEnabledConfig,
   onActionSelect,
 }: Props) {
   return (
     <styled.MenuItemsContainer>
       {scheduleActionsConfig.map((action) => {
-        const actionDisabledReason = schedule
-          ? getActionDisabledReason({
-              actionRunnableStatus: action.getRunnableStatus(schedule),
-            })
-          : SCHEDULE_LOADING_DISABLED_REASON;
+        const actionDisabledReason = getActionDisabledReason({
+          actionEnabledConfig: actionsEnabledConfig?.[action.id],
+          actionRunnableStatus: schedule
+            ? action.getRunnableStatus(schedule)
+            : undefined,
+        });
 
         return (
           <StatefulTooltip

src/views/schedule-actions/schedule-actions-menu/schedule-actions-menu.tsx

@@ -1,8 +1,10 @@
+import { type ScheduleActionsEnabledConfig } from '@/config/dynamic/resolvers/schedule-actions-enabled.types';
 import { type DescribeScheduleResponse } from '@/route-handlers/describe-schedule/describe-schedule.types';
 
 import { type ScheduleAction } from '../schedule-actions.types';
 
 export type Props = {
   schedule: DescribeScheduleResponse | undefined;
+  actionsEnabledConfig?: ScheduleActionsEnabledConfig;
   onActionSelect: (action: ScheduleAction<any, any, any>) => void;
 };