Skip to content

Commit

Permalink
Merge pull request #1094 from yaacov/show-vm-concern-assesments
Browse files Browse the repository at this point in the history
🐾 Show assessments rather than labels of concerns
  • Loading branch information
yaacov authored Apr 11, 2024
2 parents 4b3ef05 + d31a421 commit aa19f61
Show file tree
Hide file tree
Showing 8 changed files with 169 additions and 79 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@
"Archived": "Archived",
"Archiving": "Archiving",
"Are you sure you want to delete this virtual machines from the migration plan.": "Are you sure you want to delete this virtual machines from the migration plan.",
"Assessment": "Assessment",
"Authentication type": "Authentication type",
"Bandwidth": "Bandwidth",
"CA certificate": "CA certificate",
Expand Down Expand Up @@ -192,6 +193,7 @@
"Inventory server is not reachable. To troubleshoot, check the Forklift controller pod logs.": "Inventory server is not reachable. To troubleshoot, check the Forklift controller pod logs.",
"Issuer": "Issuer",
"Kubernetes name of the new migration Plan resource": "Kubernetes name of the new migration Plan resource",
"Label": "Label",
"List of objects depended by this object. If ALL objects in the list have been deleted,\n this object will be garbage collected. If this object is managed by a controller,\n then an entry in this list will point to this controller, with the controller field set to true.\n There cannot be more than one managing controller.": "List of objects depended by this object. If ALL objects in the list have been deleted,\n this object will be garbage collected. If this object is managed by a controller,\n then an entry in this list will point to this controller, with the controller field set to true.\n There cannot be more than one managing controller.",
"Loading": "Loading",
"Loading...": "Loading...",
Expand Down Expand Up @@ -249,6 +251,7 @@
"New name was generated for the Network Map due to naming conflict.": "New name was generated for the Network Map due to naming conflict.",
"New name was generated for the Storage Map due to naming conflict.": "New name was generated for the Storage Map due to naming conflict.",
"NICs with empty NIC profile": "NICs with empty NIC profile",
"No concerns found for this virtual machine.": "No concerns found for this virtual machine.",
"No credentials found.": "No credentials found.",
"No inventory data available.": "No inventory data available.",
"No Mapping found.": "No Mapping found.",
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
import React from 'react';
import { useForkliftTranslation } from 'src/utils/i18n';

import { RowProps, TableComposable, Tbody, Td, Th, Thead, Tr } from '@kubev2v/common';
import { HelperText, HelperTextItem, Label, PageSection } from '@patternfly/react-core';

import {
getCategoryColor,
getCategoryIcon,
getCategoryTitle,
groupConcernsByCategory,
} from '../utils';

import { VmData } from './VMCellProps';

/**
* React Component to display a table of concerns.
*/
export const ConcernsTable: React.FC<RowProps<VmData>> = ({ resourceData }) => {
const { t } = useForkliftTranslation();

if (!resourceData?.vm?.['concerns'] || resourceData?.vm?.['concerns']?.length < 1) {
return (
<PageSection>
<HelperText>
<HelperTextItem variant="indeterminate">
{t('No concerns found for this virtual machine.')}
</HelperTextItem>
</HelperText>
</PageSection>
);
}

const groupedConcerns = groupConcernsByCategory(resourceData?.vm?.['concerns']);

return (
<PageSection>
<TableComposable aria-label="Expandable table" variant="compact">
<Thead>
<Tr>
<Th width={10}>{t('Label')}</Th>
<Th width={10}>{t('Category')}</Th>
<Th width={30}>{t('Assessment')}</Th>
</Tr>
</Thead>
<Tbody>
{['Critical', 'Warning', 'Information'].map((category) =>
groupedConcerns?.[category]?.map((concern) => (
<Tr key={concern.label}>
<Td modifier="truncate">{concern.label}</Td>
<Td>
<Label
color={getCategoryColor(concern.category)}
icon={getCategoryIcon(concern.category)}
>
{getCategoryTitle(concern.category, t)}
</Label>
</Td>
<Td>{concern?.assessment || '-'}</Td>
</Tr>
)),
)}
</Tbody>
</TableComposable>
</PageSection>
);
};
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,9 @@ import { Concern } from '@kubev2v/types';

import { useInventoryVms } from '../utils/useInventoryVms';

import { ConcernsTable } from './ConcernsTable';
import { MigrationAction } from './MigrationAction';
import { VmData } from './VMCellProps';

export interface ProviderVirtualMachinesListProps extends RouteComponentProps {
title?: string;
obj: ProviderData;
Expand Down Expand Up @@ -58,6 +58,7 @@ export const ProviderVirtualMachinesList: FC<ProviderVirtualMachinesListProps> =
const initialSelectedIds_ = initialSelectedIds || [];

const [selectedIds, setSelectedIds] = useState(initialSelectedIds_);
const [expandedIds, setExpandedIds] = useState([]);
const [userSettings] = useState(() => loadUserSettings({ pageId }));

const [vmData, loading] = useInventoryVms(obj, loaded, loadError);
Expand Down Expand Up @@ -102,6 +103,9 @@ export const ProviderVirtualMachinesList: FC<ProviderVirtualMachinesListProps> =
selectedIds={selectedIds}
page={page}
setPage={setPage}
expandedIds={expandedIds}
onExpand={setExpandedIds}
ExpandedComponent={ConcernsTable}
/>
);
};
Expand Down
Original file line number Diff line number Diff line change
@@ -1,16 +1,17 @@
import React from 'react';
import { TFunction } from 'react-i18next';
import { TableCell, TableEmptyCell } from 'src/modules/Providers/utils';
import { useForkliftTranslation } from 'src/utils/i18n';

