From d76d70f41b17ab7ab27841ef03f7fc07f05a3792 Mon Sep 17 00:00:00 2001 From: yaacov Date: Thu, 6 Jun 2024 17:20:09 +0300 Subject: [PATCH] Add individual disk transfer modal Signed-off-by: yaacov --- .../en/plugin__forklift-console-plugin.json | 3 + .../views/details/PlanDetailsPage.style.css | 5 ++ .../MigrationVirtualMachinesRowExtended.tsx | 24 ++++++- .../modals/PipelineTasksModal.tsx | 66 +++++++++++++++++++ .../tabs/VirtualMachines/modals/index.ts | 1 + 5 files changed, 98 insertions(+), 1 deletion(-) create mode 100644 packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/modals/PipelineTasksModal.tsx diff --git a/packages/forklift-console-plugin/locales/en/plugin__forklift-console-plugin.json b/packages/forklift-console-plugin/locales/en/plugin__forklift-console-plugin.json index b39f9324b..b7ebdbfaf 100644 --- a/packages/forklift-console-plugin/locales/en/plugin__forklift-console-plugin.json +++ b/packages/forklift-console-plugin/locales/en/plugin__forklift-console-plugin.json @@ -319,6 +319,7 @@ "Password": "Password", "Path": "Path", "Persistent TPM/EFI": "Persistent TPM/EFI", + "Phase": "Phase", "Pipeline status": "Pipeline status", "Plan details": "Plan details", "Plan name": "Plan name", @@ -436,6 +437,7 @@ "Target namespace": "Target namespace", "Target namespace.": "Target namespace.", "Target provider": "Target provider", + "Tasks": "Tasks", "Template": "Template", "Tenant": "Tenant", "The certificate is not a valid PEM-encoded X.509 certificate": "The certificate is not a valid PEM-encoded X.509 certificate", @@ -468,6 +470,7 @@ "Total memory:": "Total memory:", "Total virtual machines": "Total virtual machines", "Total: {{length}}": "Total: {{length}}", + "Transfer": "Transfer", "Transfer Network": "Transfer Network", "True": "True", "Type": "Type", diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/details/PlanDetailsPage.style.css b/packages/forklift-console-plugin/src/modules/Plans/views/details/PlanDetailsPage.style.css index c920101de..658f502fd 100644 --- a/packages/forklift-console-plugin/src/modules/Plans/views/details/PlanDetailsPage.style.css +++ b/packages/forklift-console-plugin/src/modules/Plans/views/details/PlanDetailsPage.style.css @@ -124,6 +124,11 @@ cursor: pointer; } + +.forklift-page-plan-details-vm-tasks { + padding: 0; +} + .forklift-page-plan-details-vm-status__section-header { margin-bottom: var(--pf-global--spacer--xs); margin-top: var(--pf-global--spacer--md); diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/Migration/MigrationVirtualMachinesRowExtended.tsx b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/Migration/MigrationVirtualMachinesRowExtended.tsx index ab63c088c..faa8d54b1 100644 --- a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/Migration/MigrationVirtualMachinesRowExtended.tsx +++ b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/Migration/MigrationVirtualMachinesRowExtended.tsx @@ -1,19 +1,29 @@ import React from 'react'; import SectionHeading from 'src/components/headers/SectionHeading'; +import { useModal } from 'src/modules/Providers/modals'; import { useForkliftTranslation } from 'src/utils/i18n'; import { RowProps, TableComposable, Tbody, Td, Th, Thead, Tr } from '@kubev2v/common'; import { IoK8sApiBatchV1Job } from '@kubev2v/types'; import { ResourceLink, Timestamp } from '@openshift-console/dynamic-plugin-sdk'; import Status from '@openshift-console/dynamic-plugin-sdk/lib/app/components/status/Status'; -import { Flex, FlexItem, PageSection, ProgressStep, ProgressStepper } from '@patternfly/react-core'; +import { + Button, + Flex, + FlexItem, + PageSection, + ProgressStep, + ProgressStepper, +} from '@patternfly/react-core'; +import { PipelineTasksModal } from '../modals'; import { VMData } from '../types'; import { getIcon, getVariant } from './MigrationVirtualMachinesRow'; export const MigrationVirtualMachinesRowExtended: React.FC> = (props) => { const { t } = useForkliftTranslation(); + const { showModal } = useModal(); const pipeline = props.resourceData.statusVM?.pipeline; const conditions = props.resourceData.statusVM?.conditions; @@ -198,6 +208,7 @@ export const MigrationVirtualMachinesRowExtended: React.FC> = ( {t('Name')} {t('Description')} + {t('Tasks')} {t('Started at')} {t('Error')} @@ -218,6 +229,17 @@ export const MigrationVirtualMachinesRowExtended: React.FC> = ( {p?.name} {p?.description} + + {p?.tasks?.length > 0 && ( + + )} + diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/modals/PipelineTasksModal.tsx b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/modals/PipelineTasksModal.tsx new file mode 100644 index 000000000..39980675e --- /dev/null +++ b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/modals/PipelineTasksModal.tsx @@ -0,0 +1,66 @@ +import React from 'react'; +import { useModal } from 'src/modules/Providers/modals'; +import { useForkliftTranslation } from 'src/utils/i18n'; + +import { TableComposable, Tbody, Td, Th, Thead, Tr } from '@kubev2v/common'; +import { V1beta1PlanStatusMigrationVmsPipeline } from '@kubev2v/types'; +import { Timestamp } from '@openshift-console/dynamic-plugin-sdk'; +import { Modal, ModalVariant } from '@patternfly/react-core'; + +export interface PipelineTasksModalProps { + name: string; + tasks: V1beta1PlanStatusMigrationVmsPipeline[]; +} + +export const PipelineTasksModal: React.FC = ({ name, tasks }) => { + const { t } = useForkliftTranslation(); + const { toggleModal } = useModal(); + + return ( + + + + + {t('Name')} + {t('Phase')} + {t('Transfer')} + {t('Started at')} + {t('Error')} + + + + {(tasks || []).map((p) => ( + + {p?.name} + {p?.phase} + {getTransferProgress(p)} + + + + {p?.error?.reasons} + + ))} + + + + ); +}; + +const getTransferProgress = (diskTransfer) => { + if (!diskTransfer || !diskTransfer?.progress) { + return { completed: '-', total: '-' }; + } + + const { completed, total } = diskTransfer.progress; + + const completeString = completed !== undefined ? completed : '-'; + const totalString = total !== undefined ? total : '-'; + + return `${completeString} / ${totalString} ${diskTransfer.annotations?.unit || '-'}`; +}; diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/modals/index.ts b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/modals/index.ts index c3b3f1f72..d40f0e3ef 100644 --- a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/modals/index.ts +++ b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/modals/index.ts @@ -1,4 +1,5 @@ // @index(['./*', /style/g], f => `export * from '${f.path}';`) export * from './MigrationVMsCancelModal'; +export * from './PipelineTasksModal'; export * from './PlanVMsDeleteModal'; // @endindex