From a4b5ce4b252aec8820638b39f5525ad63d2896a3 Mon Sep 17 00:00:00 2001
From: rcourtman <courtmanr@gmail.com>
Date: Fri, 19 Dec 2025 23:57:48 +0000
Subject: [PATCH] fix: Add disk tooltip to Proxmox node overview. Related to
 #862

---
 .../components/shared/NodeSummaryTable.tsx    | 35 ++++++++++++++-----
 1 file changed, 27 insertions(+), 8 deletions(-)

diff --git a/frontend-modern/src/components/shared/NodeSummaryTable.tsx b/frontend-modern/src/components/shared/NodeSummaryTable.tsx
index b96e53e..4206baf 100644
--- a/frontend-modern/src/components/shared/NodeSummaryTable.tsx
+++ b/frontend-modern/src/components/shared/NodeSummaryTable.tsx
@@ -12,6 +12,7 @@ import { StatusDot } from '@/components/shared/StatusDot';
 import { getNodeStatusIndicator, getPBSStatusIndicator } from '@/utils/status';
 import { ResponsiveMetricCell, MetricText } from '@/components/shared/responsive';
 import { StackedMemoryBar } from '@/components/Dashboard/StackedMemoryBar';
+import { StackedDiskBar } from '@/components/Dashboard/StackedDiskBar';
 import { EnhancedCPUBar } from '@/components/Dashboard/EnhancedCPUBar';
 import { TemperatureGauge } from '@/components/shared/TemperatureGauge';
 import { useBreakpoint } from '@/hooks/useBreakpoint';
@@ -636,14 +637,32 @@ export const NodeSummaryTable: Component<NodeSummaryTableProps> = (props) => {
 
                     {/* Disk */}
                     <td class={tdClass} style={metricColumnStyle}>
-                      <ResponsiveMetricCell
-                        value={diskPercentValue}
-                        type="disk"
-                        resourceId={metricsKey}
-                        sublabel={diskSublabel}
-                        isRunning={online}
-                        showMobile={isMobile()}
-                      />
+                      <Show when={isMobile()}>
+                        <div class="md:hidden h-4 flex items-center justify-center">
+                          <MetricText value={diskPercentValue} type="disk" />
+                        </div>
+                      </Show>
+                      <div class="hidden md:block h-4">
+                        <Show when={isPVEItem} fallback={
+                          <ResponsiveMetricCell
+                            value={diskPercentValue}
+                            type="disk"
+                            resourceId={metricsKey}
+                            sublabel={diskSublabel}
+                            isRunning={online}
+                            showMobile={false}
+                          />
+                        }>
+                          <StackedDiskBar
+                            aggregateDisk={{
+                              total: node!.disk?.total || 0,
+                              used: node!.disk?.used || 0,
+                              free: (node!.disk?.total || 0) - (node!.disk?.used || 0),
+                              usage: node!.disk?.total ? (node!.disk.used / node!.disk.total) : 0
+                            }}
+                          />
+                        </Show>
+                      </div>
                     </td>
 
                     {/* Temperature */}