1.5 KiB
CCP Metrics Donut Chart Crash — 2026-05-19
Summary
The CCP Metrics page crashed with TypeError: t is not a function for users whose vertical data contained zero non-compliant devices. The root cause was Recharts' PieChart component failing internally when all data segments are zero.
Commit: 0c99420 on master
Bug 1: DonutChart crashes on zero non-compliant data
Symptom: Users accessing the CCP Metrics page see a white screen with Uncaught TypeError: t is not a function at $X (CCPMetricsPage.js:1111:32) in the browser console. The error is intermittent — only affects users whose verticals have no non-compliant devices.
Cause: The DonutChart component passed all-zero data ([{ count: 0 }, { count: 0 }]) to Recharts' PieChart. Recharts attempts to calculate arc angles by dividing by the total, which is zero. The resulting NaN propagates through internal Recharts functions, eventually causing a minified TypeError when a calculated value is called as a function. The existing guard (if (!donut) return null) only checked for a missing prop, not for the zero-total edge case.
Fix: Added a total === 0 guard after computing the sum of blocked and in-progress counts. When total is zero, the component renders a friendly "No non-compliant devices" message instead of attempting to render an empty pie chart. Also added defensive checks for donut.blocked and donut.in_progress being undefined.
Files changed:
frontend/src/components/pages/CCPMetricsPage.js