20 lines
1.5 KiB
Markdown
20 lines
1.5 KiB
Markdown
|
# 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`
|