particle-os/debian-image-builder-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Wizard: Fix repo status formatting

Browse source 
This fixes the formatting of repositories status.
This commit is contained in:
regexowl 2025-01-17 15:12:08 +01:00 • committed by Lucas Garfield
parent 52efa800d8
commit 6e6e3b1ccc
1 changed files with 30 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/Components/CreateImageWizard/steps/Repositories/RepositoriesStatus.tsx
View file

@ -7,6 +7,7 @@ import {
DescriptionListDescription,
DescriptionListGroup,
DescriptionListTerm,
Icon,
Popover,
Spinner,
} from '@patternfly/react-core';
@ -24,6 +25,8 @@ import {
timestampToDisplayString,
} from '../../../../Utilities/time';
import '../../../ImagesTable/ImageBuildStatus.scss';
const getLastIntrospection = (
repoIntrospections: RepositoryStatusProps['repoIntrospections']
) => {
@ -60,7 +63,12 @@ const RepositoriesStatus = ({
if (repoStatus === 'Valid') {
return (
<>
<CheckCircleIcon className="success" /> {repoStatus}
<Icon status="success">
<CheckCircleIcon />
</Icon>{' '}
<span className="pf-v5-u-font-weight-bold pf-v5-u-success-color-200">
{repoStatus}
</span>
</>
);
} else if (repoStatus === 'Invalid' || repoStatus === 'Unavailable') {
@ -126,12 +134,25 @@ const RepositoriesStatus = ({
>
<Button variant="link" className="pf-v5-u-p-0 pf-v5-u-font-size-sm">
{repoStatus === 'Invalid' && (
<ExclamationCircleIcon className="error" />
<>
<Icon status="danger">
<ExclamationCircleIcon />
</Icon>{' '}
<span className="pf-v5-u-font-weight-bold pf-v5-u-danger-color-200 failure-button">
{repoStatus}
</span>
</>
)}
{repoStatus === 'Unavailable' && (
<ExclamationTriangleIcon className="expiring" />
)}{' '}
<span className="failure-button">{repoStatus}</span>
<>
<Icon status="warning">
<ExclamationTriangleIcon />
</Icon>{' '}
<span className="pf-v5-u-font-weight-bold pf-v5-u-warning-color-200 failure-button">
{repoStatus}
</span>
</>
)}
</Button>
</Popover>
</>
@ -139,7 +160,10 @@ const RepositoriesStatus = ({
} else if (repoStatus === 'Pending') {
return (
<>
<Spinner isInline /> {repoStatus}
<Spinner isInline />{' '}
<span className="pf-v5-u-font-weight-bold pf-v5-u-info-color-200">
{repoStatus}
</span>
</>
);
}