foreman-tasks 11.0.6 → 11.0.7

data/webpack/ForemanTasks/Components/TasksTable/Components/ConfirmModal/createTaskModal.js

@@ -0,0 +1,51 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useSelector } from 'react-redux';
+import { sprintf } from 'foremanReact/common/I18n';
+import { selectClicked } from './ConfirmModalSelectors';
+import { GenericConfirmModal } from './GenericConfirmModal';
+
+export const createTaskModal = ({
+  actionCreator,
+  title,
+  messageTemplate,
+  confirmButtonVariant = 'primary',
+  ouiaIdPrefix,
+}) => {
+  const TaskModal = ({ isModalOpen, setIsModalOpen, url, parentTaskID }) => {
+    const { taskId, taskName } = useSelector(selectClicked);
+
+    const handleConfirm = () =>
+      actionCreator({
+        taskId,
+        taskName,
+        url,
+        parentTaskID,
+      });
+
+    return (
+      <GenericConfirmModal
+        isModalOpen={isModalOpen}
+        setIsModalOpen={setIsModalOpen}
+        title={title}
+        message={sprintf(messageTemplate, { taskName })}
+        onConfirm={handleConfirm}
+        confirmButtonVariant={confirmButtonVariant}
+        ouiaIdPrefix={ouiaIdPrefix}
+      />
+    );
+  };
+
+  TaskModal.propTypes = {
+    isModalOpen: PropTypes.bool.isRequired,
+    setIsModalOpen: PropTypes.func.isRequired,
+    url: PropTypes.string.isRequired,
+    parentTaskID: PropTypes.string,
+  };
+
+  TaskModal.defaultProps = {
+    parentTaskID: null,
+  };
+
+  return TaskModal;
+};

data/webpack/ForemanTasks/Components/TasksTable/Components/ConfirmModal/index.js

@@ -1,29 +1,79 @@
-import { connect } from 'react-redux';
-import { bindActionCreators } from 'redux';
-import { ConfirmModal } from './ConfirmModal';
-import reducer from './ConfirmModalReducer';
-import tasksActions from './ConfirmModalActions';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { createTaskModal } from './createTaskModal';
+import { createBulkTaskModal } from './createBulkTaskModal';
 import {
-  selectActionText,
-  selectActionState,
-  selectActionType,
-  selectClicked,
-  selectSelectedRowsLen,
-} from './ConfirmModalSelectors';
-import { selectAllRowsSelected } from '../../TasksTableSelectors';
+  cancelTask,
+  forceCancelTask,
+  resumeTask,
+} from '../../TasksTableActions';
+import {
+  bulkCancelBySearch,
+  bulkCancelById,
+  bulkForceCancelBySearch,
+  bulkForceCancelById,
+  bulkResumeBySearch,
+  bulkResumeById,
+} from '../../TasksBulkActions';
+
+export const CancelModal = createTaskModal({
+  actionCreator: cancelTask,
+  title: __('Cancel Task'),
+  messageTemplate: __(
+    'This will cancel task "%(taskName)s", putting it in the stopped state. Are you sure?'
+  ),
+  confirmButtonVariant: 'primary',
+  ouiaIdPrefix: 'cancel',
+});
+
+export const CancelSelectedModal = createBulkTaskModal({
+  bulkActionBySearch: bulkCancelBySearch,
+  bulkActionById: bulkCancelById,
+  title: __('Cancel Selected Tasks'),
+  messageTemplate: __(
+    'This will cancel %(number)s task(s), putting them in the stopped state. Are you sure?'
+  ),
+  confirmButtonVariant: 'primary',
+  ouiaIdPrefix: 'cancel-selected',
+});
 
