Fixes #38833 - Replace foremanModal usage with PF5 modals

webpack/ForemanTasks/Components/TaskDetails/Components/Task.js

@@ -1,7 +1,11 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { Grid, Row } from 'patternfly-react';
+import PropTypes from 'prop-types';
 import TaskInfo from './TaskInfo';
-import { ForceUnlockModal, UnlockModal } from '../../TaskActions/UnlockModals';
+import {
+  ForceUnlockConfirmationModal,
+  UnlockConfirmationModal,
+} from '../../common/ClickConfirmation';
 import { TaskButtons } from './TaskButtons';
 
 const Task = props => {
@@ -25,13 +29,29 @@ const Task = props => {
     }
     unlockTaskRequest(id, action);
   };
+  const [unlockModalOpen, setUnlockModalOpen] = useState(false);
+  const [forceUnlockModalOpen, setForceUnlockModalOpen] = useState(false);
+
   return (
     <React.Fragment>
-      <UnlockModal onClick={unlock} />
-      <ForceUnlockModal onClick={forceUnlock} />
+      <UnlockConfirmationModal
+        onClick={unlock}
+        isOpen={unlockModalOpen}
+        setModalClosed={() => setUnlockModalOpen(false)}
+      />
+      <ForceUnlockConfirmationModal
+        onClick={forceUnlock}
+        isOpen={forceUnlockModalOpen}
+        setModalClosed={() => setForceUnlockModalOpen(false)}
+      />
       <Grid>
         <Row>
-          <TaskButtons taskReloadStart={taskReloadStart} {...props} />
+          <TaskButtons
+            taskReloadStart={taskReloadStart}
+            setUnlockModalOpen={setUnlockModalOpen}
+            setForceUnlockModalOpen={setForceUnlockModalOpen}
+            {...props}
+          />
         </Row>
         <TaskInfo {...props} />
       </Grid>
@@ -40,13 +60,21 @@ const Task = props => {
 };
 
 Task.propTypes = {
-  ...TaskInfo.PropTypes,
-  ...TaskButtons.PropTypes,
+  taskReload: PropTypes.bool,
+  id: PropTypes.string,
+  forceCancelTaskRequest: PropTypes.func,
+  unlockTaskRequest: PropTypes.func,
+  action: PropTypes.string,
+  taskReloadStart: PropTypes.func,
 };
 
 Task.defaultProps = {
-  ...TaskInfo.defaultProps,
-  ...TaskButtons.defaultProps,
+  taskReload: false,
+  id: '',
+  forceCancelTaskRequest: () => null,
+  unlockTaskRequest: () => null,
+  action: '',
+  taskReloadStart: () => null,
 };
 
 export default Task;

webpack/ForemanTasks/Components/TaskDetails/Components/TaskButtons.js

@@ -1,12 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Col, Button } from 'patternfly-react';
-import { useForemanModal } from 'foremanReact/components/ForemanModal/ForemanModalHooks';
 import { translate as __ } from 'foremanReact/common/I18n';
-import {
-  UNLOCK_MODAL,
-  FORCE_UNLOCK_MODAL,
-} from '../../TaskActions/TaskActionsConstants';
 
 export const TaskButtons = ({
   canEdit,
@@ -24,13 +19,9 @@ export const TaskButtons = ({
   parentTask,
   cancelTaskRequest,
   resumeTaskRequest,
+  setUnlockModalOpen,
+  setForceUnlockModalOpen,
 }) => {
-  const unlockModalActions = useForemanModal({
-    id: UNLOCK_MODAL,
-  });
-  const forceUnlockModalActions = useForemanModal({
-    id: FORCE_UNLOCK_MODAL,
-  });
   const editActionsTitle = canEdit
     ? undefined
     : __('You do not have permission');
@@ -114,7 +105,9 @@ export const TaskButtons = ({
         className="unlock-button"
         bsSize="small"
         disabled={!canEdit || state !== 'paused'}
-        onClick={unlockModalActions.setModalOpen}
+        onClick={() => {
+          setUnlockModalOpen(true);
+        }}
         title={editActionsTitle}
         data-original-title={editActionsTitle}
       >
@@ -124,7 +117,7 @@ export const TaskButtons = ({
         className="force-unlock-button"
         bsSize="small"
         disabled={!canEdit || state === 'stopped'}
-        onClick={forceUnlockModalActions.setModalOpen}
+        onClick={() => setForceUnlockModalOpen(true)}
         title={editActionsTitle}
         data-original-title={editActionsTitle}
       >
@@ -134,7 +127,7 @@ export const TaskButtons = ({
   );
 };
 
-TaskButtons.propTypes = {
+export const TaskButtonspropTypes = {
   canEdit: PropTypes.bool,
   dynflowEnableConsole: PropTypes.bool,
   taskReloadStart: PropTypes.func.isRequired,
@@ -151,8 +144,7 @@ TaskButtons.propTypes = {
   cancelTaskRequest: PropTypes.func,
   resumeTaskRequest: PropTypes.func,
 };
-
-TaskButtons.defaultProps = {
+export const TaskButtonsdefaultProps = {
   canEdit: false,
   dynflowEnableConsole: false,
   taskReload: false,
@@ -166,3 +158,14 @@ TaskButtons.defaultProps = {
   cancelTaskRequest: () => null,
   resumeTaskRequest: () => null,
 };
+
+TaskButtons.propTypes = {
+  ...TaskButtonspropTypes,
+  setUnlockModalOpen: PropTypes.func,
+  setForceUnlockModalOpen: PropTypes.func,
+};
+TaskButtons.defaultProps = {
+  setUnlockModalOpen: () => null,
+  setForceUnlockModalOpen: () => null,
+  ...TaskButtonsdefaultProps,
+};