Merge pull request openshift-pipelines#100 from vikram-raj/loading-modal

OCPBUGS-33257: Fix loader for start pipeline and add trigger modal

src/components/modals/LoadingModal.tsx

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { ModalFooter, ModalWrapper } from './modal';
+import { LoadingBox } from '../status/status-box';
+import { ActionGroup, Button } from '@patternfly/react-core';
+import { useTranslation } from 'react-i18next';
+
+type LoadingModalProps = {
+  onClose: () => void;
+};
+
+const LoadingModal: React.FC<LoadingModalProps> = ({ onClose }) => {
+  const { t } = useTranslation('plugin__pipelines-console-plugin');
+  return (
+    <ModalWrapper>
+      <LoadingBox />
+      <ModalFooter inProgress={false}>
+        <ActionGroup className="pf-v5-c-form pf-v5-c-form__actions--right pf-v5-c-form__group--no-top-margin">
+          <Button type="button" variant="secondary" onClick={onClose}>
+            {t('Cancel')}
+          </Button>
+        </ActionGroup>
+      </ModalFooter>
+    </ModalWrapper>
+  );
+};
+
+export default LoadingModal;

src/components/pipelines-list/PipelineKebab.tsx

@@ -162,10 +162,10 @@ const PipelineKebab: React.FC<PipelineKebabProps> = ({ pipeline }) => {
     ...(pipeline.latestRun
       ? [
           <DropdownItem
-            key="start-pipeline"
+            key="start-last-run"
             component="button"
             isDisabled={!canCreateResource}
-            data-test-action="start-pipeline"
+            data-test-action="start-last-run"
             onClick={rerunPipelineAndRedirect}
           >
             {t('Start last run')}

src/components/start-pipeline/AddTriggerModal.tsx

@@ -3,7 +3,6 @@ import { Formik } from 'formik';
 import { useTranslation } from 'react-i18next';
 import { AddTriggerFormValues, PipelineKind } from '../../types';
 import { ModalComponentProps, ModalWrapper } from '../modals/modal';
-import { LoadingInline } from '../status/status-box';
 import { convertPipelineToModalData } from './utils';
 import ModalStructure from '../modals/ModalStructure';
 import { ModalComponent } from '@openshift-console/dynamic-plugin-sdk/lib/app/modal-support/ModalProvider';
@@ -12,6 +11,7 @@ import { TRIGGER_BINDING_EMPTY } from '../../consts';
 import AddTriggerForm from './AddTriggerForm';
 import { submitTrigger } from './submit-utils';
 import { addTriggerSchema } from './validation-utils';
+import LoadingModal from '../modals/LoadingModal';
 
 type AddTriggerModalProps = ModalComponentProps & {
   pipeline: PipelineKind;
@@ -28,7 +28,7 @@ const AddTriggerModal: ModalComponent<AddTriggerModalProps> = ({
   );
 
   if (!pipelinePVCLoaded) {
-    return <LoadingInline />;
+    return <LoadingModal onClose={closeModal} />;
   }
   const initialValues: AddTriggerFormValues = {
     ...convertPipelineToModalData(pipeline, pipelinePVC?.metadata?.name),

src/components/start-pipeline/StartPipelineModal.tsx

@@ -15,8 +15,8 @@ import {
   useUserAnnotationForManualStart,
 } from '../hooks/hooks';
 import { ModalComponent } from '@openshift-console/dynamic-plugin-sdk/lib/app/modal-support/ModalProvider';
-import { LoadingInline } from '../Loading';
 import './StartPipelineModal.scss';
+import LoadingModal from '../modals/LoadingModal';
 
 export interface StartPipelineModalProps {
   pipeline: PipelineKind;
@@ -33,7 +33,7 @@ const StartPipelineModal: ModalComponent<
   );
 
   if (!pipelinePVCLoaded) {
-    return <LoadingInline />;
+    return <LoadingModal onClose={closeModal} />;
   }
 
   const initialValues: StartPipelineFormValues = {