-const mapStateToProps = state => ({
-  actionText: selectActionText(state),
-  actionType: selectActionType(state),
-  actionState: selectActionState(state),
-  allRowsSelected: selectAllRowsSelected(state),
-  clicked: selectClicked(state),
-  selectedRowsLen: selectSelectedRowsLen(state),
+export const ForceUnlockModal = createTaskModal({
+  actionCreator: forceCancelTask,
+  title: __('Force Unlock Task'),
+  messageTemplate: __(
+    'This will force unlock task "%(taskName)s". This may cause harm and should be used with caution. Are you sure?'
+  ),
+  confirmButtonVariant: 'danger',
+  ouiaIdPrefix: 'force-unlock',
 });
 
-const mapDispatchToProps = dispatch =>
-  bindActionCreators(tasksActions, dispatch);
+export const ForceUnlockSelectedModal = createBulkTaskModal({
+  bulkActionBySearch: bulkForceCancelBySearch,
+  bulkActionById: bulkForceCancelById,
+  title: __('Force Unlock Selected Tasks'),
+  messageTemplate: __(
+    'This will force unlock %(number)s task(s). This may cause harm and should be used with caution. Are you sure?'
+  ),
+  confirmButtonVariant: 'danger',
+  ouiaIdPrefix: 'force-unlock-selected',
+});
 
-export const reducers = { confirmModal: reducer };
+export const ResumeModal = createTaskModal({
+  actionCreator: resumeTask,
+  title: __('Resume Task'),
+  messageTemplate: __(
+    'This will resume task "%(taskName)s", putting it in the running state. Are you sure?'
+  ),
+  confirmButtonVariant: 'primary',
+  ouiaIdPrefix: 'resume',
+});
 
-export default connect(mapStateToProps, mapDispatchToProps)(ConfirmModal);
+export const ResumeSelectedModal = createBulkTaskModal({
+  bulkActionBySearch: bulkResumeBySearch,
+  bulkActionById: bulkResumeById,
+  title: __('Resume Selected Tasks'),
+  messageTemplate: __(
+    'This will resume %(number)s task(s), putting them in the running state. Are you sure?'
+  ),
+  confirmButtonVariant: 'primary',
+  ouiaIdPrefix: 'resume-selected',
+});

data/webpack/ForemanTasks/Components/TasksTable/TasksTable.js

@@ -8,8 +8,11 @@ import Pagination from 'foremanReact/components/Pagination';
 import { getURIQuery } from 'foremanReact/common/helpers';
 import createTasksTableSchema from './TasksTableSchema';
 import { updateURlQuery } from './TasksTableHelpers';
-import { RESUME_MODAL, CANCEL_MODAL } from './TasksTableConstants';
-import { FORCE_UNLOCK_MODAL } from '../TaskActions/TaskActionsConstants';
+import {
+  RESUME_MODAL,
+  CANCEL_MODAL,
+  FORCE_UNLOCK_MODAL,
+} from './TasksTableConstants';
 
 const TasksTable = ({
   getTableItems,

data/webpack/ForemanTasks/Components/TasksTable/TasksTableConstants.js

@@ -16,7 +16,7 @@ export const CANCEL_MODAL = 'cancelConfirmModal';
 export const RESUME_MODAL = 'resumeConfirmModal';
 export const CANCEL_SELECTED_MODAL = 'cancelSelectedConfirmModal';
 export const RESUME_SELECTED_MODAL = 'resumeSelectedConfirmModal';
-export const CONFIRM_MODAL = 'ConfirmModal';
+export const FORCE_UNLOCK_MODAL = 'forceUnlockConfirmModal';
 export const FORCE_UNLOCK_SELECTED_MODAL = 'forceUnlockSelectedConfirmModal';
 
 export const UPDATE_CLICKED = 'UPDATE_CLICKED';

data/webpack/ForemanTasks/Components/TasksTable/TasksTablePage.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import URI from 'urijs';
 import { getURIsearch } from 'foremanReact/common/urlHelpers';
@@ -8,17 +8,25 @@ import { translate as __ } from 'foremanReact/common/I18n';
 import { getURIQuery } from 'foremanReact/common/helpers';
 import ExportButton from 'foremanReact/routes/common/PageLayout/components/ExportButton/ExportButton';
 import { STATUS } from 'foremanReact/constants';
-import { useForemanModal } from 'foremanReact/components/ForemanModal/ForemanModalHooks';
 import TasksDashboard from '../TasksDashboard';
 import TasksTable from './TasksTable';
 import { getCSVurl, updateURlQuery } from './TasksTableHelpers';
-import ConfirmModal from './Components/ConfirmModal/';
+import {
+  CancelModal,
+  ResumeModal,
+  CancelSelectedModal,
+  ResumeSelectedModal,
+  ForceUnlockModal,
+  ForceUnlockSelectedModal,
+} from './Components/ConfirmModal';
 import {
   TASKS_SEARCH_PROPS,
   CANCEL_SELECTED_MODAL,
   RESUME_SELECTED_MODAL,
   FORCE_UNLOCK_SELECTED_MODAL,
-  CONFIRM_MODAL,
+  CANCEL_MODAL,
+  RESUME_MODAL,
+  FORCE_UNLOCK_MODAL,
 } from './TasksTableConstants';
 import { ActionSelectButton } from './Components/ActionSelectButton';
 import './TasksTablePage.scss';
@@ -48,21 +56,69 @@ const TasksTablePage = ({
       updateURlQuery(newUriQuery, history);
     }
   };
-
-  const { setModalOpen, setModalClosed } = useForemanModal({
-    id: CONFIRM_MODAL,
+  const [modalStates, setModalStates] = useState({
+    [CANCEL_MODAL]: false,
+    [RESUME_MODAL]: false,
+    [CANCEL_SELECTED_MODAL]: false,
+    [RESUME_SELECTED_MODAL]: false,
+    [FORCE_UNLOCK_MODAL]: false,
+    [FORCE_UNLOCK_SELECTED_MODAL]: false,
   });
 
-  const openModal = id => openModalAction(id, setModalOpen);
+  const openModal = id => {
+    setModalStates(prev => ({
+      ...prev,
+      [id]: true,
+    }));
+  };
+
+  const closeModal = id => {
+    setModalStates(prev => ({
+      ...prev,
+      [id]: false,
+    }));
+  };
 
   return (
     <div className="tasks-table-wrapper">
-      <ConfirmModal
-        id={CONFIRM_MODAL}
+      <CancelModal
+        isModalOpen={modalStates[CANCEL_MODAL]}
+        setIsModalOpen={() => closeModal(CANCEL_MODAL)}
+        url={url}
+        parentTaskID={props.parentTaskID}
+      />
+      <ResumeModal
+        isModalOpen={modalStates[RESUME_MODAL]}
+        setIsModalOpen={() => closeModal(RESUME_MODAL)}
+        url={url}
+        parentTaskID={props.parentTaskID}
+      />
+      <CancelSelectedModal
+        isModalOpen={modalStates[CANCEL_SELECTED_MODAL]}
+        setIsModalOpen={() => closeModal(CANCEL_SELECTED_MODAL)}
         url={url}
+        uriQuery={uriQuery}
         parentTaskID={props.parentTaskID}
+      />
+      <ResumeSelectedModal
+        isModalOpen={modalStates[RESUME_SELECTED_MODAL]}
+        setIsModalOpen={() => closeModal(RESUME_SELECTED_MODAL)}
+        url={url}
         uriQuery={uriQuery}
-        setModalClosed={setModalClosed}
+        parentTaskID={props.parentTaskID}
+      />
+      <ForceUnlockModal
+        isModalOpen={modalStates[FORCE_UNLOCK_MODAL]}
+        setIsModalOpen={() => closeModal(FORCE_UNLOCK_MODAL)}
+        url={url}
+        parentTaskID={props.parentTaskID}
+      />
+      <ForceUnlockSelectedModal
+        isModalOpen={modalStates[FORCE_UNLOCK_SELECTED_MODAL]}
+        setIsModalOpen={() => closeModal(FORCE_UNLOCK_SELECTED_MODAL)}
+        url={url}
+        uriQuery={uriQuery}
+        parentTaskID={props.parentTaskID}
       />
       <PageLayout
         searchable

data/webpack/ForemanTasks/Components/TasksTable/__tests__/__snapshots__/TasksTablePage.test.js.snap

@@ -4,10 +4,50 @@ exports[`TasksTablePage rendering render with Breadcrubs and edit permissions 1`
 <div
   className="tasks-table-wrapper"
 >
-  <Connect(ConfirmModal)
-    id="ConfirmModal"
+  <TaskModal
+    isModalOpen={false}
     parentTaskID={null}
-    setModalClosed={[MockFunction]}
+    setIsModalOpen={[Function]}
+    url="/foreman_tasks/tasks?action=\\"some-name\\""
+  />
+  <TaskModal
+    isModalOpen={false}
+    parentTaskID={null}
+    setIsModalOpen={[Function]}
+    url="/foreman_tasks/tasks?action=\\"some-name\\""
+  />
+  <BulkTaskModal
+    isModalOpen={false}
+    parentTaskID={null}
+    setIsModalOpen={[Function]}
+    uriQuery={
+      Object {
+        "state": "stopped",
+      }
+    }
+    url="/foreman_tasks/tasks?action=\\"some-name\\""
+  />
+  <BulkTaskModal
+    isModalOpen={false}
+    parentTaskID={null}
+    setIsModalOpen={[Function]}
+    uriQuery={
+      Object {
+        "state": "stopped",
+      }
+    }
+    url="/foreman_tasks/tasks?action=\\"some-name\\""
+  />
+  <TaskModal
+    isModalOpen={false}
+    parentTaskID={null}
+    setIsModalOpen={[Function]}
+    url="/foreman_tasks/tasks?action=\\"some-name\\""
+  />
+  <BulkTaskModal
+    isModalOpen={false}
+    parentTaskID={null}
+    setIsModalOpen={[Function]}
     uriQuery={
       Object {
         "state": "stopped",
@@ -156,10 +196,50 @@ exports[`TasksTablePage rendering render with minimal props 1`] = `
 <div
   className="tasks-table-wrapper"
 >
-  <Connect(ConfirmModal)
-    id="ConfirmModal"
+  <TaskModal
+    isModalOpen={false}
+    parentTaskID={null}
+    setIsModalOpen={[Function]}
+    url="/foreman_tasks/tasks?action=\\"some-name\\""
+  />
+  <TaskModal
+    isModalOpen={false}
+    parentTaskID={null}
+    setIsModalOpen={[Function]}
+    url="/foreman_tasks/tasks?action=\\"some-name\\""
+  />
+  <BulkTaskModal
+    isModalOpen={false}
+    parentTaskID={null}
+    setIsModalOpen={[Function]}
+    uriQuery={
+      Object {
+        "state": "stopped",
+      }
+    }
+    url="/foreman_tasks/tasks?action=\\"some-name\\""
+  />
+  <BulkTaskModal
+    isModalOpen={false}
+    parentTaskID={null}
+    setIsModalOpen={[Function]}
+    uriQuery={
+      Object {
+        "state": "stopped",
+      }
+    }
+    url="/foreman_tasks/tasks?action=\\"some-name\\""
+  />
+  <TaskModal
+    isModalOpen={false}
+    parentTaskID={null}
+    setIsModalOpen={[Function]}
+    url="/foreman_tasks/tasks?action=\\"some-name\\""
+  />
+  <BulkTaskModal
+    isModalOpen={false}
     parentTaskID={null}
-    setModalClosed={[MockFunction]}
+    setIsModalOpen={[Function]}
     uriQuery={
       Object {
         "state": "stopped",

data/webpack/ForemanTasks/Components/common/ClickConfirmation/ClickConfirmation.test.js

@@ -1,44 +1,230 @@
 import React from 'react';
-import { testComponentSnapshotsWithFixtures, mount } from '@theforeman/test';
-import { useForemanModal } from 'foremanReact/components/ForemanModal/ForemanModalHooks';
-import { ClickConfirmation } from './';
-
-const fixtures = {
-  render: {
-    title: 'some-title',
-    confirmType: 'danger',
-    body: 'some-body',
-    confirmationMessage: 'some-message',
-    id: 'some-id',
-    confirmAction: 'some-confirm',
-    onClick: jest.fn(),
-  },
-};
+import { render, screen, fireEvent } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import {
+  ClickConfirmation,
+  UnlockConfirmationModal,
+  ForceUnlockConfirmationModal,
+} from './';
 
 describe('ClickConfirmation', () => {
-  testComponentSnapshotsWithFixtures(ClickConfirmation, fixtures);
-  it('enable button on checkbox click', () => {
-    const component = mount(<ClickConfirmation {...fixtures.render} />);
-    const getButton = () => component.find('.confirm-button').at(0);
-    expect(getButton().props().disabled).toBeTruthy();
-    const checkbox = component.find('input').at(0);
-    checkbox.simulate('change', { target: { checked: true } });
-    expect(getButton().props().disabled).toBeFalsy();
-  });
-
-  it('click test', () => {
-    const setModalClosed = jest.fn();
-    useForemanModal.mockImplementation(id => ({
-      setModalClosed: () => setModalClosed(id),
-    }));
-    const onClick = jest.fn();
-    const props = { ...fixtures.render, onClick };
-    const component = mount(<ClickConfirmation {...props} />);
-    const getButton = () => component.find('.confirm-button').at(0);
-    const checkbox = component.find('input').at(0);
-    checkbox.simulate('change', { target: { checked: true } });
-    getButton().simulate('click');
-    expect(onClick).toBeCalled();
-    expect(setModalClosed).toBeCalledWith({ id: fixtures.render.id });
+  const defaultProps = {
+    title: 'Test Modal',
+    body: 'This is a test modal body',
+    confirmationMessage: 'I understand the consequences',
+    confirmAction: 'Confirm',
+    onClick: jest.fn(),
+    id: 'test-modal',
+    isOpen: true,
+    setModalClosed: jest.fn(),
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('Basic Rendering', () => {
+    it('renders modal with correct title and content when open', () => {
+      render(<ClickConfirmation {...defaultProps} />);
+
+      expect(screen.getByText('Test Modal')).toBeInTheDocument();
+      expect(screen.getByText('This is a test modal body')).toBeInTheDocument();
+      expect(
+        screen.getByText('I understand the consequences')
+      ).toBeInTheDocument();
+      expect(screen.getByText('Confirm')).toBeInTheDocument();
+    });
+
+    it('does not render modal when isOpen is false', () => {
+      render(<ClickConfirmation {...defaultProps} isOpen={false} />);
+
+      expect(screen.queryByText('Test Modal')).not.toBeInTheDocument();
+    });
+
+    it('renders with warning variant by default', () => {
+      render(<ClickConfirmation {...defaultProps} />);
+
+      const modal = screen.getByRole('dialog');
+      expect(modal).toBeInTheDocument();
+    });
+
+    it('renders with danger variant when specified', () => {
+      render(<ClickConfirmation {...defaultProps} confirmType="danger" />);
+
+      const confirmButton = screen.getByRole('button', { name: 'Confirm' });
+      expect(confirmButton).toHaveClass('pf-m-danger');
+    });
+  });
+
+  describe('Checkbox Interaction', () => {
+    it('starts with checkbox unchecked and confirm button disabled', () => {
+      render(<ClickConfirmation {...defaultProps} />);
+
+      const checkbox = screen.getByRole('checkbox');
+      const confirmButton = screen.getByRole('button', { name: 'Confirm' });
+
+      expect(checkbox).not.toBeChecked();
+      expect(confirmButton).toBeDisabled();
+    });
+
+    it('enables confirm button when checkbox is checked', () => {
+      render(<ClickConfirmation {...defaultProps} />);
+
+      const checkbox = screen.getByRole('checkbox');
+      const confirmButton = screen.getByRole('button', { name: 'Confirm' });
+
+      fireEvent.click(checkbox);
+
+      expect(checkbox).toBeChecked();
+      expect(confirmButton).toBeEnabled();
+    });
+
+    it('disables confirm button when checkbox is unchecked', () => {
+      render(<ClickConfirmation {...defaultProps} />);
+
+      const checkbox = screen.getByRole('checkbox');
+      const confirmButton = screen.getByRole('button', { name: 'Confirm' });
+
+      // Check the checkbox first
+      fireEvent.click(checkbox);
+      expect(confirmButton).toBeEnabled();
+
+      // Uncheck the checkbox
+      fireEvent.click(checkbox);
+      expect(checkbox).not.toBeChecked();
+      expect(confirmButton).toBeDisabled();
+    });
+  });
+
+  describe('Button Actions', () => {
+    it('calls onClick and setModalClosed when confirm button is clicked', () => {
+      const onClick = jest.fn();
+      const setModalClosed = jest.fn();
+
+      render(
+        <ClickConfirmation
+          {...defaultProps}
+          onClick={onClick}
+          setModalClosed={setModalClosed}
+        />
+      );
+
+      const checkbox = screen.getByRole('checkbox');
+      const confirmButton = screen.getByRole('button', { name: 'Confirm' });
+
+      // Enable the button by checking the checkbox
+      fireEvent.click(checkbox);
+
+      // Click the confirm button
+      fireEvent.click(confirmButton);
+
+      expect(onClick).toHaveBeenCalledTimes(1);
+      expect(setModalClosed).toHaveBeenCalledTimes(1);
+    });
+
+    it('calls setModalClosed when cancel button is clicked', () => {
+      const setModalClosed = jest.fn();
+
+      render(
+        <ClickConfirmation {...defaultProps} setModalClosed={setModalClosed} />
+      );
+
+      const cancelButton = screen.getByRole('button', { name: 'Cancel' });
+      fireEvent.click(cancelButton);
+
+      expect(setModalClosed).toHaveBeenCalledTimes(1);
+    });
+
+    it('does not call onClick when confirm button is clicked while disabled', () => {
+      const onClick = jest.fn();
+
+      render(<ClickConfirmation {...defaultProps} onClick={onClick} />);
+
+      const confirmButton = screen.getByRole('button', { name: 'Confirm' });
+
+      // Try to click the disabled button
+      fireEvent.click(confirmButton);
+
+      expect(onClick).not.toHaveBeenCalled();
+    });
+  });
+});
+
+describe('UnlockModal', () => {
+  const defaultProps = {
+    onClick: jest.fn(),
+    id: 'unlock-modal',
+    isOpen: true,
+    setModalClosed: jest.fn(),
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders with correct unlock-specific content and warning variant', () => {
+    render(<UnlockConfirmationModal {...defaultProps} />);
+
+    expect(
+      screen.getByRole('heading', { name: 'Warning alert: Unlock' })
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        /This will unlock the resources that the task is running against/
+      )
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        'I understand that this may cause harm and have working database backups of all backend services.'
+      )
+    ).toBeInTheDocument();
+
+    const confirmButton = screen.getByRole('button', { name: 'Unlock' });
+    expect(confirmButton).toBeInTheDocument();
+    expect(confirmButton).toHaveClass('pf-m-primary');
+  });
+});
+
+describe('ForceUnlockModal', () => {
+  const defaultProps = {
+    onClick: jest.fn(),
+    id: 'force-unlock-modal',
+    selectedRowsLen: 3,
+    isOpen: true,
+    setModalClosed: jest.fn(),
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('renders with correct force unlock-specific content and danger variant', () => {
+    render(<ForceUnlockConfirmationModal {...defaultProps} />);
+
+    expect(
+      screen.getByRole('heading', { name: 'Danger alert: Force Unlock' })
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(/Resources for 3 task\(s\) will be unlocked/)
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        'I understand that this may cause harm and have working database backups of all backend services.'
+      )
+    ).toBeInTheDocument();
+
+    const confirmButton = screen.getByRole('button', { name: 'Force Unlock' });
+    expect(confirmButton).toBeInTheDocument();
+    expect(confirmButton).toHaveClass('pf-m-danger');
+  });
+
+  it('displays correct number of tasks in body', () => {
+    render(
+      <ForceUnlockConfirmationModal {...defaultProps} selectedRowsLen={5} />
+    );
+
+    expect(
+      screen.getByText(/Resources for 5 task\(s\) will be unlocked/)
+    ).toBeInTheDocument();
   });
 });