foreman-tasks 1.0.0 → 1.0.1

data/webpack/ForemanTasks/Components/TasksTable/Components/__test__/TableSelectionCell.test.js

@@ -1,4 +1,4 @@
-import { testComponentSnapshotsWithFixtures } from 'react-redux-test-utils';
+import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
 
 import TableSelectionCell from '../TableSelectionCell';
 

data/webpack/ForemanTasks/Components/TasksTable/Components/__test__/TableSelectionHeaderCell.test.js

@@ -1,4 +1,4 @@
-import { testComponentSnapshotsWithFixtures } from 'react-redux-test-utils';
+import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
 
 import TableSelectionHeaderCell from '../TableSelectionHeaderCell';
 

data/webpack/ForemanTasks/Components/TasksTable/Components/__test__/__snapshots__/CancelConfirm.test.js.snap

@@ -0,0 +1,65 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CancelConfirm renders CANCEL modal 1`] = `
+<ForemanModal
+  id="cancelConfirmModal"
+  title="Cancel Selected Tasks"
+>
+  <Component />
+  This will cancel 1 task(s), putting them in the stopped state. Are you sure?
+  <Component>
+    <Button
+      active={false}
+      block={false}
+      bsClass="btn"
+      bsStyle="default"
+      disabled={false}
+      onClick={[Function]}
+    >
+      No
+    </Button>
+    <Button
+      active={false}
+      block={false}
+      bsClass="btn"
+      bsStyle="primary"
+      disabled={false}
+      onClick={[Function]}
+    >
+      Yes
+    </Button>
+  </Component>
+</ForemanModal>
+`;
+
+exports[`CancelConfirm renders CANCEL_SELECTED modal 1`] = `
+<ForemanModal
+  id="cancelSelectedConfirmModal"
+  title="Cancel Selected Tasks"
+>
+  <Component />
+  This will cancel 1 task(s), putting them in the stopped state. Are you sure?
+  <Component>
+    <Button
+      active={false}
+      block={false}
+      bsClass="btn"
+      bsStyle="default"
+      disabled={false}
+      onClick={[Function]}
+    >
+      No
+    </Button>
+    <Button
+      active={false}
+      block={false}
+      bsClass="btn"
+      bsStyle="primary"
+      disabled={false}
+      onClick={[Function]}
+    >
+      Yes
+    </Button>
+  </Component>
+</ForemanModal>
+`;

data/webpack/ForemanTasks/Components/TasksTable/Components/__test__/__snapshots__/ConfirmationModals.test.js.snap

@@ -0,0 +1,30 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ConfirmationModals renders ConfirmationModals 1`] = `
+<Fragment>
+  <CancelConfirm
+    action={[MockFunction]}
+    closeModal={[MockFunction]}
+    id="cancelConfirmModal"
+    selectedRowsLen={1}
+  />
+  <ResumeConfirm
+    action={[MockFunction]}
+    closeModal={[MockFunction]}
+    id="resumeConfirmModal"
+    selectedRowsLen={1}
+  />
+  <CancelConfirm
+    action={[MockFunction]}
+    closeModal={[MockFunction]}
+    id="cancelSelectedConfirmModal"
+    selectedRowsLen={7}
+  />
+  <ResumeConfirm
+    action={[MockFunction]}
+    closeModal={[MockFunction]}
+    id="resumeSelectedConfirmModal"
+    selectedRowsLen={7}
+  />
+</Fragment>
+`;

data/webpack/ForemanTasks/Components/TasksTable/Components/__test__/__snapshots__/ResumeConfirm.test.js.snap

