From ba0277b71b490fb93021930ea6c3b4b59aaebd66 Mon Sep 17 00:00:00 2001
From: "courtmanr@gmail.com" <courtmanr@gmail.com>
Date: Thu, 1 May 2025 16:28:25 +0100
Subject: [PATCH] fix(ui): Display disk size correctly for VMs and LXCs (fixes
 #71)

Change VM disk display to show only total allocated size (maxdisk) due to API limitations and unreliability of guest usage reporting via /status/current. LXCs continue to show usage bars based on metrics. Adds tooltip to Disk header clarifying the difference.
---
 src/public/app.js     | 32 ++++++++++++++++++++++++++++----
 src/public/index.html |  2 +-
 2 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/src/public/app.js b/src/public/app.js
index 2c3e82957..2c8582c60 100644
--- a/src/public/app.js
+++ b/src/public/app.js
@@ -1368,20 +1368,44 @@ document.addEventListener('DOMContentLoaded', function() {
       if (guest.status === 'running') {
         const cpuPercent = Math.round(guest.cpu * 100);
         const memoryPercent = guest.memory;
-        const diskPercent = guest.disk;
+        // REMOVED: const diskPercent = guest.disk;
 
         // Revert to original calculation using guest.cpus
         const cpuTooltipText = `${cpuPercent}% ${guest.cpus ? `(${(guest.cpu * guest.cpus).toFixed(1)}/${guest.cpus} cores)` : ''}`;
         const memoryTooltipText = guest.memoryTotal ? `${formatBytesInt(guest.memoryCurrent)} / ${formatBytesInt(guest.memoryTotal)} (${memoryPercent}%)` : `${memoryPercent}%`;
-        const diskTooltipText = guest.diskTotal ? `${formatBytesInt(guest.diskCurrent)} / ${formatBytesInt(guest.diskTotal)} (${diskPercent}%)` : `${diskPercent}%`;
+        // REMOVED: const diskTooltipText = guest.diskTotal ? `${formatBytesInt(guest.diskCurrent)} / ${formatBytesInt(guest.diskTotal)} (${diskPercent}%)` : `${diskPercent}%`;
 
         const cpuColorClass = getUsageColor(cpuPercent);
         const memColorClass = getUsageColor(memoryPercent);
-        const diskColorClass = getUsageColor(diskPercent);
+        // REMOVED: const diskColorClass = getUsageColor(diskPercent);
 
         cpuBarHTML = createProgressTextBarHTML(cpuPercent, cpuTooltipText, cpuColorClass);
         memoryBarHTML = createProgressTextBarHTML(memoryPercent, memoryTooltipText, memColorClass);
-        diskBarHTML = createProgressTextBarHTML(diskPercent, diskTooltipText, diskColorClass);
+        // REMOVED: diskBarHTML = createProgressTextBarHTML(diskPercent, diskTooltipText, diskColorClass);
+        
+        // --- NEW Conditional Disk Display ---
+        if (guest.type === 'lxc') { // Assuming type is 'lxc' or 'qemu' (check data structure if needed)
+            const diskPercent = guest.disk; // Use metric disk usage for LXC
+            const diskTooltipText = guest.diskTotal ? `${formatBytesInt(guest.diskCurrent)} / ${formatBytesInt(guest.diskTotal)} (${diskPercent}%)` : `${diskPercent}%`;
+            const diskColorClass = getUsageColor(diskPercent);
+            diskBarHTML = createProgressTextBarHTML(diskPercent, diskTooltipText, diskColorClass);
+        } else if (guest.type === 'VM') { 
+            // --- DEBUG LOGGING --- 
+            if (guest.name && guest.name.toLowerCase().includes('unraid')) { // Log only for specific VM for clarity
+                console.log(`[DEBUG] VM Disk Check (${guest.name}): guest.diskTotal =`, guest.diskTotal);
+            }
+            // --- END DEBUG LOGGING --- 
+            if (guest.diskTotal) { // Check if total disk exists and is non-zero
+                 // For VMs, show only total size without progress bar
+                const totalDiskFormatted = formatBytesInt(guest.diskTotal);
+                diskBarHTML = `<span class=\"text-xs text-gray-700 dark:text-gray-200 truncate\">${totalDiskFormatted}</span>`; 
+            } else {
+                 diskBarHTML = '-'; // Fallback if no total disk reported by API
+            }
+        } else {
+             diskBarHTML = '-'; // Fallback if type unknown
+        }
+        // --- END Conditional Disk Display ---
 
         diskReadFormatted = formatSpeedInt(guest.diskread);
         diskWriteFormatted = formatSpeedInt(guest.diskwrite);
diff --git a/src/public/index.html b/src/public/index.html
index 0ab2a9167..5e7aba99b 100644
--- a/src/public/index.html
+++ b/src/public/index.html
@@ -231,7 +231,7 @@
               <th class="sortable p-1 px-2" data-sort="uptime" style="width: var(--uptime-col-width, 80px);">Uptime</th>
               <th class="sortable p-1 px-2" data-sort="cpu" style="width: 110px;">CPU</th>
               <th class="sortable p-1 px-2" data-sort="memory" style="width: 110px;">Memory</th>
-              <th class="sortable p-1 px-2" data-sort="disk" style="width: 110px;">Disk</th>
+              <th class="sortable p-1 px-2" data-sort="disk" style="width: 110px;" title="Shows usage for LXC; shows total size for VMs due to API limitations.">Disk</th>
               <th class="sortable p-1 px-2 text-right" data-sort="diskread" style="width: 70px;">Read</th>
               <th class="sortable p-1 px-2 text-right" data-sort="diskwrite" style="width: 70px;">Write</th>
               <th class="sortable p-1 px-2 text-right" data-sort="netin" style="width: 70px;">Net In</th>