Fix unnecessary API queries to unreachable servers flooding console

frontend/src/components/resources/server/index.tsx

@@ -43,6 +43,12 @@ export const useServer = (id?: string) =>
   useRead("ListServers", {}, { refetchInterval: 10_000 }).data?.find(
     (d) => d.id === id
   );
+
+// Helper function to check if server is available for API calls
+export const useIsServerAvailable = (serverId?: string) => {
+  const server = useServer(serverId);
+   return server?.info.state === Types.ServerState.Ok;
+};
 
 export const useFullServer = (id: string) =>
   useRead("GetServer", { server: id }, { refetchInterval: 10_000 }).data;
@@ -384,13 +390,13 @@ export const ServerComponents: RequiredResourceComponents = {
   Info: {
     Version: ServerVersion,
     Cpu: ({ id }) => {
-      const server = useServer(id);
+      const isServerAvailable = useIsServerAvailable(id);
       const core_count =
         useRead(
           "GetSystemInformation",
           { server: id },
           {
-            enabled: server ? server.info.state !== "Disabled" : false,
+            enabled: isServerAvailable,
             refetchInterval: 5000,
           }
         ).data?.core_count ?? 0;
@@ -402,12 +408,12 @@ export const ServerComponents: RequiredResourceComponents = {
       );
     },
     LoadAvg: ({ id }) => {
-      const server = useServer(id);
+      const isServerAvailable = useIsServerAvailable(id);
       const stats = useRead(
         "GetSystemStats",
         { server: id },
         {
-          enabled: server ? server.info.state !== "Disabled" : false,
+          enabled: isServerAvailable,
           refetchInterval: 5000,
         }
       ).data;
@@ -423,12 +429,12 @@ export const ServerComponents: RequiredResourceComponents = {
       );
     },
     Mem: ({ id }) => {
-      const server = useServer(id);
+      const isServerAvailable = useIsServerAvailable(id);
       const stats = useRead(
         "GetSystemStats",
         { server: id },
         {
-          enabled: server ? server.info.state !== "Disabled" : false,
+          enabled: isServerAvailable,
           refetchInterval: 5000,
         }
       ).data;
@@ -440,12 +446,12 @@ export const ServerComponents: RequiredResourceComponents = {
       );
     },
     Disk: ({ id }) => {
-      const server = useServer(id);
+      const isServerAvailable = useIsServerAvailable(id);
       const stats = useRead(
         "GetSystemStats",
         { server: id },
         {
-          enabled: server ? server.info.state !== "Disabled" : false,
+          enabled: isServerAvailable,
           refetchInterval: 5000,
         }
       ).data;

frontend/src/components/resources/server/monitoring-table.tsx

@@ -3,6 +3,7 @@ import { ServerComponents } from "@components/resources/server";
 import { DataTable, SortableHeader } from "@ui/data-table";
 import { useRead } from "@lib/hooks";
 import { useMemo } from "react";
+import { useIsServerAvailable } from ".";
 
 export const ServerMonitoringTable = ({ search = "" }: { search?: string }) => {
   const servers = useRead("ListServers", {}).data;
@@ -73,11 +74,19 @@ export const ServerMonitoringTable = ({ search = "" }: { search?: string }) => {
   );
 };
 
-const useStats = (id: string) =>
-  useRead("GetSystemStats", { server: id }, { refetchInterval: 10_000 }).data;
+const useStats = (id: string) => {
+  const isServerAvailable = useIsServerAvailable(id);
+  return useRead("GetSystemStats", { server: id }, { 
+    enabled: isServerAvailable,
+    refetchInterval: 10_000 
+  }).data;
+};
 
 const useServerThresholds = (id: string) => {
-  const config = useRead("GetServer", { server: id }).data?.config as any;
+  const isServerAvailable = useIsServerAvailable(id);
+  const config = useRead("GetServer", { server: id }, {
+    enabled: isServerAvailable
+  }).data?.config as any;
   return {
     cpuWarning: config?.cpu_warning ?? 75,
     cpuCritical: config?.cpu_critical ?? 90,

frontend/src/components/resources/server/stats.tsx

@@ -18,6 +18,7 @@ import {
 } from "@ui/select";
 import { DockerResourceLink, ShowHideButton } from "@components/util";
 import { filterBySplit } from "@lib/utils";
+import { useIsServerAvailable } from ".";
 
 export const ServerStats = ({
   id,
@@ -29,17 +30,23 @@ export const ServerStats = ({
   const [interval, setInterval] = useStatsGranularity();
 
   const { specific } = usePermissions({ type: "Server", id });
+  const isServerAvailable = useIsServerAvailable(id);
 
   const stats = useRead(
     "GetSystemStats",
     { server: id },
-    { refetchInterval: 10_000 }
+    { 
+      enabled: isServerAvailable,
+      refetchInterval: 10_000 
+    }
   ).data;
-  const info = useRead("GetSystemInformation", { server: id }).data;
+  const info = useRead("GetSystemInformation", { server: id }, { enabled: isServerAvailable }).data;
 
   // Get all the containers with stats
   const containers = useRead("ListDockerContainers", {
     server: id,
+  }, {
+    enabled: isServerAvailable
   }).data?.filter((c) => c.stats);
   const [showContainers, setShowContainers] = useLocalStorage(
     "stats-show-container-table-v1",
@@ -504,8 +511,8 @@ const LOAD_AVERAGE = ({
 }) => {
   if (!stats?.load_average) return null;
   const { one = 0, five = 0, fifteen = 0 } = stats.load_average || {};
-  const cores = useRead("GetSystemInformation", { server: id }).data
-    ?.core_count;
+  const isServerAvailable = useIsServerAvailable(id);
+  const cores = useRead("GetSystemInformation", { server: id }, { enabled: isServerAvailable }).data?.core_count;
 
   const pct = (load: number) =>
     cores && cores > 0 ? Math.min((load / cores) * 100, 100) : undefined;