diff --git a/frontend/pages/hosts/details/cards/HostSummary/HostSummary.tsx b/frontend/pages/hosts/details/cards/HostSummary/HostSummary.tsx
index afa54bb8e6..8a453d61e0 100644
--- a/frontend/pages/hosts/details/cards/HostSummary/HostSummary.tsx
+++ b/frontend/pages/hosts/details/cards/HostSummary/HostSummary.tsx
@@ -24,7 +24,6 @@ import StatusIndicator from "components/StatusIndicator";
 import { COLORS } from "styles/var/colors";
 
 import OSSettingsIndicator from "./OSSettingsIndicator";
-import HostSummaryIndicator from "./HostSummaryIndicator";
 import BootstrapPackageIndicator from "./BootstrapPackageIndicator/BootstrapPackageIndicator";
 
 import {
@@ -369,21 +368,27 @@ const HostSummary = ({
           mdmName?.includes("Fleet") && // show if 1 - host is enrolled in Fleet MDM, and
           hostMdmProfiles &&
           hostMdmProfiles.length > 0 && ( // 2 - host has at least one setting (profile) enforced
-            <HostSummaryIndicator title="OS settings">
-              <OSSettingsIndicator
-                profiles={hostMdmProfiles}
-                onClick={toggleOSSettingsModal}
-              />
-            </HostSummaryIndicator>
+            <DataSet
+              title="OS settings"
+              value={
+                <OSSettingsIndicator
+                  profiles={hostMdmProfiles}
+                  onClick={toggleOSSettingsModal}
+                />
+              }
+            />
           )}
 
         {bootstrapPackageData?.status && (
-          <HostSummaryIndicator title="Bootstrap package">
-            <BootstrapPackageIndicator
-              status={bootstrapPackageData.status}
-              onClick={toggleBootstrapPackageModal}
-            />
-          </HostSummaryIndicator>
+          <DataSet
+            title="Bootstrap package"
+            value={
+              <BootstrapPackageIndicator
+                status={bootstrapPackageData.status}
+                onClick={toggleBootstrapPackageModal}
+              />
+            }
+          />
         )}
 
         {platform !== "chrome" && renderDiskSpaceSummary()}
diff --git a/frontend/pages/hosts/details/cards/HostSummary/HostSummaryIndicator/HostSummaryIndicator.tsx b/frontend/pages/hosts/details/cards/HostSummary/HostSummaryIndicator/HostSummaryIndicator.tsx
deleted file mode 100644
index ca707e477a..0000000000
--- a/frontend/pages/hosts/details/cards/HostSummary/HostSummaryIndicator/HostSummaryIndicator.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import React from "react";
-
-interface IHostSummaryIndicatorProps {
-  title: string;
-  children: JSX.Element;
-}
-
-const HostSummaryIndicator = ({
-  title,
-  children,
-}: IHostSummaryIndicatorProps): JSX.Element => {
-  return (
-    <div className="info-flex__item info-flex__item--title">
-      <span className="info-flex__header">{title}</span>
-      {children}
-    </div>
-  );
-};
-
-export default HostSummaryIndicator;
diff --git a/frontend/pages/hosts/details/cards/HostSummary/HostSummaryIndicator/index.ts b/frontend/pages/hosts/details/cards/HostSummary/HostSummaryIndicator/index.ts
deleted file mode 100644
index e3e7cea220..0000000000
--- a/frontend/pages/hosts/details/cards/HostSummary/HostSummaryIndicator/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./HostSummaryIndicator";