diff --git a/webpack/components/extensions/HostDetails/DetailsTabCards/ImageModeCard.js b/webpack/components/extensions/HostDetails/DetailsTabCards/ImageModeCard.js
new file mode 100644
index 00000000000..16b701735ec
--- /dev/null
+++ b/webpack/components/extensions/HostDetails/DetailsTabCards/ImageModeCard.js
@@ -0,0 +1,67 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { translate as __ } from 'foremanReact/common/I18n';
+import {
+ DescriptionList,
+ DescriptionListGroup,
+ DescriptionListDescription as Dd,
+ DescriptionListTerm as Dt,
+} from '@patternfly/react-core';
+import CardTemplate from 'foremanReact/components/HostDetails/Templates/CardItem/CardTemplate';
+
+const ImageModeCard = ({ isExpandedGlobal, hostDetails }) => {
+ const imageMode = hostDetails?.content_facet_attributes?.bootc_booted_image;
+ if (!imageMode) return null;
+ return (
+
+
+
+ {__('Running image')}
+ {hostDetails.content_facet_attributes.bootc_booted_image}
+ {__('Running image digest')}
+ {hostDetails.content_facet_attributes.bootc_booted_digest}
+ {__('Staged image')}
+ {hostDetails.content_facet_attributes.bootc_staged_image}
+ {__('Staged image digest')}
+ {hostDetails.content_facet_attributes.bootc_staged_digest}
+ {__('Available image')}
+ {hostDetails.content_facet_attributes.bootc_available_image}
+ {__('Available image digest')}
+ {hostDetails.content_facet_attributes.bootc_available_digest}
+ {__('Rollback image')}
+ {hostDetails.content_facet_attributes.bootc_rollback_image}
+ {__('Rollback image digest')}
+ {hostDetails.content_facet_attributes.bootc_rollback_digest}
+
+
+
+ );
+};
+
+ImageModeCard.propTypes = {
+ isExpandedGlobal: PropTypes.bool,
+ hostDetails: PropTypes.shape({
+ content_facet_attributes: PropTypes.shape({
+ bootc_booted_image: PropTypes.string,
+ bootc_booted_digest: PropTypes.string,
+ bootc_staged_image: PropTypes.string,
+ bootc_staged_digest: PropTypes.string,
+ bootc_available_image: PropTypes.string,
+ bootc_available_digest: PropTypes.string,
+ bootc_rollback_image: PropTypes.string,
+ bootc_rollback_digest: PropTypes.string,
+ }),
+ }),
+};
+
+ImageModeCard.defaultProps = {
+ isExpandedGlobal: false,
+ hostDetails: {},
+};
+
+export default ImageModeCard;
diff --git a/webpack/global_index.js b/webpack/global_index.js
index e1dbe296ae6..895949f0037 100644
--- a/webpack/global_index.js
+++ b/webpack/global_index.js
@@ -19,6 +19,7 @@ import ErrataOverviewCard from './components/extensions/HostDetails/Cards/Errata
import InstalledProductsCard from './components/extensions/HostDetails/DetailsTabCards/InstalledProductsCard';
import RegistrationCard from './components/extensions/HostDetails/DetailsTabCards/RegistrationCard';
import HwPropertiesCard from './components/extensions/HostDetails/DetailsTabCards/HwPropertiesCard';
+import ImageModeCard from './components/extensions/HostDetails/DetailsTabCards/ImageModeCard';
import TracesTab from './components/extensions/HostDetails/Tabs/TracesTab/TracesTab.js';
import extendReducer from './components/extensions/reducers';
@@ -71,6 +72,8 @@ addGlobalFill('recent-communication-card-item', 'Recent communication', , 100);
addGlobalFill('host-tab-details-cards', 'Registration details', , 200);
+addGlobalFill('host-tab-details-cards', 'HW properties', , 200);
+addGlobalFill('host-tab-details-cards', 'Image information', , 3000);
addGlobalFill('host-details-tab-properties-1', 'Subscription UUID', );
addGlobalFill('host-details-tab-properties-2', 'Tracer', );
addGlobalFill('host-details-tab-properties-3', 'Virtualization', );
@@ -89,7 +92,6 @@ addGlobalFill(
100,
);
-addGlobalFill('host-tab-details-cards', 'HW properties', , 200);
// Hosts Index page extensions
addGlobalFill('_all-hosts-modals', 'BulkChangeHostCVModal', , 100);