Add: Toggle to enable EPSS fields

The EPSS fields for CVEs and VTs can now be toggled with an option in the config.js file. This is done because no EPSS feed is provided yet, so the new fields should only be enabled for testing.
greenbone · Jun 18, 2024 · a0042e4 · a0042e4
1 parent e9a1b84
commit a0042e4
Show file tree

Hide file tree

Showing 11 changed files with 139 additions and 96 deletions.
diff --git a/src/gmp/gmpsettings.js b/src/gmp/gmpsettings.js
@@ -44,6 +44,7 @@ const warnDeprecatedSetting = (oldName, newName) => {
 class GmpSettings {
   constructor(storage = global.localStorage, options = {}) {
     const {
+      enableEPSS = false,
       enableGreenboneSensor = false,
       disableLoginForm = false,
       enableStoreDebugLog,
@@ -109,6 +110,7 @@ class GmpSettings {
     setAndFreeze(this, 'apiProtocol', apiProtocol);
     setAndFreeze(this, 'apiServer', apiServer);
     setAndFreeze(this, 'disableLoginForm', disableLoginForm);
+    setAndFreeze(this, 'enableEPSS', enableEPSS);
     setAndFreeze(this, 'enableGreenboneSensor', enableGreenboneSensor);
     setAndFreeze(this, 'guestUsername', guestUsername);
     setAndFreeze(this, 'guestPassword', guestPassword);

diff --git a/src/web/pages/cves/__tests__/detailspage.jsx b/src/web/pages/cves/__tests__/detailspage.jsx
@@ -139,7 +139,10 @@ describe('CVE Detailspage tests', () => {
         get: getCve,
       },
       reloadInterval,
-      settings: {manualUrl},
+      settings: {
+        manualUrl,
+        enableEPSS: true,
+      },
       user: {
         currentSettings,
         renewSession,

diff --git a/src/web/pages/cves/__tests__/listpage.jsx b/src/web/pages/cves/__tests__/listpage.jsx
@@ -109,7 +109,7 @@ describe('CvesPage tests', () => {
       filters: {
         get: getFilters,
       },
-      settings: {manualUrl, reloadInterval},
+      settings: {manualUrl, reloadInterval, enableEPSS: true},
       user: {currentSettings, getSetting},
     };
 

diff --git a/src/web/pages/cves/details.jsx b/src/web/pages/cves/details.jsx
@@ -25,6 +25,7 @@ import TableData from 'web/components/table/data';
 import TableRow from 'web/components/table/row';
 
 import PropTypes from 'web/utils/proptypes';
+import useGmp from "web/utils/useGmp.jsx";
 
 const CVSS_PROPS = {
   cvssAccessVector: _l('Access Vector'),
@@ -49,7 +50,7 @@ const CVSS_PROPS = {
 
 const CveDetails = ({entity}) => {
   const {cvssBaseVector, description, references = [], severity, epss} = entity;
-
+  const gmp = useGmp();
   return (
     <Layout flex="column" grow="1">
       {isDefined(description) && (
@@ -92,7 +93,7 @@ const CveDetails = ({entity}) => {
         </InfoTable>
       </DetailsBlock>
 
-      {isDefined(epss) && (
+      {gmp.settings.enableEPSS && isDefined(epss) && (
         <DetailsBlock title={_('EPSS')}>
           <InfoTable>
             <TableBody>

diff --git a/src/web/pages/cves/row.jsx b/src/web/pages/cves/row.jsx
@@ -26,44 +26,53 @@ import {RowDetailsToggle} from 'web/entities/row';
 
 import PropTypes from 'web/utils/proptypes';
 import {isNumber} from "gmp/utils/identity";
+import useGmp from "web/utils/useGmp.jsx";
 
 const Row = ({
   actionsComponent: ActionsComponent = EntitiesActions,
   entity,
   links = true,
   onToggleDetailsClick,
   ...props
-}) => (
-  <TableRow>
-    <TableData>
-      <span>
-        <RowDetailsToggle name={entity.id} onClick={onToggleDetailsClick}>
-          {entity.name}
-        </RowDetailsToggle>
-      </span>
-      <Comment text={entity.comment} />
-    </TableData>
-    <TableData>{shorten(entity.description, 160)}</TableData>
-    <TableData>
-      <DateTime date={entity.creationTime} />
-    </TableData>
-    <TableData>
-      <Link to="cvsscalculator" query={{cvssVector: entity.cvssBaseVector}}>
-        {entity.cvssBaseVector}
-      </Link>
-    </TableData>
-    <TableData>
-      <SeverityBar severity={entity.severity} />
-    </TableData>
-    <TableData>
-      {isNumber(entity?.epss?.score) ? entity.epss?.score.toFixed(5) : _("N/A")}
-    </TableData>
-    <TableData>
-      {isNumber(entity?.epss?.percentile) ? entity.epss?.percentile.toFixed(5) : _("N/A")}
-    </TableData>
-    <ActionsComponent {...props} entity={entity} />
-  </TableRow>
-);
+}) => {
+  const gmp = useGmp();
+  return (
+    <TableRow>
+      <TableData>
+        <span>
+          <RowDetailsToggle name={entity.id} onClick={onToggleDetailsClick}>
+            {entity.name}
+          </RowDetailsToggle>
+        </span>
+        <Comment text={entity.comment} />
+      </TableData>
+      <TableData>{shorten(entity.description, 160)}</TableData>
+      <TableData>
+        <DateTime date={entity.creationTime} />
+      </TableData>
+      <TableData>
+        <Link to="cvsscalculator" query={{cvssVector: entity.cvssBaseVector}}>
+          {entity.cvssBaseVector}
+        </Link>
+      </TableData>
+      <TableData>
+        <SeverityBar severity={entity.severity} />
+      </TableData>
+      {
+        gmp.settings.enableEPSS &&
+        <>
+          <TableData>
+            {isNumber(entity?.epss?.score) ? entity.epss?.score.toFixed(5) : _("N/A")}
+          </TableData>
+          <TableData>
+            {isNumber(entity?.epss?.percentile) ? entity.epss?.percentile.toFixed(5) : _("N/A")}
+          </TableData>
+        </>
+      }
+      <ActionsComponent {...props} entity={entity} />
+    </TableRow>
+  )
+};
 
 Row.propTypes = {
   actionsComponent: PropTypes.component,

diff --git a/src/web/pages/cves/table.jsx b/src/web/pages/cves/table.jsx
@@ -21,6 +21,7 @@ import TableRow from 'web/components/table/row';
 import CveDetails from './details';
 import CveRow from './row';
 import {isDefined} from "gmp/utils/identity.js";
+import useGmp from "web/utils/useGmp.jsx";
 
 const Header = ({
   actionsColumn,
@@ -30,6 +31,7 @@ const Header = ({
   currentSortDir,
   onSortChange,
 }) => {
+  const gmp = useGmp();
   return (
     <TableHeader>
       <TableRow>
@@ -44,7 +46,7 @@ const Header = ({
         />
         <TableHead
           rowSpan="2"
-          width="52%"
+          width={gmp.settings.enableEPSS ? '52%' : '62%'}
           currentSortDir={currentSortDir}
           currentSortBy={currentSortBy}
           sortBy={sort ? 'description' : false}
@@ -78,9 +80,11 @@ const Header = ({
           onSortChange={onSortChange}
           title={_('Severity')}
         />
-        <TableHead colSpan="2">
-          {_("EPSS")}
-        </TableHead>
+        {gmp.settings.enableEPSS &&
+          <TableHead colSpan="2">
+            {_("EPSS")}
+          </TableHead>
+        }
         {isDefined(actionsColumn) ? (
           actionsColumn
         ) : (
@@ -89,24 +93,27 @@ const Header = ({
           </TableHead>
         )}
       </TableRow>
-      <TableRow>
-        <TableHead
-          width="5%"
-          currentSortDir={currentSortDir}
-          currentSortBy={currentSortBy}
-          sortBy={sort ? 'epss_score' : false}
-          onSortChange={onSortChange}
-          title={_('Score')}
-        />
-        <TableHead
-          width="5%"
-          currentSortDir={currentSortDir}
-          currentSortBy={currentSortBy}
-          sortBy={sort ? 'epss_percentile' : false}
-          onSortChange={onSortChange}
-          title={_('Percentile')}
-        />
-      </TableRow>
+      {
+        gmp.settings.enableEPSS &&
+        <TableRow>
+          <TableHead
+            width="5%"
+            currentSortDir={currentSortDir}
+            currentSortBy={currentSortBy}
+            sortBy={sort ? 'epss_score' : false}
+            onSortChange={onSortChange}
+            title={_('Score')}
+          />
+          <TableHead
+            width="5%"
+            currentSortDir={currentSortDir}
+            currentSortBy={currentSortBy}
+            sortBy={sort ? 'epss_percentile' : false}
+            onSortChange={onSortChange}
+            title={_('Percentile')}
+          />
+        </TableRow>
+      }
     </TableHeader>
   );
 };

diff --git a/src/web/pages/nvts/__tests__/detailspage.jsx b/src/web/pages/nvts/__tests__/detailspage.jsx
@@ -253,7 +253,7 @@ describe('Nvt Detailspage tests', () => {
       nvt: {
         get: getNvt,
       },
-      settings: {manualUrl, reloadInterval},
+      settings: {manualUrl, reloadInterval, enableEPSS: true},
       user: {
         currentSettings,
       },
@@ -375,7 +375,7 @@ describe('Nvt Detailspage tests', () => {
       overrides: {
         get: getEntities,
       },
-      settings: {manualUrl, reloadInterval},
+      settings: {manualUrl, reloadInterval, enableEPSS: true},
       user: {
         currentSettings,
         renewSession,
@@ -419,7 +419,7 @@ describe('Nvt Detailspage tests', () => {
       overrides: {
         get: getEntities,
       },
-      settings: {manualUrl, reloadInterval},
+      settings: {manualUrl, reloadInterval, enableEPSS: true},
       user: {
         currentSettings,
         renewSession,
@@ -455,7 +455,7 @@ describe('Nvt ToolBarIcons tests', () => {
     const handleOnNoteCreateClick = testing.fn();
     const handleOnOverrideCreateClick = testing.fn();
 
-    const gmp = {settings: {manualUrl}};
+    const gmp = {settings: {manualUrl, enableEPSS: true}};
 
     const {render} = rendererWith({
       gmp,
@@ -502,7 +502,7 @@ describe('Nvt ToolBarIcons tests', () => {
     const handleOnNoteCreateClick = testing.fn();
     const handleOnOverrideCreateClick = testing.fn();
 
-    const gmp = {settings: {manualUrl}};
+    const gmp = {settings: {manualUrl, enableEPSS: true}};
 
     const {render} = rendererWith({
       gmp,

diff --git a/src/web/pages/nvts/__tests__/listpage.jsx b/src/web/pages/nvts/__tests__/listpage.jsx
@@ -122,7 +122,7 @@ describe('NvtsPage tests', () => {
       filters: {
         get: getFilters,
       },
-      settings: {manualUrl, reloadInterval},
+      settings: {manualUrl, reloadInterval, enableEPSS: true},
       user: {currentSettings, getSetting},
     };
 
@@ -238,7 +238,7 @@ describe('NvtsPage tests', () => {
       filters: {
         get: getFilters,
       },
-      settings: {manualUrl, reloadInterval},
+      settings: {manualUrl, reloadInterval, enableEPSS: true},
       user: {renewSession, currentSettings, getSetting: getSetting},
     };
 

diff --git a/src/web/pages/nvts/details.jsx b/src/web/pages/nvts/details.jsx
@@ -12,6 +12,7 @@ import {isDefined, isNumber} from 'gmp/utils/identity';
 import {TAG_NA} from 'gmp/models/nvt';
 
 import PropTypes from 'web/utils/proptypes';
+import useGmp from "web/utils/useGmp.jsx";
 
 import {na, getTranslatableSeverityOrigin} from 'web/utils/render';
 
@@ -45,6 +46,7 @@ const NvtDetails = ({entity, links = true}) => {
     severityOrigin,
     severityDate,
   } = entity;
+  const gmp = useGmp();
   return (
     <Layout flex="column" grow="1">
       {entity.isDeprecated() && <div>{_('This NVT is deprecated.')}</div>}
@@ -97,7 +99,7 @@ const NvtDetails = ({entity, links = true}) => {
                 )}
               </TableData>
             </TableRow>
-            { isDefined(epss?.max_severity) &&
+            { gmp.settings.enableEPSS && isDefined(epss?.max_severity) &&
               <>
                 <TableData colSpan="2">
                   <b>{_('EPSS (CVE with highest severity)')}</b>
@@ -133,7 +135,7 @@ const NvtDetails = ({entity, links = true}) => {
                 </TableRow>
               </>
             }
-            { isDefined(epss?.max_epss) &&
+            { gmp.settings.enableEPSS && isDefined(epss?.max_epss) &&
               <>
                 <TableData colSpan="2">
                   <b>{_('EPSS (highest EPSS score)')}</b>

diff --git a/src/web/pages/nvts/row.jsx b/src/web/pages/nvts/row.jsx
@@ -30,6 +30,7 @@ import EntitiesActions from 'web/entities/actions';
 import {RowDetailsToggle} from 'web/entities/row';
 
 import PropTypes from 'web/utils/proptypes';
+import useGmp from "web/utils/useGmp.jsx";
 import {_} from "gmp/locale/lang.js";
 
 const Row = ({
@@ -40,6 +41,7 @@ const Row = ({
   onToggleDetailsClick,
   ...props
 }) => {
+  const gmp = useGmp();
   const handleFilterChanged = () => {
     const filter = Filter.fromString('family="' + entity.family + '"');
     onFilterChanged(filter);
@@ -90,14 +92,19 @@ const Row = ({
       <TableData align="end">
         {entity.qod && <Qod value={entity.qod.value} />}
       </TableData>
-      <TableData>
-        {isNumber(entity?.epss?.max_severity?.score)
-          ? entity.epss?.max_severity?.score.toFixed(5) : _("N/A")}
-      </TableData>
-      <TableData>
-        {isNumber(entity?.epss?.max_severity?.percentile)
-          ? entity.epss?.max_severity?.percentile.toFixed(5) : _("N/A")}
-      </TableData>
+      {
+        gmp.settings.enableEPSS &&
+        <>
+          <TableData>
+            {isNumber(entity?.epss?.max_severity?.score)
+              ? entity.epss?.max_severity?.score.toFixed(5) : _("N/A")}
+          </TableData>
+          <TableData>
+            {isNumber(entity?.epss?.max_severity?.percentile)
+              ? entity.epss?.max_severity?.percentile.toFixed(5) : _("N/A")}
+          </TableData>
+        </>
+      }
       <ActionsComponent {...props} entity={entity} />
     </TableRow>
   );