foreman_cve_scanner 0.6.1 → 0.7.0

data/webpack/components/CveScansReports.js

@@ -1,12 +1,20 @@
 /* eslint-disable import/no-unresolved */
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Button, Checkbox, Pagination, Title } from '@patternfly/react-core';
+import { Button, Checkbox, Pagination } from '@patternfly/react-core';
 import { Table, Thead, Tbody, Tr, Th, Td } from '@patternfly/react-table';
 import { translate as __ } from 'foremanReact/common/I18n';
 import RelativeDateTime from 'foremanReact/components/common/dates/RelativeDateTime';
 import { formatScanOrigin } from './cve_helpers';
 
+const SCAN_COUNT_COLUMNS = [
+  { key: 'total', label: __('Total'), filter: 'all' },
+  { key: 'critical', label: __('Critical'), filter: 'critical' },
+  { key: 'high', label: __('High'), filter: 'high' },
+  { key: 'medium', label: __('Medium'), filter: 'medium' },
+  { key: 'low', label: __('Low'), filter: 'low' },
+];
+
 const CveScansReports = ({
   scans,
   itemCount,
@@ -22,13 +30,8 @@ const CveScansReports = ({
   onOpenModal,
   exportUrlFor,
 }) => (
-  <section className="cve-scans-section" aria-label="CVE scan reports">
+  <section className="cve-scans-section" aria-label="CVE scan history">
     <div className="cve-scans-section-header">
-      <div className="cve-scans-section-title">
-        <Title headingLevel="h3" size="lg" ouiaId="cve-scans-reports-title">
-          {__('Reports')}
-        </Title>
-      </div>
       <Pagination
         itemCount={itemCount}
         perPage={perPage}
@@ -73,11 +76,9 @@ const CveScansReports = ({
           <Th>{__('Select')}</Th>
           <Th>{__('Scanned at')}</Th>
           <Th>{__('Scanner')}</Th>
-          <Th>{__('Total')}</Th>
-          <Th>{__('Critical')}</Th>
-          <Th>{__('High')}</Th>
-          <Th>{__('Medium')}</Th>
-          <Th>{__('Low')}</Th>
+          {SCAN_COUNT_COLUMNS.map(column => (
+            <Th key={column.key}>{column.label}</Th>
+          ))}
           <Th>{__('Export')}</Th>
         </Tr>
       </Thead>
@@ -113,56 +114,18 @@ const CveScansReports = ({
             <Td dataLabel={__('Scanner')}>
               {formatScanOrigin(scan.scanner, scan.source)}
             </Td>
-            <Td dataLabel={__('Total')}>
-              <Button
-                variant="link"
-                className="cve-summary-link"
-                onClick={() => onOpenModal(scan.id, 'all')}
-                ouiaId={`cve-scans-total-${scan.id}`}
-              >
-                {scan.total}
-              </Button>
-            </Td>
-            <Td dataLabel={__('Critical')}>
-              <Button
-                variant="link"
-                className="cve-summary-link"
-                onClick={() => onOpenModal(scan.id, 'critical')}
-                ouiaId={`cve-scans-critical-${scan.id}`}
-              >
-                {scan.critical}
-              </Button>
-            </Td>
-            <Td dataLabel={__('High')}>
-              <Button
-                variant="link"
-                className="cve-summary-link"
-                onClick={() => onOpenModal(scan.id, 'high')}
-                ouiaId={`cve-scans-high-${scan.id}`}
-              >
-                {scan.high}
-              </Button>
-            </Td>
-            <Td dataLabel={__('Medium')}>
-              <Button
-                variant="link"
-                className="cve-summary-link"
-                onClick={() => onOpenModal(scan.id, 'medium')}
-                ouiaId={`cve-scans-medium-${scan.id}`}
-              >
-                {scan.medium}
-              </Button>
-            </Td>
-            <Td dataLabel={__('Low')}>
-              <Button
-                variant="link"
-                className="cve-summary-link"
-                onClick={() => onOpenModal(scan.id, 'low')}
-                ouiaId={`cve-scans-low-${scan.id}`}
-              >
-                {scan.low}
-              </Button>
-            </Td>
+            {SCAN_COUNT_COLUMNS.map(column => (
+              <Td key={column.key} dataLabel={column.label}>
+                <Button
+                  variant="link"
+                  className="cve-summary-link"
+                  onClick={() => onOpenModal(scan.id, column.filter)}
+                  ouiaId={`cve-scans-${column.key}-${scan.id}`}
+                >
+                  {scan[column.key]}
+                </Button>
+              </Td>
+            ))}
             <Td dataLabel={__('Export')}>
               <Button
                 component="a"

data/webpack/components/CveScansTab.js

@@ -17,6 +17,7 @@ import { translate as __ } from 'foremanReact/common/I18n';
 import SkeletonLoader from 'foremanReact/components/common/SkeletonLoader';
 import { STATUS } from 'foremanReact/constants';
 import CveTrendChart from './CveTrendChart';
+import CveFindingsView from './CveFindingsView';
 import CveScansReports from './CveScansReports';
 import CveFindingsModal from './CveFindingsModal';
 import CveCompareModal from './CveCompareModal';
@@ -25,17 +26,19 @@ import { noReportsBody, noReportsTitle } from './cve_helpers';
 import './cve_scans.scss';
 
 const DEFAULT_PER_PAGE = 20;
-const OVERVIEW_TAB = 0;
-const REPORTS_TAB = 1;
+const LATEST_SCAN_TAB = 0;
+const TRENDS_TAB = 1;
+const HISTORY_TAB = 2;
 
 const CveScansTab = ({ response }) => {
   const hostId = response?.id;
+  const hostName = response?.name;
   const [page, setPage] = useState(1);
   const [perPage, setPerPage] = useState(DEFAULT_PER_PAGE);
   const [isCompareOpen, setIsCompareOpen] = useState(false);
   const [selectedScanIds, setSelectedScanIds] = useState([]);
   const [isTrendCompareMode, setIsTrendCompareMode] = useState(false);
-  const [activeTabKey, setActiveTabKey] = useState(OVERVIEW_TAB);
+  const [activeTabKey, setActiveTabKey] = useState(LATEST_SCAN_TAB);
   const { isOpen, scanId, filter, openModal, closeModal } = useModalScan();
 
   const historyUrl = hostId
@@ -43,11 +46,22 @@ const CveScansTab = ({ response }) => {
         `/api/v2/hosts/${hostId}/cve_scans?page=${page}&per_page=${perPage}`
       )
     : null;
+  const latestUrl = hostId
+    ? foremanUrl(`/api/v2/hosts/${hostId}/cve_scans/latest`)
+    : null;
   const { response: apiResponse, status } = useAPI('get', historyUrl, {
     key: `CVE_SCANS_TAB_${hostId}_${page}_${perPage}`,
   });
+  const { response: latestResponse, status: latestStatus } = useAPI(
+    'get',
+    latestUrl,
+    {
+      key: `CVE_SCANS_TAB_LATEST_${hostId}`,
+    }
+  );
 
   const scans = useMemo(() => apiResponse?.results || [], [apiResponse]);
+  const latestScan = latestResponse?.id ? latestResponse : null;
   const selectedScans = useMemo(
     () => scans.filter(scan => selectedScanIds.includes(scan.id)),
     [scans, selectedScanIds]
@@ -123,9 +137,26 @@ const CveScansTab = ({ response }) => {
             ouiaId="cve-scans-subtabs"
           >
             <Tab
-              eventKey={OVERVIEW_TAB}
-              title={<TabTitleText>{__('Overview')}</TabTitleText>}
-              ouiaId="cve-scans-overview-tab"
+              eventKey={LATEST_SCAN_TAB}
+              title={<TabTitleText>{__('Latest Scan')}</TabTitleText>}
+              ouiaId="cve-scans-latest-tab"
+            >
+              <section
+                className="cve-scans-section"
+                aria-label="Latest CVE scan"
+              >
+                <CveFindingsView
+                  scan={latestScan}
+                  status={latestStatus}
+                  initialFilter="all"
+                  hostName={hostName}
+                />
+              </section>
+            </Tab>
+            <Tab
+              eventKey={TRENDS_TAB}
+              title={<TabTitleText>{__('Trends')}</TabTitleText>}
+              ouiaId="cve-scans-trends-tab"
             >
               <section
                 className="cve-scans-section"
@@ -142,9 +173,9 @@ const CveScansTab = ({ response }) => {
               </section>
             </Tab>
             <Tab
-              eventKey={REPORTS_TAB}
-              title={<TabTitleText>{__('Reports')}</TabTitleText>}
-              ouiaId="cve-scans-reports-tab"
+              eventKey={HISTORY_TAB}
+              title={<TabTitleText>{__('History')}</TabTitleText>}
+              ouiaId="cve-scans-history-tab"
             >
               <CveScansReports
                 scans={scans}
@@ -169,6 +200,7 @@ const CveScansTab = ({ response }) => {
         isOpen={isOpen}
         onClose={closeModal}
         hostId={hostId}
+        hostName={hostName}
         scanId={scanId}
         initialFilter={filter}
       />
@@ -185,6 +217,7 @@ const CveScansTab = ({ response }) => {
 CveScansTab.propTypes = {
   response: PropTypes.shape({
     id: PropTypes.number,
+    name: PropTypes.string,
   }),
 };
 

data/webpack/components/CveSummaryCell.js

@@ -1,33 +1,45 @@
 /* eslint-disable import/no-unresolved */
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import { Spinner } from '@patternfly/react-core';
-import { useAPI } from 'foremanReact/common/hooks/API/APIHooks';
-import { foremanUrl } from 'foremanReact/common/helpers';
 import { translate as __ } from 'foremanReact/common/I18n';
-import { STATUS } from 'foremanReact/constants';
 import SeverityIcon from './SeverityIcon';
 import CveFindingsModal from './CveFindingsModal';
+import {
+  getCachedCveSummary,
+  subscribeToCveSummary,
+} from './cve_summary_store';
 import './cve_scans.scss';
 
 const CveSummaryCell = ({ hostId, hostName }) => {
-  const url = hostId
-    ? foremanUrl(`/api/v2/hosts/${hostId}/cve_scans/latest`)
-    : null;
-  const { response, status } = useAPI('get', url, {
-    key: `CVE_SUMMARY_${hostId}`,
-  });
-
   const [isModalOpen, setIsModalOpen] = useState(false);
+  const [response, setResponse] = useState(
+    hostId ? getCachedCveSummary(hostId) : null
+  );
+  const [isLoaded, setIsLoaded] = useState(
+    hostId ? getCachedCveSummary(hostId) !== undefined : true
+  );
+
+  useEffect(() => {
+    if (!hostId) {
+      setResponse(null);
+      setIsLoaded(true);
+      return undefined;
+    }
+
+    const cached = getCachedCveSummary(hostId);
+    setResponse(cached);
+    setIsLoaded(cached !== undefined);
+
+    return subscribeToCveSummary(hostId, value => {
+      setResponse(value);
+      setIsLoaded(true);
+    });
+  }, [hostId]);
+
   if (!hostId) return <span className="cve-summary-empty">--</span>;
-  if (status === STATUS.PENDING) {
-    return (
-      <Spinner
-        size="sm"
-        aria-label={__('Loading CVE findings')}
-        ouiaId="cve-summary-loading"
-      />
-    );
+  if (!isLoaded) {
+    return <Spinner size="sm" aria-label={__('Loading CVE findings')} />;
   }
 
   if (!response) return <span className="cve-summary-empty">--</span>;

data/webpack/components/CveTrendChart.js

@@ -1,13 +1,7 @@
 /* eslint-disable import/no-unresolved */
 import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
-import {
-  Button,
-  Text,
-  TextContent,
-  TextVariants,
-  Tooltip,
-} from '@patternfly/react-core';
+import { Button, Tooltip } from '@patternfly/react-core';
 import { translate as __ } from 'foremanReact/common/I18n';
 import { formatScannedAt } from './cve_helpers';
 
@@ -97,15 +91,6 @@ const CveTrendChart = ({
 
   return (
     <section className="cve-trend" aria-label="CVE trend chart">
-      <TextContent className="cve-section-title">
-        <Text component={TextVariants.h4} ouiaId="cve-trend-title">
-          {__('Trend')}
-        </Text>
-        <Text component={TextVariants.small} ouiaId="cve-trend-subtitle">
-          {__('Last %s scans').replace('%s', visibleScans.length)}
-        </Text>
-      </TextContent>
-
       <div className="cve-trend-summary">
         <div className="cve-trend-card">
           <span className="cve-trend-card-label">{__('Latest total')}</span>

data/webpack/components/__tests__/CveDetailsCard.test.js

@@ -1,4 +1,4 @@
-/* eslint-disable import/no-unresolved */
+/* eslint-disable import/no-unresolved, react/prop-types */
 import React from 'react';
 import { mount } from 'enzyme';
 import CveDetailsCard from '../CveDetailsCard';
@@ -7,17 +7,20 @@ jest.mock('foremanReact/common/hooks/API/APIHooks', () => ({
   useAPI: jest.fn(),
 }));
 
-jest.mock('foremanReact/components/HostDetails/Templates/CardItem/CardTemplate', () => (
-  { children }
-) => <div>{children}</div>);
+jest.mock(
+  'foremanReact/components/HostDetails/Templates/CardItem/CardTemplate',
+  () => ({ children }) => <div>{children}</div>
+);
 
-jest.mock('foremanReact/components/common/SkeletonLoader', () => (
-  { children }
-) => <div>{children}</div>);
+jest.mock(
+  'foremanReact/components/common/SkeletonLoader',
+  () => ({ children }) => <div>{children}</div>
+);
 
-jest.mock('foremanReact/components/common/dates/RelativeDateTime', () => (
-  { date, defaultValue }
-) => <span>{date || defaultValue}</span>);
+jest.mock(
+  'foremanReact/components/common/dates/RelativeDateTime',
+  () => ({ date, defaultValue }) => <span>{date || defaultValue}</span>
+);
 
 jest.mock('../CveFindingsModal', () => () => <div data-test="modal" />);
 
@@ -32,9 +35,27 @@ describe('CveDetailsCard', () => {
     const hostDetails = { id: 1 };
     const historyResponse = {
       results: [
-        { id: 1, scanned_at: '2026-02-20', scanner: 'trivy', source: 'rex', total: 10 },
-        { id: 2, scanned_at: '2026-02-21', scanner: 'trivy', source: 'rex', total: 12 },
-        { id: 3, scanned_at: '2026-02-22', scanner: 'grype', source: 'external', total: 8 },
+        {
+          id: 1,
+          scanned_at: '2026-02-20',
+          scanner: 'trivy',
+          source: 'rex',
+          total: 10,
+        },
+        {
+          id: 2,
+          scanned_at: '2026-02-21',
+          scanner: 'trivy',
+          source: 'rex',
+          total: 12,
+        },
+        {
+          id: 3,
+          scanned_at: '2026-02-22',
+          scanner: 'grype',
+          source: 'external',
+          total: 8,
+        },
       ],
     };
     const latestResponse = {
@@ -73,6 +94,46 @@ describe('CveDetailsCard', () => {
     expect(wrapper.text()).toContain('pkg');
   });
 
+  it('renders fix availability summary when latest scan is enriched', () => {
+    const hostDetails = { id: 1 };
+    const latestResponse = {
+      id: 3,
+      scanned_at: '2026-02-22',
+      scanner: 'grype',
+      source: 'external',
+      total: 3,
+      summary: { worst: 'high' },
+      critical: 0,
+      high: 1,
+      medium: 1,
+      low: 1,
+      findings: [
+        {
+          id: 'CVE-1',
+          name: 'openssl',
+          version: '1.0',
+          severity: 'HIGH',
+          katello_fix: { status: 'installable' },
+        },
+        {
+          id: 'CVE-2',
+          name: 'curl',
+          version: '8.0',
+          severity: 'MEDIUM',
+          katello_fix: { status: 'applicable' },
+        },
+      ],
+    };
+
+    useAPI.mockReturnValue({ response: latestResponse, status: 'RESOLVED' });
+
+    const wrapper = mount(<CveDetailsCard hostDetails={hostDetails} />);
+
+    expect(wrapper.text()).toContain('Fix availability');
+    expect(wrapper.text()).toContain('Fixable: 1');
+    expect(wrapper.text()).toContain('Applicable: 1');
+  });
+
   it('renders empty state when latest is empty', () => {
     const hostDetails = { id: 1 };
     useAPI.mockReturnValue({ response: {}, status: 'RESOLVED' });
@@ -84,7 +145,15 @@ describe('CveDetailsCard', () => {
   it('prefers latest when present', () => {
     const hostDetails = { id: 1 };
     const historyResponse = {
-      results: [{ id: 1, scanned_at: '2026-02-20', scanner: 'trivy', source: 'rex', total: 10 }],
+      results: [
+        {
+          id: 1,
+          scanned_at: '2026-02-20',
+          scanner: 'trivy',
+          source: 'rex',
+          total: 10,
+        },
+      ],
     };
     const latestResponse = {
       id: 2,

data/webpack/components/__tests__/CveFindingsModal.test.js

@@ -55,7 +55,7 @@ describe('CveFindingsModal', () => {
     expect(wrapper.text()).not.toContain('CVE-1');
   });
 
-  it('shows empty state when no findings', () => {
+  it('shows success state when no findings', () => {
     useAPI.mockReturnValue({
       response: {
         id: 1,
@@ -78,7 +78,10 @@ describe('CveFindingsModal', () => {
       />
     );
 
-    expect(wrapper.text()).toContain('No findings for selected filter');
+    expect(wrapper.text()).toContain('No CVEs found');
+    expect(wrapper.text()).toContain(
+      'The latest CVE scan found no vulnerabilities for this host.'
+    );
   });
 
   it('filters findings by search text', () => {

data/webpack/components/__tests__/CveFindingsView.test.js

@@ -0,0 +1,153 @@
+/* eslint-disable import/no-unresolved */
+import React from 'react';
+import { mount } from 'enzyme';
+import { act } from 'react-dom/test-utils';
+import CveFindingsView from '../CveFindingsView';
+
+describe('CveFindingsView', () => {
+  it('renders no reports state when scan is missing', () => {
+    const wrapper = mount(
+      <CveFindingsView scan={null} status="RESOLVED" initialFilter="all" />
+    );
+
+    expect(wrapper.text()).toContain('No CVE reports for this host');
+    expect(wrapper.text()).toContain('Run a CVE scan to see results here.');
+  });
+
+  it('renders success state when scan has no findings', () => {
+    const wrapper = mount(
+      <CveFindingsView
+        scan={{
+          id: 1,
+          scanned_at: '2026-02-22T10:00:00Z',
+          scanner: 'trivy',
+          source: 'rex',
+          total: 0,
+          findings: [],
+        }}
+        status="RESOLVED"
+        initialFilter="all"
+      />
+    );
+
+    expect(wrapper.text()).toContain('No CVEs found');
+    expect(wrapper.text()).toContain(
+      'The latest CVE scan found no vulnerabilities for this host.'
+    );
+  });
+
+  it('filters findings by severity and search text', () => {
+    const wrapper = mount(
+      <CveFindingsView
+        scan={{
+          id: 1,
+          scanned_at: '2026-02-22T10:00:00Z',
+          scanner: 'trivy',
+          source: 'rex',
+          total: 2,
+          findings: [
+            {
+              id: 'CVE-1',
+              severity: 'HIGH',
+              name: 'openssl',
+              version: '1.1',
+              title: 'OpenSSL issue',
+            },
+            {
+              id: 'CVE-2',
+              severity: 'LOW',
+              name: 'curl',
+              version: '8.0',
+              title: 'Curl issue',
+            },
+          ],
+        }}
+        status="RESOLVED"
+        initialFilter="all"
+      />
+    );
+
+    const lowButton = wrapper
+      .find('button')
+      .filterWhere(node => node.text().toLowerCase() === 'low')
+      .first();
+    lowButton.simulate('click');
+    wrapper.update();
+
+    expect(wrapper.text()).toContain('CVE-2');
+    expect(wrapper.text()).not.toContain('CVE-1');
+
+    const allButton = wrapper
+      .find('button')
+      .filterWhere(node => node.text().toLowerCase() === 'all')
+      .first();
+    allButton.simulate('click');
+
+    act(() => {
+      wrapper.find('SearchInput').prop('onChange')('openssl');
+    });
+    wrapper.update();
+
+    expect(wrapper.text()).toContain('CVE-1');
+    expect(wrapper.text()).not.toContain('CVE-2');
+  });
+
+  it('renders fix availability when present', () => {
+    const wrapper = mount(
+      <CveFindingsView
+        scan={{
+          id: 1,
+          scanned_at: '2026-02-22T10:00:00Z',
+          scanner: 'trivy',
+          source: 'rex',
+          total: 2,
+          findings: [
+            {
+              id: 'CVE-1',
+              severity: 'HIGH',
+              name: 'openssl',
+              version: '1.1',
+              title: 'OpenSSL issue',
+              katello_fix: {
+                status: 'installable',
+                errata: [{ errata_id: 'RHSA-2026:0001' }],
+              },
+            },
+            {
+              id: 'CVE-2',
+              severity: 'LOW',
+              name: 'curl',
+              version: '8.0',
+              title: 'Curl issue',
+              katello_fix: {
+                status: 'applicable',
+                errata: [{ id: 1, errata_id: 'RHSA-2026:0002' }],
+              },
+            },
+          ],
+        }}
+        status="RESOLVED"
+        initialFilter="all"
+        hostName="host.example.com"
+      />
+    );
+
+    expect(wrapper.text()).toContain('Fix availability');
+    expect(wrapper.text()).toContain('Installable');
+    expect(wrapper.text()).toContain('Applicable');
+    const installLink = wrapper
+      .find('a')
+      .filterWhere(node => node.text() === 'Installable')
+      .first();
+    const applicableLink = wrapper
+      .find('a')
+      .filterWhere(node => node.text() === 'Applicable')
+      .first();
+
+    expect(installLink.prop('href')).toContain('/job_invocations/new?');
+    expect(installLink.prop('href')).toContain(
+      'katello_errata_install_by_search'
+    );
+    expect(applicableLink.prop('href')).toBe('/errata/1');
+  });
+});