V2Wizard: Fix repo/description in review table of package on Edit

Previously the repository in the table of packages on the Review step defaulted to "EPEL". This expands the condition to take into account packages added on Edit.

Description is handled in the same way.

The "Not available" text is consistent with how the packages table looks on the Packages step for pkgs populated from the request. A popover with more information was added also to the review table as it contains explanation about the "Not available" text.
This commit is contained in:
regexowl 2024-05-06 14:16:28 +02:00 committed by Klara Simickova
parent 038f6f5ff5
commit b9aa1c786a
3 changed files with 45 additions and 29 deletions

View file

@ -39,6 +39,7 @@ import { Table, Tbody, Td, Th, Thead, Tr } from '@patternfly/react-table';
import { useDispatch } from 'react-redux';
import CustomHelperText from './components/CustomHelperText';
import PackageInfoNotAvailablePopover from './components/PackageInfoNotAvailablePopover';
import {
EPEL_8_REPO_DEFINITION,
@ -964,31 +965,7 @@ const Packages = () => {
<Th width={35}>
Description
{toggleSelected === 'toggle-selected' && (
<Popover
headerContent="Package description"
bodyContent={
<TextContent>
<Text>
The package description provides more information about
the package.
</Text>
<Text>
When editing an existing blueprint, you may see a
&quot;Not available&quot; value in the field because
information about previously added packages can not be
fetched.
</Text>
</TextContent>
}
>
<Button
variant="plain"
aria-label="Package description"
className="pf-u-pl-sm pf-u-pt-0 pf-u-pb-0"
>
<HelpIcon />
</Button>
</Popover>
<PackageInfoNotAvailablePopover />
)}
</Th>
<Th width={25}>Package repository</Th>

View file

@ -0,0 +1,34 @@
import React from 'react';
import { Button, Popover, TextContent, Text } from '@patternfly/react-core';
import { HelpIcon } from '@patternfly/react-icons';
const PackageInfoNotAvailablePopover = () => {
return (
<Popover
headerContent="Package description"
bodyContent={
<TextContent>
<Text>
The package description provides more information about the package.
</Text>
<Text>
When editing an existing blueprint, you may see a &quot;Not
available&quot; value in the field because information about
previously added packages can not be fetched.
</Text>
</TextContent>
}
>
<Button
variant="plain"
aria-label="Package description"
className="pf-u-pl-sm pf-u-pt-0 pf-u-pb-0"
>
<HelpIcon />
</Button>
</Popover>
);
};
export default PackageInfoNotAvailablePopover;

View file

@ -23,6 +23,7 @@ import {
selectPartitions,
selectRecommendedRepositories,
} from '../../../../store/wizardSlice';
import PackageInfoNotAvailablePopover from '../Packages/components/PackageInfoNotAvailablePopover';
type repoPropType = {
repoUrl: string[] | undefined;
@ -197,7 +198,9 @@ export const PackagesTable = () => {
<Thead>
<Tr>
<Th>Name</Th>
<Th>Description</Th>
<Th>
Description <PackageInfoNotAvailablePopover />
</Th>
<Th>Package repository</Th>
</Tr>
</Thead>
@ -205,13 +208,15 @@ export const PackagesTable = () => {
{packages.map((pkg, pkgIndex) => (
<Tr key={pkgIndex}>
<Td className="pf-m-width-30">{pkg.name}</Td>
<Td>{pkg.summary}</Td>
<Td className="pf-m-width-20">
<Td>{pkg.summary ? pkg.summary : 'Not available'}</Td>
<Td className="pf-m-width-30">
{pkg.repository === 'distro'
? 'Red Hat repository'
: pkg.repository === 'custom'
? 'Custom repository'
: 'EPEL Everything x86_64'}
: pkg.repository === 'recommended'
? 'EPEL Everything x86_64'
: 'Not available'}
</Td>
</Tr>
))}