From 5dfc5f247f5aa40e28bf791c4bd1642b4767e36c Mon Sep 17 00:00:00 2001
From: henrygd <hank@henrygd.me>
Date: Sun, 30 Nov 2025 12:32:16 -0500
Subject: [PATCH] update extra disk indicators in systems table to display max
 3 states

---
 .../systems-table/systems-table-columns.tsx         | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/internal/site/src/components/systems-table/systems-table-columns.tsx b/internal/site/src/components/systems-table/systems-table-columns.tsx
index e9438418..641ebd19 100644
--- a/internal/site/src/components/systems-table/systems-table-columns.tsx
+++ b/internal/site/src/components/systems-table/systems-table-columns.tsx
@@ -422,6 +422,13 @@ function DiskCellWithMultiple(info: CellContext<SystemRecord, unknown>) {
 		return cn("h-full", getIndicatorColor(pct))
 	}
 
+	// Extra disk indicators (max 3 dots - one per state if any disk exists in range)
+	const stateColors = [STATUS_COLORS.up, STATUS_COLORS.pending, STATUS_COLORS.down]
+	const extraDiskIndicators =
+		status !== SystemStatus.Up
+			? []
+			: [...new Set(extraFs.map(([, pct]) => getMeterState(pct)))].sort().map((state) => stateColors[state])
+
 	return (
 		<Tooltip>
 			<TooltipTrigger asChild>
@@ -439,10 +446,10 @@ function DiskCellWithMultiple(info: CellContext<SystemRecord, unknown>) {
 								style={{ width: `${rootDiskPct}%` }}
 							></span>
 							{/* Extra disk indicators */}
-							{extraFs.map(([name, pct]) => (
+							{extraDiskIndicators.map((color) => (
 								<span
-									key={name}
-									className={cn("size-1.5 rounded-full shrink-0 outline-[0.5px] outline-muted", getIndicatorColor(pct))}
+									key={color}
+									className={cn("size-1.5 rounded-full shrink-0 outline-[0.5px] outline-muted", color)}
 								/>
 							))}
 						</span>