@rhc-shared-components/vulnerability-summary NPM

@rhc-shared-components/vulnerability-summary

The vulnerability summary component takes two props, a list of vulnerabilities and an image grade. If the image grade is A, a empty state would display, otherwise a summary of vulnerabilities will render in a bar chart form.

Install

npm install --save @rhc-shared-components/vulnerability-summary

Usage

import React from 'react';
import { VulnerabilitySummary } from '@rhc-shared-components/vulnerability-summary';

const vulnerabilities = [
  {
    "_id": "61de52def5a0de0193eff061",
    "_links": {},
    "advisory_id": "2022:0064",
    "advisory_type": "RHSA",
    "creation_date": "2022-01-12T04:02:38.666000+00:00",
    "cve_id": "CVE-2021-3712",
    "last_update_date": "2022-01-12T04:02:38.666000+00:00",
    "object_type": "containerImageVulnerability",
    "packages": [
      {
        "rpm_nvra": [
          "openssl-libs-1.0.2k-22.el7_9.ppc64le"
        ],
        "srpm_nevra": "openssl-1:1.0.2k-23.el7_9.src"
      }
    ],
    "public_date": "2022-01-11T00:00:00Z",
    "severity": "Moderate"
  }
];

const App = () => {
  return ( <VulnerabilitySummary vulnerabilities={vulnerabilities} imageGrade="C"/> )
}