import { Concern } from '@kubev2v/types';
import {
BlueInfoCircleIcon,
RedExclamationCircleIcon,
YellowExclamationTriangleIcon,
} from '@openshift-console/dynamic-plugin-sdk';
import { Button, Flex, FlexItem, Label, Popover, Stack, StackItem } from '@patternfly/react-core';

import {
getCategoryColor,
getCategoryIcon,
getCategoryTitle,
groupConcernsByCategory,
} from '../utils';

import { VMCellProps } from './VMCellProps';

/**
Expand Down Expand Up @@ -87,75 +88,3 @@ const ConcernList: React.FC<{ concerns: Concern[] }> = ({ concerns }) => (
))}
</Stack>
);

/**
* Groups concerns by their category.
*
* @param {Concern[]} concerns - The list of concerns to group.
* @returns {Record<string, Concern[]>} The grouped concerns by category.
*/
const groupConcernsByCategory = (concerns: Concern[] = []): Record<string, Concern[]> => {
return concerns.reduce(
(acc, concern) => {
if (!acc[concern.category]) {
acc[concern.category] = [];
}
acc[concern.category].push(concern);
return acc;
},
{
Critical: [],
Information: [],
Warning: [],
},
);
};

/**
* Retrieves the title for a given concern category.
*
* @param {string} category - The category of the concern.
* @param {TFunction} t - The translation function.
* @returns {string} The title for the given category.
*/
const getCategoryTitle = (category: string, t: TFunction): string => {
const titles = {
Critical: t('Critical concerns'),
Information: t('Information concerns'),
Warning: t('Warning concerns'),
};

return titles[category] || '';
};

/**
* Retrieves the icon for a given concern category.
*
* @param {string} category - The category of the concern.
* @returns {ReactElement} The icon for the given category.
*/
const getCategoryIcon = (category: string) => {
const icons = {
Critical: <RedExclamationCircleIcon />,
Information: <BlueInfoCircleIcon />,
Warning: <YellowExclamationTriangleIcon />,
};

return icons[category] || <></>;
};

/**
* Retrieves the color for a given concern category.
*
* @param {string} category - The category of the concern.
* @returns {string} The color for the given category.
*/
const getCategoryColor = (category: string) => {
const colors = {
Critical: 'red',
Information: 'blue',
Warning: 'orange',
};

return colors[category] || 'grey';
};
Original file line number Diff line number Diff line change
@@ -1,8 +1,11 @@
// @index(['./*', /style/g], f => `export * from '${f.path}';`)
export * from './ConcernsTable';
export * from './MigrationAction';
export * from './PowerStateCellRenderer';
export * from './ProviderVirtualMachinesList';
export * from './VMCellProps';
export * from './VMConcernsCellRenderer';
export * from './VmFeaturesCell';
export * from './VMNameCellRenderer';
export * from './VmResourceLinkRenderer';
// @endindex
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
import React from 'react';
import { TFunction } from 'react-i18next';

import {
BlueInfoCircleIcon,
RedExclamationCircleIcon,
YellowExclamationTriangleIcon,
} from '@openshift-console/dynamic-plugin-sdk';

/**
* Retrieves the title for a given concern category.
*
* @param {string} category - The category of the concern.
* @param {TFunction} t - The translation function.
* @returns {string} The title for the given category.
*/
export const getCategoryTitle = (category: string, t: TFunction): string => {
const titles = {
Critical: t('Critical concerns'),
Information: t('Information concerns'),
Warning: t('Warning concerns'),
};

return titles[category] || '';
};

/**
* Retrieves the icon for a given concern category.
*
* @param {string} category - The category of the concern.
* @returns {ReactElement} The icon for the given category.
*/
export const getCategoryIcon = (category: string) => {
const icons = {
Critical: <RedExclamationCircleIcon />,
Information: <BlueInfoCircleIcon />,
Warning: <YellowExclamationTriangleIcon />,
};

return icons[category] || <></>;
};

/**
* Retrieves the color for a given concern category.
*
* @param {string} category - The category of the concern.
* @returns {string} The color for the given category.
*/
export const getCategoryColor = (category: string) => {
const colors = {
Critical: 'red',
Information: 'blue',
Warning: 'orange',
};

return colors[category] || 'grey';
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
import { Concern } from '@kubev2v/types';

/**
* Groups concerns by their category.
*
* @param {Concern[]} concerns - The list of concerns to group.
* @returns {Record<string, Concern[]>} The grouped concerns by category.
*/
export const groupConcernsByCategory = (concerns: Concern[] = []): Record<string, Concern[]> => {
return concerns.reduce(
(acc, concern) => {
if (!acc[concern.category]) {
acc[concern.category] = [];
}
acc[concern.category].push(concern);
return acc;
},
{
Critical: [],
Information: [],
Warning: [],
},
);
};
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
// @index(['./*', /style/g], f => `export * from '${f.path}';`)
export * from './getCategoryTitle';
export * from './getOpenShiftFeatureMap';
export * from './getVmPowerState';
export * from './groupConcernsByCategory';
export * from './toVmFeatureEnum';
export * from './vmProps';
// @endindex

0 comments on commit aa19f61

Please sign in to comment.