From f02c5e5cd081ce4e839eeddb6fe9ebaeb5b90dcc Mon Sep 17 00:00:00 2001
From: Chris Sherwood <chris@crosstalksolutions.com>
Date: Tue, 10 Feb 2026 10:11:51 -0800
Subject: [PATCH] fix(System): use available memory for usage calculation

mem.used on Linux includes reclaimable buff/cache, which caused the
System Information page to show 97% memory usage on a 64GB machine
that actually had 53GB available. The warning banner fired at >90%
creating a false alarm.

Now uses (total - available) for the gauge, percentage, and displayed
values. Also renames "Free RAM" to "Available RAM" using mem.available
instead of mem.free, since free is misleadingly small on Linux (it
excludes reclaimable cache).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 admin/inertia/pages/settings/system.tsx | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/admin/inertia/pages/settings/system.tsx b/admin/inertia/pages/settings/system.tsx
index 83309d6..f0aaf97 100644
--- a/admin/inertia/pages/settings/system.tsx
+++ b/admin/inertia/pages/settings/system.tsx
@@ -17,8 +17,13 @@ export default function SettingsPage(props: {
     initialData: props.system.info,
   })
 
+  // Use (total - available) to reflect actual memory pressure.
+  // mem.used includes reclaimable buff/cache on Linux, which inflates the number.
+  const memoryUsed = info?.mem.total && info?.mem.available != null
+    ? info.mem.total - info.mem.available
+    : info?.mem.used || 0
   const memoryUsagePercent = info?.mem.total
-    ? ((info.mem.used / info.mem.total) * 100).toFixed(1)
+    ? ((memoryUsed / info.mem.total) * 100).toFixed(1)
     : 0
 
   const swapUsagePercent = info?.mem.swaptotal
@@ -118,7 +123,7 @@ export default function SettingsPage(props: {
                   label="Memory Usage"
                   size="lg"
                   variant="memory"
-                  subtext={`${formatBytes(info?.mem.used || 0)} / ${formatBytes(info?.mem.total || 0)}`}
+                  subtext={`${formatBytes(memoryUsed)} / ${formatBytes(info?.mem.total || 0)}`}
                   icon={<IconDatabase className="w-8 h-8" />}
                 />
               </div>
@@ -202,7 +207,7 @@ export default function SettingsPage(props: {
                 </div>
                 <div className="text-center">
                   <div className="text-3xl font-bold text-desert-green mb-1">
-                    {formatBytes(info?.mem.used || 0)}
+                    {formatBytes(memoryUsed)}
                   </div>
                   <div className="text-sm text-desert-stone-dark uppercase tracking-wide">
                     Used RAM
@@ -210,10 +215,10 @@ export default function SettingsPage(props: {
                 </div>
                 <div className="text-center">
                   <div className="text-3xl font-bold text-desert-green mb-1">
-                    {formatBytes(info?.mem.free || 0)}
+                    {formatBytes(info?.mem.available || 0)}
                   </div>
                   <div className="text-sm text-desert-stone-dark uppercase tracking-wide">
-                    Free RAM
+                    Available RAM
                   </div>
                 </div>
               </div>