@@ -0,0 +1,63 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ResumeConfirm renders RESUME modal 1`] = `
+<ForemanModal
+  id="resumeConfirmModal"
+  title="Resume Selected Tasks"
+>
+  This will resume 3 task(s), putting them in the running state. Are you sure?
+  <Component>
+    <Button
+      active={false}
+      block={false}
+      bsClass="btn"
+      bsStyle="default"
+      disabled={false}
+      onClick={[Function]}
+    >
+      No
+    </Button>
+    <Button
+      active={false}
+      block={false}
+      bsClass="btn"
+      bsStyle="primary"
+      disabled={false}
+      onClick={[Function]}
+    >
+      Yes
+    </Button>
+  </Component>
+</ForemanModal>
+`;
+
+exports[`ResumeConfirm renders RESUME_SELECTED modal 1`] = `
+<ForemanModal
+  id="resumeSelectedConfirmModal"
+  title="Resume Selected Tasks"
+>
+  This will resume 3 task(s), putting them in the running state. Are you sure?
+  <Component>
+    <Button
+      active={false}
+      block={false}
+      bsClass="btn"
+      bsStyle="default"
+      disabled={false}
+      onClick={[Function]}
+    >
+      No
+    </Button>
+    <Button
+      active={false}
+      block={false}
+      bsClass="btn"
+      bsStyle="primary"
+      disabled={false}
+      onClick={[Function]}
+    >
+      Yes
+    </Button>
+  </Component>
+</ForemanModal>
+`;

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

@@ -17,21 +17,20 @@ const TasksTable = ({
   history,
   itemCount,
   pagination,
-  cancelTask,
-  resumeTask,
   selectedRows,
   selectAllRows,
   unselectAllRows,
   selectRow,
   unselectRow,
-  parentTaskID,
+  openClickedModal,
+  modalProps,
 }) => {
   const url = history.location.pathname + history.location.search;
   const uriQuery = getURIQuery(url);
 
   useEffect(() => {
     getTableItems(url);
-  }, [history.location.search]);
+  }, [getTableItems, url]);
 
   const getSelectionController = () => {
     const checkAllRowsSelected = () => results.length === selectedRows.length;
@@ -82,11 +81,19 @@ const TasksTable = ({
   };
 
   const taskActions = {
-    cancel: (id, name) => {
-      cancelTask(id, name, url, parentTaskID);
+    cancelTask: (taskId, taskName) => {
+      openClickedModal({
+        taskId,
+        taskName,
+        setModalOpen: modalProps.cancelModal.setModalOpen,
+      });
     },
-    resume: (id, name) => {
-      resumeTask(id, name, url, parentTaskID);
+    resumeTask: (taskId, taskName) => {
+      openClickedModal({
+        taskId,
+        taskName,
+        setModalOpen: modalProps.resumeModal.setModalOpen,
+      });
     },
   };
 
@@ -126,14 +133,18 @@ TasksTable.propTypes = {
     perPage: PropTypes.number,
   }),
   history: PropTypes.object.isRequired,
-  cancelTask: PropTypes.func.isRequired,
-  resumeTask: PropTypes.func.isRequired,
+  openClickedModal: PropTypes.func.isRequired,
   selectedRows: PropTypes.array,
   selectAllRows: PropTypes.func.isRequired,
   unselectAllRows: PropTypes.func.isRequired,
   selectRow: PropTypes.func.isRequired,
   unselectRow: PropTypes.func.isRequired,
-  parentTaskID: PropTypes.string,
+  modalProps: PropTypes.shape({
+    cancelSelectedModal: PropTypes.object,
+    resumeSelectedModal: PropTypes.object,
+    cancelModal: PropTypes.object,
+    resumeModal: PropTypes.object,
+  }).isRequired,
 };
 
 TasksTable.defaultProps = {
@@ -144,7 +155,6 @@ TasksTable.defaultProps = {
     perPage: 20,
   },
   selectedRows: [],
-  parentTaskID: null,
 };
 
 export default TasksTable;

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

@@ -8,10 +8,9 @@ import {
   SELECT_ROWS,
   UNSELECT_ALL_ROWS,
   UNSELECT_ROWS,
-  TASKS_TABLE_SELECTED_MODAL,
-  CLOSED,
   RESUME,
   CANCEL,
+  UPDATE_CLICKED,
 } from './TasksTableConstants';
 import { getApiPathname } from './TasksTableHelpers';
 import { fetchTasksSummary } from '../TasksDashboard/TasksDashboardActions';
@@ -94,7 +93,12 @@ export const unselectRow = id => ({
   payload: id,
 });
 
-export const actionSelected = (actionType, selected, url) => async dispatch => {
+export const actionSelected = (
+  actionType,
+  selected,
+  url,
+  parentTaskID
+) => async dispatch => {
   let notAllActionable = false;
   let someActionable = false;
   const promises = selected.map(task => {
@@ -122,21 +126,14 @@ export const actionSelected = (actionType, selected, url) => async dispatch => {
   if (someActionable) {
     await Promise.all(promises);
     dispatch(getTableItems(url));
-    dispatch(fetchTasksSummary(getURIQuery(url).time));
+    dispatch(fetchTasksSummary(getURIQuery(url).time, parentTaskID));
   }
 };
 
-export const showCancelSelcetedModal = () => ({
-  type: TASKS_TABLE_SELECTED_MODAL,
-  payload: CANCEL,
-});
-
-export const showResumeSelcetedModal = () => ({
-  type: TASKS_TABLE_SELECTED_MODAL,
-  payload: RESUME,
-});
-
-export const hideSelcetedModal = () => ({
-  type: TASKS_TABLE_SELECTED_MODAL,
-  payload: CLOSED,
-});
+export const openClickedModal = ({ taskId, taskName, setModalOpen }) => {
+  setModalOpen();
+  return {
+    type: UPDATE_CLICKED,
+    payload: { clicked: { taskId, taskName } },
+  };
+};

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

@@ -10,7 +10,11 @@ export const UNSELECT_ROWS = 'UNSELECT_ROWS';
 export const UNSELECT_ALL_ROWS = 'UNSELECT_ALL_ROWS';
 export const CANCEL = 'CANCEL';
 export const RESUME = 'RESUME';
-export const CLOSED = 'CLOSED';
 
-export const TASKS_TABLE_SELECTED_MODAL = 'TASKS_TABLE_SELECTED_MODAL';
+export const CANCEL_CONFIRM_MODAL_ID = 'cancelConfirmModal';
+export const RESUME_CONFIRM_MODAL_ID = 'resumeConfirmModal';
+export const CANCEL_SELECTED_CONFIRM_MODAL_ID = 'cancelSelectedConfirmModal';
+export const RESUME_SELECTED_CONFIRM_MODAL_ID = 'resumeSelectedConfirmModal';
+export const UPDATE_CLICKED = 'UPDATE_CLICKED';
+
 export const TASKS_SEARCH_PROPS = getControllerSearchProps('tasks');

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

@@ -7,20 +7,24 @@ 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 { resolveSearchQuery, addSearchToURL } from './TasksTableHelpers';
-import { CancelResumeConfirm } from './Components/CancelResumeConfirm';
+import { ConfirmationModals } from './Components/ConfirmationModals';
 import {
   TASKS_SEARCH_PROPS,
   RESUME,
   CANCEL,
-  CLOSED,
+  CANCEL_SELECTED_CONFIRM_MODAL_ID,
+  RESUME_SELECTED_CONFIRM_MODAL_ID,
+  RESUME_CONFIRM_MODAL_ID,
+  CANCEL_CONFIRM_MODAL_ID,
 } from './TasksTableConstants';
 import { ActionSelectButton } from './Components/ActionSelectButton';
 import './TasksTablePage.scss';
 
-const TasksTablePage = ({ getBreadcrumbs, history, ...props }) => {
+const TasksTablePage = ({ getBreadcrumbs, history, clicked, ...props }) => {
   const url = history.location.pathname + history.location.search;
   const uriQuery = getURIQuery(url);
   const onSearch = searchQuery => {
@@ -40,18 +44,47 @@ const TasksTablePage = ({ getBreadcrumbs, history, ...props }) => {
     }));
   };
 
-  const TaskSelectedAction = (id, name) => {
-    props.actionSelected(id, name, url);
+  const modalProps = {
+    cancelSelectedModal: useForemanModal({
+      id: CANCEL_SELECTED_CONFIRM_MODAL_ID,
+    }),
+    resumeSelectedModal: useForemanModal({
+      id: RESUME_SELECTED_CONFIRM_MODAL_ID,
+    }),
+    cancelModal: useForemanModal({ id: CANCEL_CONFIRM_MODAL_ID }),
+    resumeModal: useForemanModal({ id: RESUME_CONFIRM_MODAL_ID }),
   };
 
+  const tasksActions = {
+    cancelSelectedTasks: () => {
+      props.actionSelected(CANCEL, getSelected(), url, props.parentTaskID);
+    },
+    cancelTask: () => {
+      props.cancelTask(
+        clicked.taskId,
+        clicked.taskName,
+        url,
+        props.parentTaskID
+      );
+    },
+    resumeSelectedTasks: () => {
+      props.actionSelected(RESUME, getSelected(), url, props.parentTaskID);
+    },
+    resumeTask: () => {
+      props.resumeTask(
+        clicked.taskId,
+        clicked.taskName,
+        url,
+        props.parentTaskID
+      );
+    },
+  };
   return (
     <div className="tasks-table-wrapper">
-      <CancelResumeConfirm
-        closeModal={props.hideSelcetedModal}
-        action={TaskSelectedAction}
-        selected={getSelected()}
-        modalStatus={props.modalStatus}
+      <ConfirmationModals
+        tasksActions={tasksActions}
         selectedRowsLen={props.selectedRows.length}
+        modalProps={modalProps}
       />
       <PageLayout
         searchable
@@ -68,8 +101,8 @@ const TasksTablePage = ({ getBreadcrumbs, history, ...props }) => {
             />
             <ActionSelectButton
               disabled={props.selectedRows.length < 1}
-              onCancel={props.showCancelSelcetedModal}
-              onResume={props.showResumeSelcetedModal}
+              onCancel={modalProps.cancelSelectedModal.setModalOpen}
+              onResume={modalProps.resumeSelectedModal.setModalOpen}
             />
           </React.Fragment>
         }
@@ -78,7 +111,7 @@ const TasksTablePage = ({ getBreadcrumbs, history, ...props }) => {
           <TasksDashboard history={history} parentTaskID={props.parentTaskID} />
         }
       >
-        <TasksTable history={history} {...props} />
+        <TasksTable history={history} {...props} modalProps={modalProps} />
       </PageLayout>
     </div>
   );
@@ -92,20 +125,23 @@ TasksTablePage.propTypes = {
   status: PropTypes.oneOf(Object.keys(STATUS)),
   history: PropTypes.object.isRequired,
   actionSelected: PropTypes.func.isRequired,
+  cancelTask: PropTypes.func.isRequired,
+  resumeTask: PropTypes.func.isRequired,
   selectedRows: PropTypes.arrayOf(PropTypes.string),
-  showResumeSelcetedModal: PropTypes.func.isRequired,
-  showCancelSelcetedModal: PropTypes.func.isRequired,
-  hideSelcetedModal: PropTypes.func.isRequired,
-  modalStatus: PropTypes.oneOf([CANCEL, RESUME, CLOSED]),
   parentTaskID: PropTypes.string,
+  clicked: PropTypes.shape({
+    taskId: PropTypes.string,
+    taskName: PropTypes.string,
+    parentTaskID: PropTypes.string,
+  }),
 };
 
 TasksTablePage.defaultProps = {
   actionName: '',
   status: STATUS.PENDING,
   selectedRows: [],
-  modalStatus: CLOSED,
   parentTaskID: null,
+  clicked: {},
 };
 
 export default TasksTablePage;