diff --git a/src/PresentationalComponents/ImageBuildStatus/ImageBuildStatus.js b/src/PresentationalComponents/ImageBuildStatus/ImageBuildStatus.js
new file mode 100644
index 00000000..b7b783eb
--- /dev/null
+++ b/src/PresentationalComponents/ImageBuildStatus/ImageBuildStatus.js
@@ -0,0 +1,74 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import { Flex, Spinner } from '@patternfly/react-core';
+import { CheckCircleIcon, PendingIcon, ExclamationCircleIcon } from '@patternfly/react-icons';
+
+import './ImageBuildStatus.scss';
+
+const ImageBuildStatus = (props) => {
+ const messages = {
+ success: [
+ {
+ icon: ,
+ text: 'Ready'
+ }
+ ],
+ failure: [
+ {
+ icon: ,
+ text: 'Image build failed'
+ }
+ ],
+ pending: [
+ {
+ icon: ,
+ text: 'Image build, Upload, Cloud registration pending'
+ }
+ ],
+ building: [
+ {
+ icon: ,
+ text: 'Image build in progress'
+ },
+ {
+ icon: ,
+ text: 'Upload, Cloud registration pending'
+ }
+ ],
+ uploading: [
+ {
+ icon: ,
+ text: 'Upload in progress'
+ },
+ {
+ icon: ,
+ text: 'Cloud registration pending'
+ }
+ ],
+ registering: [
+ {
+ icon: ,
+ text: 'Cloud registration in progress'
+ }
+ ]
+ };
+ return (
+
+ {messages[props.status] &&
+ messages[props.status].map((message, key) => (
+
+ {message.icon}
+ {message.text}
+
+ ))
+ }
+
+ );
+};
+
+ImageBuildStatus.propTypes = {
+ status: PropTypes.string,
+};
+
+export default ImageBuildStatus;
diff --git a/src/PresentationalComponents/ImageBuildStatus/ImageBuildStatus.scss b/src/PresentationalComponents/ImageBuildStatus/ImageBuildStatus.scss
new file mode 100644
index 00000000..a397ddc7
--- /dev/null
+++ b/src/PresentationalComponents/ImageBuildStatus/ImageBuildStatus.scss
@@ -0,0 +1,6 @@
+.error {
+ color: var(--pf-global--danger-color--100);
+}
+.success {
+ color: var(--pf-global--success-color--100);
+}
\ No newline at end of file
diff --git a/src/SmartComponents/ImagesTable/ImagesTable.js b/src/SmartComponents/ImagesTable/ImagesTable.js
index 12459a86..f36deb14 100644
--- a/src/SmartComponents/ImagesTable/ImagesTable.js
+++ b/src/SmartComponents/ImagesTable/ImagesTable.js
@@ -6,6 +6,8 @@ import { Link } from 'react-router-dom';
import { Table, TableHeader, TableBody, classNames, Visibility } from '@patternfly/react-table';
import { TableToolbar } from '@redhat-cloud-services/frontend-components';
+import ImageBuildStatus from '../../PresentationalComponents/ImageBuildStatus/ImageBuildStatus';
+
import api from '../../api.js';
class ImagesTable extends Component {
@@ -63,7 +65,7 @@ class ImagesTable extends Component {
id,
compose.image_type,
compose.distribution,
- compose.status,
+ { title: },
''
]
};