foreman_rh_cloud 12.1.4 → 12.2.0

data/webpack/ForemanInventoryUpload/Components/PageHeader/components/PageDescription/PageDescription.js

@@ -13,18 +13,18 @@ export const PageDescription = () => {
 
   return (
     <div id="inventory_page_description">
-      <Text>
+      <Text ouiaId="text-cloud-console">
         {__(
           'The Red Hat Hybrid Cloud Console provides a set of cloud services, including Red Hat Insights and Subscriptions, that provide predictive analysis, remediation of issues, and unified subscription reporting for this Foreman instance.'
         )}
       </Text>
-      <Text>
+      <Text ouiaId="text-inventory-upload">
         {__(
           'The Foreman inventory upload plugin automatically uploads Foreman host inventory data to the Inventory service of Insights, where it can also be used by the Subscriptions service for subscription reporting. If you use the Subscriptions service, enabling inventory uploads is required.'
         )}
       </Text>
       {subscriptionConnectionEnabled && (
-        <Text>
+        <Text ouiaId="text-enable-report">
           <FormattedMessage
             id="enable-upload-hint"
             defaultMessage={__(
@@ -39,7 +39,7 @@ export const PageDescription = () => {
         </Text>
       )}
       {subscriptionConnectionEnabled && (
-        <Text>
+        <Text ouiaId="text-restart-button">
           <FormattedMessage
             id="restart-button-hint"
             defaultMessage={__(
@@ -53,7 +53,7 @@ export const PageDescription = () => {
           />
         </Text>
       )}
-      <Text>
+      <Text ouiaId="text-more-info-subscription">
         {__('For more information about the Subscriptions service, see:')}
         &nbsp;
         <a
@@ -64,7 +64,7 @@ export const PageDescription = () => {
           {__('About subscription watch')}
         </a>
       </Text>
-      <Text>
+      <Text ouiaId="text-more-info-insights">
         {__('For more information about Insights and Cloud Connector, see:')}
         &nbsp;
         <a

data/webpack/ForemanInventoryUpload/Components/PageHeader/components/SettingsWarning/SettingsWarning.js

@@ -22,6 +22,7 @@ export const SettingsWarning = ({
     alerts.push(
       <Alert
         key="auto-upload"
+        ouiaId="auto-upload"
         variant="warning"
         title={__(
           "Cloud Connector has been configured however the inventory auto-upload is disabled, it's recommended to enable it"
@@ -36,6 +37,7 @@ export const SettingsWarning = ({
     alerts.push(
       <Alert
         key="obfuscating-host"
+        ouiaId="obfuscating-host"
         variant="warning"
         title={__(
           "Cloud Connector has been configured however obfuscating host names setting is enabled, it's recommended to disable it"

data/webpack/ForemanInventoryUpload/Components/PageHeader/components/SettingsWarning/__snapshots__/SettingsWarning.test.js.snap

@@ -11,6 +11,7 @@ exports[`SettingsWarning with 2 alerts 1`] = `
       />
     }
     key="auto-upload"
+    ouiaId="auto-upload"
     title="Cloud Connector has been configured however the inventory auto-upload is disabled, it's recommended to enable it"
     variant="warning"
   />
@@ -21,6 +22,7 @@ exports[`SettingsWarning with 2 alerts 1`] = `
       />
     }
     key="obfuscating-host"
+    ouiaId="obfuscating-host"
     title="Cloud Connector has been configured however obfuscating host names setting is enabled, it's recommended to disable it"
     variant="warning"
   />

data/webpack/ForemanInventoryUpload/Components/PageHeader/components/SyncButton/SyncButton.js

@@ -21,6 +21,7 @@ class SyncButton extends React.Component {
       <React.Fragment>
         <Button
           className="sync_button"
+          ouiaId="sync-button"
           onClick={handleClick}
           isDisabled={status === STATUS.PENDING}
           variant="secondary"

data/webpack/ForemanInventoryUpload/Components/PageHeader/components/SyncButton/__tests__/__snapshots__/SyncButton.test.js.snap

@@ -6,6 +6,7 @@ exports[`SyncButton rendering render with Props 1`] = `
     className="sync_button"
     isDisabled={false}
     onClick={[Function]}
+    ouiaId="sync-button"
     variant="secondary"
   >
      Sync all inventory status

data/webpack/ForemanInventoryUpload/SubscriptionsPageExtension/InventoryAutoUpload/InventoryAutoUpload.js

@@ -48,6 +48,7 @@ const InventoryAutoUploadSwitcher = ({
               position="right"
             >
               <Button
+                ouiaId="button-advanced-settings"
                 variant="secondary"
                 style={{ fontSize: 'small', marginTop: '-4px' }}
               >
@@ -59,9 +60,10 @@ const InventoryAutoUploadSwitcher = ({
         <br />
         <Grid.Row>
           <Grid.Col sm={12}>
-            <Text component={TextVariants.p}>
+            <Text component={TextVariants.p} ouiaId="text-more-details">
               <InfoAltIcon /> {__('More details can be found in')}{' '}
               <Text
+                ouiaId="text-details-link"
                 component={TextVariants.a}
                 href={foremanUrl('/foreman_rh_cloud/inventory_upload')}
                 target="_blank"

data/webpack/ForemanInventoryUpload/SubscriptionsPageExtension/InventoryAutoUpload/__tests__/__snapshots__/InventoryAutoUpload.test.js.snap

@@ -41,6 +41,7 @@ exports[`InventoryAutoUpload rendering render with props 1`] = `
           position="right"
         >
           <Button
+            ouiaId="button-advanced-settings"
             style={
               Object {
                 "fontSize": "small",
@@ -68,6 +69,7 @@ exports[`InventoryAutoUpload rendering render with props 1`] = `
       >
         <Text
           component="p"
+          ouiaId="text-more-details"
         >
           <InfoAltIcon />
            
@@ -76,6 +78,7 @@ exports[`InventoryAutoUpload rendering render with props 1`] = `
           <Text
             component="a"
             href="/foreman_rh_cloud/inventory_upload"
+            ouiaId="text-details-link"
             rel="noopener noreferrer"
             target="_blank"
           >

data/webpack/ForemanRhCloudFills.js

@@ -1,10 +1,11 @@
 import React from 'react';
 import { addGlobalFill } from 'foremanReact/components/common/Fill/GlobalFill';
+import { translate as __ } from 'foremanReact/common/I18n';
 import InventoryAutoUploadSwitcher from './ForemanInventoryUpload/SubscriptionsPageExtension/InventoryAutoUpload';
 import NewHostDetailsTab from './InsightsHostDetailsTab/NewHostDetailsTab';
 import { InsightsTotalRiskChartWrapper } from './InsightsHostDetailsTab/InsightsTotalRiskChartWrapper';
 import { isNotRhelHost, vulnerabilityDisabled } from './ForemanRhCloudHelpers';
-import CVEsHostDetailsTab from './CVEsHostDetailsTab/CVEsHostDetailsTab';
+import CVEsHostDetailsTabWrapper from './CVEsHostDetailsTab/CVEsHostDetailsTab';
 
 const fills = [
   {
@@ -20,6 +21,7 @@ const fills = [
     weight: 400,
     metadata: {
       hideTab: isNotRhelHost,
+      title: __('Insights'),
     },
   },
   {
@@ -30,11 +32,12 @@ const fills = [
   },
   {
     slot: 'host-details-page-tabs',
-    name: 'CVEs',
-    component: props => <CVEsHostDetailsTab {...props} />,
+    name: 'Vulnerabilities',
+    component: props => <CVEsHostDetailsTabWrapper {...props} />,
     weight: 300,
     metadata: {
       hideTab: vulnerabilityDisabled,
+      title: __('Vulnerabilities'),
     },
   },
 ];

data/webpack/ForemanRhCloudPages.js

@@ -1,16 +1,24 @@
+/* eslint-disable spellcheck/spell-checker */
 import React from 'react';
 import componentRegistry from 'foremanReact/components/componentRegistry';
 import { registerRoutes as foremanRegisterRoutes } from 'foremanReact/routes/RoutingService';
 import ForemanInventoryUpload from './ForemanInventoryUpload';
-import InsightsVulnerability from './InsightsVulnerability/InsightsVulnerability';
+import InsightsVulnerabilityListPage from './InsightsVulnerability/InsightsVulnerabilityListPage';
 import InsightsCloudSync from './InsightsCloudSync';
+import IopRecommendationDetails from './IopRecommendationDetails/IopRecommendationDetails';
 import InsightsHostDetailsTab from './InsightsHostDetailsTab';
+import CveDetailsPage from './CveDetailsPage';
 
 const pages = [
   { name: 'ForemanInventoryUpload', type: ForemanInventoryUpload },
   { name: 'InsightsCloudSync', type: InsightsCloudSync },
+  { name: 'IopRecommendationDetails', type: IopRecommendationDetails },
   { name: 'InsightsHostDetailsTab', type: InsightsHostDetailsTab },
-  { name: 'InsightsVulnerability', type: InsightsVulnerability },
+  {
+    name: 'InsightsVulnerabilityListPage',
+    type: InsightsVulnerabilityListPage,
+  },
+  { name: 'CveDetailsPage', type: CveDetailsPage },
 ];
 
 export const registerPages = () => {
@@ -23,6 +31,11 @@ export const routes = [
     exact: true,
     render: props => <InsightsCloudSync {...props} />,
   },
+  {
+    path: '/foreman_rh_cloud/recommendations',
+    exact: false,
+    render: props => <IopRecommendationDetails {...props} />,
+  },
   {
     path: '/foreman_rh_cloud/inventory_upload',
     exact: true,
@@ -31,7 +44,12 @@ export const routes = [
   {
     path: '/foreman_rh_cloud/insights_vulnerability',
     exact: true,
-    render: props => <InsightsVulnerability {...props} />,
+    render: props => <InsightsVulnerabilityListPage {...props} />,
+  },
+  {
+    path: '/foreman_rh_cloud/insights_vulnerability/:cveId',
+    exact: true,
+    render: props => <CveDetailsPage {...props} />,
   },
 ];
 

data/webpack/InsightsCloudSync/Components/InsightsTable/InsightsTable.js

@@ -75,6 +75,7 @@ const InsightsTable = ({
       />
       <Table
         className="rh-cloud-recommendations-table"
+        ouiaId="rh-cloud-recommendations-table"
         aria-label="Recommendations Table"
         onSelect={(_event, isSelected, rowId) =>
           onTableSelect(isSelected, rowId, rows, selectedIds)

data/webpack/InsightsCloudSync/Components/InsightsTable/SelectAllAlert.js

@@ -18,6 +18,7 @@ const SelectAllAlert = ({
       <Alert
         isInline
         variant="info"
+        ouiaId="alert-recommendations-selected"
         title={sprintf(__('Recommendations selected: %s.'), selectedCount)}
         actionLinks={
           <AlertActionLink onClick={selectAll}>
@@ -32,6 +33,7 @@ const SelectAllAlert = ({
     <Alert
       isInline
       variant="info"
+      ouiaId="alert-all-selected"
       title={__('All recommendations are now selected.')}
       actionLinks={
         <AlertActionLink onClick={clearAllSelection}>

data/webpack/InsightsCloudSync/Components/InsightsTable/__tests__/__snapshots__/InsightsTable.test.js.snap

@@ -83,6 +83,7 @@ exports[`InsightsTable rendering render with Props 1`] = `
     isTreeTable={false}
     onSelect={[Function]}
     onSort={[Function]}
+    ouiaId="rh-cloud-recommendations-table"
     ouiaSafe={true}
     role="grid"
     rowLabeledBy="simple-node"

data/webpack/InsightsCloudSync/Components/RemediationModal/RemediationModal.js

@@ -46,6 +46,7 @@ const RemediationModal = ({
   return (
     <React.Fragment>
       <Button
+        ouiaId="button-remediate"
         variant="primary"
         isDisabled={isEmpty(selectedIds)}
         onClick={() => {
@@ -56,6 +57,7 @@ const RemediationModal = ({
       </Button>{' '}
       <Modal
         id="remediation-modal"
+        ouiaId="remediation-modal"
         appendTo={document.body}
         variant={ModalVariant.large}
         title={__('Remediation summary')}
@@ -71,6 +73,7 @@ const RemediationModal = ({
       >
         <Table
           className="remediations-table"
+          ouiaId="remediations-table"
           aria-label="remediations Table"
           cells={columns}
           rows={rows}

data/webpack/InsightsCloudSync/Components/RemediationModal/RemediationModalFooter.js

@@ -9,10 +9,20 @@ const ModalFooter = ({ toggleModal, resolutions, hostsIds }) => {
   token = token?.content || '';
   return (
     <form action={JOB_INVOCATION_PATH} method="post">
-      <Button type="submit" key="confirm" variant="primary">
+      <Button
+        type="submit"
+        ouiaId="button-confirm"
+        key="confirm"
+        variant="primary"
+      >
         {__('Remediate')}
       </Button>
-      <Button key="cancel" variant="link" onClick={toggleModal}>
+      <Button
+        key="cancel"
+        ouiaId="button-cancel"
+        variant="link"
+        onClick={toggleModal}
+      >
         {__('Cancel')}
       </Button>
       <input type="hidden" name="feature" value="rh_cloud_remediate_hosts" />

data/webpack/InsightsCloudSync/Components/RemediationModal/Resolutions.js

@@ -18,6 +18,7 @@ const Resolutions = ({
       {resolutions.map(({ id: resolution_id, description }) => (
         <Radio
           key={resolution_id}
+          ouiaId={`resolution-radio-${resolution_id}`}
           className="resolution-radio"
           id={resolution_id}
           isChecked={resolution_id === checkedID}

data/webpack/InsightsCloudSync/Components/ToolbarDropdown.js

@@ -19,11 +19,15 @@ const ToolbarDropdown = ({ onRecommendationSync }) => {
   const dropdownItems = [
     <DropdownItem
       key="recommendation-manual-sync"
+      ouiaId="recommendation-manual-sync"
       onClick={onRecommendationSync}
     >
       {__('Sync recommendations')}
     </DropdownItem>,
-    <DropdownItem key="cloud-advisor-systems-link">
+    <DropdownItem
+      key="cloud-advisor-systems-link"
+      ouiaId="cloud-advisor-systems-link"
+    >
       <a
         href={redHatAdvisorSystems()}
         target="_blank"
@@ -38,6 +42,7 @@ const ToolbarDropdown = ({ onRecommendationSync }) => {
   return (
     <Dropdown
       className="title-dropdown"
+      ouiaId="title-dropdown"
       onSelect={() => setIsDropdownOpen(false)}
       toggle={
         <KebabToggle onToggle={(_event, isOpen) => setIsDropdownOpen(isOpen)} />

data/webpack/InsightsCloudSync/InsightsCloudSync.js

@@ -1,7 +1,10 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import PageLayout from 'foremanReact/routes/common/PageLayout/PageLayout';
+import { ScalprumComponent, ScalprumProvider } from '@scalprum/react-core';
 import InsightsTable from './Components/InsightsTable';
+import { useAdvisorEngineConfig } from '../common/Hooks/ConfigHooks';
+import { foremanUrl } from '../ForemanRhCloudHelpers';
 import RemediationModal from './Components/RemediationModal';
 import {
   INSIGHTS_SYNC_PAGE_TITLE,
@@ -11,7 +14,9 @@ import './InsightsCloudSync.scss';
 import Pagination from './Components/InsightsTable/Pagination';
 import ToolbarDropdown from './Components/ToolbarDropdown';
 import InsightsSettings from './Components/InsightsSettings';
+import { providerOptions } from '../common/ScalprumModule/ScalprumContext';
 
+// Hosted Insights advisor
 const InsightsCloudSync = ({ syncInsights, query, fetchInsights }) => {
   const onRecommendationSync = () => syncInsights(fetchInsights, query);
   const toolbarButtons = (
@@ -54,4 +59,37 @@ InsightsCloudSync.defaultProps = {
   query: '',
 };
 
-export default InsightsCloudSync;
+// Local Insights advisor
+const scope = 'advisor';
+const module = './ListWrapped';
+
+export const generateRuleUrl = ruleId =>
+  foremanUrl(`/foreman_rh_cloud/recommendations/${ruleId}`);
+
+const IopRecommendationsPage = props => (
+  <ScalprumComponent
+    scope={scope}
+    module={module}
+    IopRemediationModal={RemediationModal}
+    generateRuleUrl={generateRuleUrl}
+    {...props}
+  />
+);
+
+const IopRecommendationsPageWrapped = props => (
+  <ScalprumProvider {...providerOptions}>
+    <IopRecommendationsPage {...props} />
+  </ScalprumProvider>
+);
+
+const RecommendationsPage = props => {
+  const isLocalAdvisorEngine = useAdvisorEngineConfig();
+
+  return isLocalAdvisorEngine ? (
+    <IopRecommendationsPageWrapped {...props} />
+  ) : (
+    <InsightsCloudSync {...props} />
+  );
+};
+
+export default RecommendationsPage;

data/webpack/InsightsCloudSync/__snapshots__/InsightsCloudSync.test.js.snap

@@ -1,54 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`InsightsCloudSync render 1`] = `
-<div
-  className="rh-cloud-insights"
->
-  <Connect(InsightsSettings) />
-  <PageLayout
-    beforeToolbarComponent={null}
-    header="Red Hat Insights"
-    onSearch={[Function]}
-    searchProps={
-      Object {
-        "autocomplete": Object {
-          "id": "searchBar",
-          "searchQuery": "",
-          "url": "/insights_cloud/hits/auto_complete_search",
-          "useKeyShortcuts": true,
-        },
-        "bookmarks": Object {
-          "canCreateBookmarks": true,
-          "documentationUrl": "4.1.5Searching",
-          "url": "/api/bookmarks",
-        },
-        "controller": "insights_hits",
-      }
-    }
-    searchQuery=""
-    searchable={true}
-    toolbarButtons={
-      <React.Fragment>
-        <span
-          className="insights-toolbar-buttons"
-        >
-          <Memo(Connect(RemediationModal)) />
-          <ToolbarDropdown
-            onRecommendationSync={[Function]}
-          />
-        </span>
-        <span
-          className="pull-right"
-        >
-          <Pagination
-            isCompact={true}
-            variant="top"
-          />
-        </span>
-      </React.Fragment>
-    }
-  >
-    <Connect(InsightsTable) />
-  </PageLayout>
-</div>
+<InsightsCloudSync
+  fetchInsights={[Function]}
+  query=""
+  status="RESOLVED"
+  syncInsights={[Function]}
+/>
 `;

data/webpack/InsightsHostDetailsTab/NewHostDetailsTab.js

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import { useDispatch, useSelector } from 'react-redux';
 import SearchBar from 'foremanReact/components/SearchBar';
 import { translate as __ } from 'foremanReact/common/I18n';
+import { ScalprumComponent, ScalprumProvider } from '@scalprum/react-core';
 import { Grid, GridItem } from '@patternfly/react-core';
 import {
   Dropdown,
@@ -21,7 +22,10 @@ import {
 } from '../InsightsCloudSync/Components/InsightsTable/InsightsTableSelectors';
 import { redHatAdvisorSystems } from '../InsightsCloudSync/InsightsCloudSyncHelpers';
 import { useAdvisorEngineConfig } from '../common/Hooks/ConfigHooks';
+import { generateRuleUrl } from '../InsightsCloudSync/InsightsCloudSync';
+import { providerOptions } from '../common/ScalprumModule/ScalprumContext';
 
+// Hosted Insights advisor
 const NewHostDetailsTab = ({ hostName, router }) => {
   const dispatch = useDispatch();
   const query = useSelector(selectSearch);
@@ -104,4 +108,50 @@ NewHostDetailsTab.defaultProps = {
   router: {},
 };
 
-export default NewHostDetailsTab;
+// Local Insights advisor
+const scope = 'advisor';
+// eslint-disable-next-line spellcheck/spell-checker
+const module = './HostDetailsLightspeedTabWrapped';
+
+const IopInsightsTab = props => (
+  <ScalprumComponent
+    scope={scope}
+    module={module}
+    IopRemediationModal={RemediationModal}
+    generateRuleUrl={generateRuleUrl}
+    {...props}
+  />
+);
+
+const IopInsightsTabWrapped = props => (
+  <ScalprumProvider {...providerOptions}>
+    <IopInsightsTab {...props} />
+  </ScalprumProvider>
+);
+
+const LightspeedTab = props => {
+  const { response } = props;
+  const isLocalAdvisorEngine =
+    // eslint-disable-next-line camelcase
+    response?.insights_attributes?.use_local_advisor_engine;
+
+  return isLocalAdvisorEngine ? (
+    <IopInsightsTabWrapped {...props} />
+  ) : (
+    <NewHostDetailsTab {...props} />
+  );
+};
+
+LightspeedTab.propTypes = {
+  response: PropTypes.shape({
+    insights_attributes: {
+      use_local_advisor_engine: PropTypes.bool,
+    },
+  }),
+};
+
+LightspeedTab.defaultProps = {
+  response: {},
+};
+
+export default LightspeedTab;

data/webpack/InsightsVulnerability/InsightsVulnerabilityListPage.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import { ScalprumComponent, ScalprumProvider } from '@scalprum/react-core';
+import { providerOptions } from '../common/ScalprumModule/ScalprumContext';
+
+const InsightsVulnerabilityListPage = () => {
+  const scope = 'vulnerability';
+  const module = './CveListPage';
+  return (
+    <div className="rh-cloud-insights-vulnerability-page">
+      <ScalprumComponent scope={scope} module={module} />
+    </div>
+  );
+};
+
+const InsightsVulnerabilityListPageWrap = () => (
+  <ScalprumProvider {...providerOptions}>
+    <InsightsVulnerabilityListPage />
+  </ScalprumProvider>
+);
+
+export default InsightsVulnerabilityListPageWrap;

data/webpack/InsightsVulnerability/InsightsVulnerabilityListPage.test.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import InsightsVulnerabilityListPage from './InsightsVulnerabilityListPage';
+
+jest.mock('@scalprum/react-core', () => ({
+  ScalprumComponent: jest.fn(props => (
+    <div data-testid="mock-scalprum-component">{JSON.stringify(props)}</div>
+  )),
+  ScalprumProvider: jest.fn(({ children }) => <div>{children}</div>),
+}));
+
+describe('InsightsVulnerabilityListPage component', () => {
+  it('renders the container with correct class', () => {
+    const { container } = render(<InsightsVulnerabilityListPage />);
+    expect(
+      container.querySelector('.rh-cloud-insights-vulnerability-page')
+    ).toBeTruthy();
+  });
+});

data/webpack/InsightsVulnerabilityHostIndexExtensions/CVECountCell.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { UnknownIcon } from '@patternfly/react-icons';
+import { Link } from 'react-router-dom';
+import { useAPI } from 'foremanReact/common/hooks/API/APIHooks';
+
+import { insightsCloudUrl } from '../InsightsCloudSync/InsightsCloudSyncHelpers';
+
+const vulnerabilityApiPath = path =>
+  insightsCloudUrl(`api/vulnerability/v1/${path}`);
+
+export const CVECountCell = ({ hostDetails }) => {
+  // eslint-disable-next-line camelcase
+  const uuid = hostDetails?.subscription_facet_attributes?.uuid;
+
+  const key = `HOST_CVE_COUNT_${uuid}`;
+  const response = useAPI(
+    uuid ? 'get' : null,
+    vulnerabilityApiPath(`systems?uuid=${uuid}`),
+    {
+      key,
+    }
+  );
+
+  if (uuid === undefined) {
+    return <UnknownIcon />;
+  }
+
+  // eslint-disable-next-line camelcase
+  const { cve_count } = (response.response?.data || [])[0]?.attributes || {};
+
+  const cveLink = (
+    // eslint-disable-next-line camelcase
+    <Link to={`hosts/${hostDetails.name}#/Vulnerabilities`}>{cve_count}</Link>
+  );
+
+  // eslint-disable-next-line camelcase
+  return cve_count === undefined ? <UnknownIcon /> : cveLink;
+};
+
+CVECountCell.propTypes = {
+  hostDetails: PropTypes.object.isRequired,
+};
+
+export default CVECountCell;

data/webpack/InsightsVulnerabilityHostIndexExtensions/__tests__/CVECountCell.test.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { API } from 'foremanReact/redux/API';
+import { CVECountCell } from '../CVECountCell';
+
+jest.mock('foremanReact/redux/API');
+API.get.mockImplementation(async () => ({
+  data: [
+    {
+      attributes: {
+        cve_count: 1,
+      },
+    },
+  ],
+}));
+
+describe('CVECountCell', () => {
+  it('renders an empty cves count column', () => {
+    const hostDetailsMock = {
+      name: 'test-host.example.com',
+      subscription_facet_attributes: {
+        uuid: null, // no subscription
+      },
+    };
+    render(<CVECountCell hostDetails={hostDetailsMock} />);
+    expect(screen.getByRole('img', { hidden: true })).toBeTruthy();
+  });
+});