jramos/cve-dashboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Show compliant/total counts on metric summary cards

Browse Source 
Display raw counts alongside percentages in the compliance metric health
cards, e.g. '67% (4/6)' instead of just '67%'. Data was already available
in the summary JSON (compliant, total fields) — just not rendered.

Closes #16
This commit is contained in:
Jordan Ramos
2026-05-26 11:48:53 -06:00
parent bfd1c4986f
commit dd6fc394ea
1 changed files with 4 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/components/pages/CompliancePage.js
View File

@@ -93,6 +93,7 @@ function groupByMetricFamily(allEntries, team) {
function VariantPill({ entry, label }) { function VariantPill({ entry, label }) {
const color = statusColor(entry.status); const color = statusColor(entry.status);
const isOk = entry.status === 'Meets/Exceeds Target'; const isOk = entry.status === 'Meets/Exceeds Target';
const hasRawCounts = entry.compliant != null && entry.total != null && entry.total > 0;
return ( return (
<span style={{ <span style={{
display: 'inline-flex', display: 'inline-flex',
@@ -116,6 +117,9 @@ function VariantPill({ entry, label }) {
)} )}
{label && <span style={{ color: '#94A3B8' }}>{label}</span>} {label && <span style={{ color: '#94A3B8' }}>{label}</span>}
<span style={{ color, fontWeight: '600' }}>{pctDisplay(entry.compliance_pct)}</span> <span style={{ color, fontWeight: '600' }}>{pctDisplay(entry.compliance_pct)}</span>
{hasRawCounts && (
<span style={{ color: '#64748B', fontSize: '0.58rem' }}>({entry.compliant}/{entry.total})</span>
)}
</span> </span>
); );
} }