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

ImageBuildStatus: refactor image status

Browse source 
Remove excessive status elements since there only needs to be one status
statement for each image in the list. Also, replace the pending spinner
with a pending icon.
This commit is contained in:
Jacob Kozol 2021-04-27 14:25:55 +02:00 • committed by Sanne Raymaekers
parent f8abe70004
commit 3cf9f8c3a3
2 changed files with 9 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/Components/ImagesTable/ImageBuildStatus.js
View file

@ -1,8 +1,8 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { Flex, Spinner } from '@patternfly/react-core'; import { Flex } from '@patternfly/react-core';
import { CheckCircleIcon, PendingIcon, ExclamationCircleIcon } from '@patternfly/react-icons'; import { CheckCircleIcon, PendingIcon, ExclamationCircleIcon, InProgressIcon } from '@patternfly/react-icons';
import './ImageBuildStatus.scss'; import './ImageBuildStatus.scss';
@ -29,49 +29,25 @@ const ImageBuildStatus = (props) => {
// Keep "running" for backward compatibility // Keep "running" for backward compatibility
running: [ running: [
{ {
icon: <Spinner size="md" />, icon: <InProgressIcon className="pending" />,
text: 'Image build in progress' text: 'Image build in progress'
},
{
icon: <PendingIcon />,
text: 'Upload, Cloud registration pending'
} }
], ],
building: [ building: [
{ {
icon: <Spinner size="md" />, icon: <InProgressIcon className="pending" />,
text: 'Image build in progress' text: 'Image build in progress'
},
{
icon: <PendingIcon />,
text: 'Upload, Cloud registration pending'
} }
], ],
uploading: [ uploading: [
{ {
icon: <CheckCircleIcon />, icon: <InProgressIcon className="pending" />,
text: 'Image build finished'
},
{
icon: <Spinner size="md" />,
text: 'Image upload in progress' text: 'Image upload in progress'
},
{
icon: <PendingIcon />,
text: 'Cloud registration pending'
} }
], ],
registering: [ registering: [
{ {
icon: <CheckCircleIcon />, icon: <InProgressIcon className="pending" />,
text: 'Image build finished'
},
{
icon: <CheckCircleIcon />,
text: 'Image upload finished'
},
{
icon: <Spinner size="md" />,
text: 'Cloud registration in progress' text: 'Cloud registration in progress'
} }
] ]

3
src/Components/ImagesTable/ImageBuildStatus.scss
View file

@ -4,3 +4,6 @@
.success { .success {
color: var(--pf-global--success-color--100); color: var(--pf-global--success-color--100);
} }
.pending {
color: var(--pf-global--info-color--100);
}