-
Notifications
You must be signed in to change notification settings - Fork 20
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1094 from yaacov/show-vm-concern-assesments
🐾 Show assessments rather than labels of concerns
- Loading branch information
Showing
8 changed files
with
169 additions
and
79 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
67 changes: 67 additions & 0 deletions
67
...gin/src/modules/Providers/views/details/tabs/VirtualMachines/components/ConcernsTable.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
3 changes: 3 additions & 0 deletions
3
...nsole-plugin/src/modules/Providers/views/details/tabs/VirtualMachines/components/index.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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 |
57 changes: 57 additions & 0 deletions
57
...c/modules/Providers/views/details/tabs/VirtualMachines/utils/helpers/getCategoryTitle.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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'; | ||
}; |
24 changes: 24 additions & 0 deletions
24
...les/Providers/views/details/tabs/VirtualMachines/utils/helpers/groupConcernsByCategory.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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: [], | ||
}, | ||
); | ||
}; |
3 changes: 3 additions & 0 deletions
3
...le-plugin/src/modules/Providers/views/details/tabs/VirtualMachines/utils/helpers/index.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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 |