diff --git a/backend/src/api/vulnerabilities.ts b/backend/src/api/vulnerabilities.ts index 1e0cbe6a..7e433a52 100644 --- a/backend/src/api/vulnerabilities.ts +++ b/backend/src/api/vulnerabilities.ts @@ -124,11 +124,12 @@ class VulnerabilitySearch { if (this.filters?.severity) { if (this.filters.severity === 'N/A') { qs.andWhere( - "vulnerability.severity IS NULL OR vulnerability.severity = ''" + "vulnerability.severity IS NULL OR vulnerability.severity = '' OR vulnerability.severity ILIKE 'N/A' OR vulnerability.severity ILIKE 'NULL'" ); } else if (this.filters.severity === 'Other') { qs.andWhere( - `vulnerability.severity NOT ILIKE 'N/A' AND + `vulnerability.severity NOT ILIKE 'NULL' AND + vulnerability.severity NOT ILIKE 'N/A' AND vulnerability.severity NOT ILIKE 'Low' AND vulnerability.severity NOT ILIKE 'Medium' AND vulnerability.severity NOT ILIKE 'High' AND diff --git a/frontend/src/pages/Risk/VulnerabilityBarChart.tsx b/frontend/src/pages/Risk/VulnerabilityBarChart.tsx index 2a14a806..1872a45d 100644 --- a/frontend/src/pages/Risk/VulnerabilityBarChart.tsx +++ b/frontend/src/pages/Risk/VulnerabilityBarChart.tsx @@ -73,16 +73,12 @@ const VulnerabilityBarChart = (props: { ); - // Place null values in "N/A" and capitalize the first letter of each word in the data. + // Capitalize the first letter of each word in the data. const titleCaseData: BarData[] = data.map((d) => { - if (d.id === 'null' || d.id === null || d.id === '') { - return { id: 'N/A', value: d.value }; - } else { - return { - id: d.id[0]?.toUpperCase() + d.id.slice(1)?.toLowerCase(), - value: d.value - }; - } + return { + id: d.id[0]?.toUpperCase() + d.id.slice(1)?.toLowerCase(), + value: d.value + }; }); // Group the data by severity level and "Other". Sum the values for each group. @@ -98,6 +94,9 @@ const VulnerabilityBarChart = (props: { ]; if (severityLevels.includes(d.id)) { return d; + } + if (!d.id || ['Null', 'N/a', 'undefined', ''].includes(d.id)) { + return { id: 'N/A', value: d.value }; } else { return { id: 'Other', value: d.value }; } diff --git a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx index 09c2bdd9..65b32ba9 100644 --- a/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx +++ b/frontend/src/pages/Vulnerabilities/Vulnerabilities.tsx @@ -312,19 +312,31 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ const titleCase = (str: string) => str.charAt(0).toUpperCase() + str.slice(1).toLowerCase(); - const severityLevels: string[] = ['Low', 'Medium', 'High', 'Critical']; + const severityLevels: string[] = [ + 'N/A', + 'Low', + 'Medium', + 'High', + 'Critical', + 'Other' + ]; - const formatSeverity = (severity: string) => { - if (severity === null || severity === '' || severity === 'N/A') { + const formatSeverity = (severity?: any) => { + const titleCaseSev = titleCase(severity); + if (severityLevels.includes(titleCaseSev)) { + return titleCaseSev; + } + if ( + !titleCaseSev || + ['Null', 'N/a', 'undefined', ''].includes(titleCaseSev) + ) { return 'N/A'; - } else if (severityLevels.includes(titleCase(severity))) { - return titleCase(severity); } else { return 'Other'; } }; - const severity = formatSeverity(vuln.severity ?? ''); + const severity = formatSeverity(vuln.severity ?? 'N/A'); return { id: vuln.id, @@ -388,10 +400,12 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ flex: 0.5, sortComparator: (v1, v2, cellParams1, cellParams2) => { const severityLevels: Record = { - Low: 1, - Medium: 2, - High: 3, - Critical: 4 + 'N/A': 1, + Low: 2, + Medium: 3, + High: 4, + Critical: 5, + Other: 6 }; return ( severityLevels[cellParams1.value] - severityLevels[cellParams2.value] @@ -399,10 +413,12 @@ export const Vulnerabilities: React.FC<{ groupBy?: string }> = ({ }, renderCell: (cellValues: GridRenderCellParams) => { const severityLevels: Record = { + NA: 0, Low: 1, Medium: 2, High: 3, - Critical: 4 + Critical: 4, + Other: 5 }; return (