From 6bf2708c0e226b38efe3a49c02af4a69d5adbfc7 Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Mon, 16 Sep 2024 18:18:32 -0600
Subject: [PATCH] Standardize bar graph y axis (#13772)

* Standardize bar graph y axis

* Fix lint
---
 web/src/components/graph/SystemGraph.tsx | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/web/src/components/graph/SystemGraph.tsx b/web/src/components/graph/SystemGraph.tsx
index 3f5bfead3..098a1957e 100644
--- a/web/src/components/graph/SystemGraph.tsx
+++ b/web/src/components/graph/SystemGraph.tsx
@@ -32,6 +32,16 @@ export function ThresholdBarGraph({
     [data],
   );
 
+  const yMax = useMemo(() => {
+    if (unit != "%") {
+      return undefined;
+    }
+
+    // @ts-expect-error y is valid
+    const yValues: number[] = data[0].data.map((point) => point?.y);
+    return Math.max(threshold.warning, ...yValues);
+  }, [data, threshold, unit]);
+
   const { theme, systemTheme } = useTheme();
 
   const formatTime = useCallback(
@@ -130,9 +140,10 @@ export function ThresholdBarGraph({
           formatter: (val: number) => Math.ceil(val).toString(),
         },
         min: 0,
+        max: yMax,
       },
     } as ApexCharts.ApexOptions;
-  }, [graphId, threshold, unit, systemTheme, theme, formatTime]);
+  }, [graphId, threshold, unit, yMax, systemTheme, theme, formatTime]);
 
   useEffect(() => {
     ApexCharts.exec(graphId, "updateOptions", options, true, true);