From fbd37511029d30c405e9f872e2d02627182b3ce2 Mon Sep 17 00:00:00 2001
From: hobokenchicken <dustin@dustin.coffee>
Date: Mon, 2 Mar 2026 13:49:37 -0500
Subject: [PATCH] fix(dashboard): guard customTooltip plugin against undefined
 tooltip and missing Y scale

chart.tooltip is undefined during initial draw for radial chart types
(doughnut/pie), and chart.scales.y doesn't exist on non-cartesian charts.
This crashed chart creation, causing 'Failed to load' messages on all pages.
---
 static/js/charts.js | 36 +++++++++++++++++++-----------------
 1 file changed, 19 insertions(+), 17 deletions(-)

diff --git a/static/js/charts.js b/static/js/charts.js
index 72777b37..b83647d1 100644
--- a/static/js/charts.js
+++ b/static/js/charts.js
@@ -26,27 +26,29 @@ class ChartManager {
     }
 
     registerPlugins() {
-        // Register a plugin for tooltip background
+        // Register a plugin that draws a vertical dashed line at the active tooltip point.
+        // Only applies to charts with a cartesian Y scale (line, bar) — skip radial types.
         Chart.register({
             id: 'customTooltip',
             beforeDraw: (chart) => {
-                if (chart.tooltip._active && chart.tooltip._active.length) {
-                    const ctx = chart.ctx;
-                    const activePoint = chart.tooltip._active[0];
-                    const x = activePoint.element.x;
-                    const topY = chart.scales.y.top;
-                    const bottomY = chart.scales.y.bottom;
+                if (!chart.tooltip || !chart.tooltip._active || !chart.tooltip._active.length) return;
+                if (!chart.scales.y) return; // no cartesian Y axis (pie/doughnut)
 
-                    ctx.save();
-                    ctx.beginPath();
-                    ctx.setLineDash([5, 5]);
-                    ctx.moveTo(x, topY);
-                    ctx.lineTo(x, bottomY);
-                    ctx.lineWidth = 1;
-                    ctx.strokeStyle = '#665c54'; // bg3
-                    ctx.stroke();
-                    ctx.restore();
-                }
+                const ctx = chart.ctx;
+                const activePoint = chart.tooltip._active[0];
+                const x = activePoint.element.x;
+                const topY = chart.scales.y.top;
+                const bottomY = chart.scales.y.bottom;
+
+                ctx.save();
+                ctx.beginPath();
+                ctx.setLineDash([5, 5]);
+                ctx.moveTo(x, topY);
+                ctx.lineTo(x, bottomY);
+                ctx.lineWidth = 1;
+                ctx.strokeStyle = '#665c54'; // bg3
+                ctx.stroke();
+                ctx.restore();
             }
         });
     }