Show VMs in migration plan creation wizard

Signed-off-by: Alexander Wels <[email protected]>
migtools · Jun 14, 2024 · 589805a · 589805a
1 parent 67e4ee3
commit 589805a
Show file tree

Hide file tree

Showing 4 changed files with 1,210 additions and 1,698 deletions.
diff --git a/package.json b/package.json
@@ -57,7 +57,6 @@
     "jest": "^26.0.1",
     "json-merge-patch": "^0.2.3",
     "mini-css-extract-plugin": "^1.5.0",
-    "node-sass": "^7.0.0",
     "nodemon": "^2.0.4",
     "prettier": "^2.2.1",
     "redux-mock-store": "^1.5.4",
@@ -129,6 +128,5 @@
     "optionator": "^0.9.3",
     "semver": "7.5.2",
     "tough-cookie": "4.1.3"
-
   }
 }
diff --git a/src/app/home/pages/PlansPage/components/Wizard/NamespacesTable.tsx b/src/app/home/pages/PlansPage/components/Wizard/NamespacesTable.tsx
@@ -1,52 +1,52 @@
-import React, { useEffect } from 'react';
-import { useFormikContext } from 'formik';
-import { IFormValues } from './WizardContainer';
 import {
+  Button,
+  DropdownDirection,
+  Flex,
+  FlexItem,
+  FormGroup,
   GridItem,
-  Text,
-  TextContent,
-  TextVariants,
   Level,
   LevelItem,
   Pagination,
   PaginationVariant,
-  DropdownDirection,
-  TextInput,
-  FlexItem,
-  Flex,
   Popover,
   PopoverPosition,
-  FormGroup,
-  Button,
+  Text,
+  TextContent,
+  TextInput,
+  TextVariants,
 } from '@patternfly/react-core';
+import { OutlinedQuestionCircleIcon } from '@patternfly/react-icons';
+import CheckIcon from '@patternfly/react-icons/dist/js/icons/check-icon';
+import PencilAltIcon from '@patternfly/react-icons/dist/js/icons/pencil-alt-icon';
+import TimesIcon from '@patternfly/react-icons/dist/js/icons/times-icon';
+import spacing from '@patternfly/react-styles/css/utilities/Spacing/spacing';
 import {
   IRowData,
-  sortable,
   TableComposable,
   Tbody,
   Td,
   Th,
   Thead,
   Tr,
+  sortable,
 } from '@patternfly/react-table';
-import spacing from '@patternfly/react-styles/css/utilities/Spacing/spacing';
-import { useFilterState, useSortState } from '../../../../../common/duck/hooks';
+import { useFormikContext } from 'formik';
+import React, { useEffect } from 'react';
+import { useSelector } from 'react-redux';
+import { DefaultRootState } from '../../../../../../configureStore';
 import {
-  FilterToolbar,
   FilterCategory,
+  FilterToolbar,
   FilterType,
 } from '../../../../../common/components/FilterToolbar';
 import TableEmptyState from '../../../../../common/components/TableEmptyState';
+import { useFilterState, useSortState } from '../../../../../common/duck/hooks';
 import { usePaginationState } from '../../../../../common/duck/hooks/usePaginationState';
-import CheckIcon from '@patternfly/react-icons/dist/js/icons/check-icon';
-import TimesIcon from '@patternfly/react-icons/dist/js/icons/times-icon';
-import PencilAltIcon from '@patternfly/react-icons/dist/js/icons/pencil-alt-icon';
-import { OutlinedQuestionCircleIcon } from '@patternfly/react-icons';
 import { useDelayValidation, validatedState } from '../../../../../common/helpers';
-import { ISourceClusterNamespace } from '../../../../../plan/duck/types';
-import { useSelector } from 'react-redux';
 import { planSelectors } from '../../../../../plan/duck';
-import { DefaultRootState } from '../../../../../../configureStore';
+import { ISourceClusterNamespace } from '../../../../../plan/duck/types';
+import { IFormValues } from './WizardContainer';
 const styles = require('./NamespacesTable.module').default;
 
 const NamespacesTable: React.FunctionComponent = () => {
@@ -68,6 +68,7 @@ const NamespacesTable: React.FunctionComponent = () => {
     { title: 'Pods', transforms: [sortable] },
     { title: 'PV claims', transforms: [sortable] },
     { title: 'Services', transforms: [sortable] },
+    { title: 'Virtual Machines', transforms: [sortable] },
     values.migrationType.value !== 'scc' && { title: 'Target name', transforms: [sortable] },
   ];
   const getSortValues = (namespace: any) => [
@@ -122,6 +123,7 @@ const NamespacesTable: React.FunctionComponent = () => {
         namespace.podCount,
         namespace.pvcCount,
         namespace.serviceCount,
+        namespace.vmCount,
         values.migrationType.value !== 'scc' && targetNamespaceName,
       ],
       selected: values.selectedNamespaces.includes(namespace.name),
@@ -229,10 +231,11 @@ const NamespacesTable: React.FunctionComponent = () => {
                 <Th width={10}>{columns[1].title}</Th>
                 <Th width={10}>{columns[2].title}</Th>
                 <Th width={10}>{columns[3].title}</Th>
+                <Th width={20}>{columns[4].title}</Th>
                 {values.migrationType.value !== 'scc' && (
                   <>
                     <Th width={30}>
-                      {columns[4].title}
+                      {columns[5].title}
                       <Popover
                         position={PopoverPosition.right}
                         bodyContent={
@@ -424,12 +427,12 @@ const NamespacesTable: React.FunctionComponent = () => {
                             onClick={() => {
                               setEditableRow(rowIndex);
                               handleDelayedValidation(
-                                typeof row.cells[4] === 'string' ? row.cells[4] : '',
+                                typeof row.cells[5] === 'string' ? row.cells[5] : '',
                                 row,
                                 rowIndex
                               );
                               setFieldValue(currentTargetNamespaceNameKey, {
-                                name: row.cells[4],
+                                name: row.cells[5],
                                 srcName: row.cells[0],
                               });
                             }}

diff --git a/src/app/plan/duck/types.ts b/src/app/plan/duck/types.ts
@@ -4,7 +4,6 @@ import {
   MigrationStepsType,
   MigrationType,
 } from '../../home/pages/PlansPage/types';
-import { ICurrentPlanStatus } from './reducers';
 
 export type PvCopyMethod = 'filesystem' | 'snapshot';
 
@@ -200,6 +199,7 @@ export interface ISourceClusterNamespace {
   podCount: number;
   pvcCount: number;
   serviceCount: number;
+  vmCount: number;
   id: string | number;
 }