fix(providers): auto-poll and refresh button so local provider models appear without a full reload

When Hecate starts before Ollama / LM Studio the first discovery attempt
fails (connection refused), caches that failure for 30 s, and the UI
has no way to pick up the result once the local server comes up — the
dashboard only loads once on page open.

Two fixes:
- ProvidersView mounts a 30 s setInterval that calls a new lightweight
  refreshProviders action (/admin/providers + /v1/models only, not the
  full loadDashboard). Models appear automatically within one poll cycle
  after the local server starts, matching the backend's
  capabilitiesLocalFailureTTL.
- A "Refresh" button in the providers header lets the operator trigger
  an immediate re-discovery without navigating away. The button shows
  "Refreshing…" and is disabled while the fetch is in flight.

Author: chicoxyzzy

ui/src/app/useRuntimeConsole.ts

@@ -385,6 +385,24 @@ export function useRuntimeConsole() {
     }
   }
 
+  // refreshProviders re-fetches only /admin/providers and /v1/models without
+  // the full loadDashboard cost. Used by the ProvidersView auto-poll so local
+  // provider model lists converge within ~30 s of starting Ollama / LM Studio,
+  // regardless of when Hecate itself was started.
+  async function refreshProviders() {
+    if (!session.isAdmin || !authToken) return;
+    try {
+      const [pResult, mResult] = await Promise.allSettled([
+        getProviders(authToken),
+        getModels(authToken),
+      ]);
+      if (pResult.status === "fulfilled") setProviders(pResult.value.data ?? []);
+      if (mResult.status === "fulfilled") setModels(mResult.value.data ?? []);
+    } catch {
+      // Best-effort background refresh — ignore errors.
+    }
+  }
+
   function buildChatPayload(messages: ChatMessage[], sessionID?: string) {
     return {
       model,
@@ -1172,6 +1190,7 @@ export function useRuntimeConsole() {
       setModelFilter,
       setProviderFilter: selectProviderRoute,
       setProviderEnabled,
+      refreshProviders,
       setRetentionSubsystems,
       setRotateAPIKeyID,
       setRotateAPIKeySecret,

ui/src/features/providers/ProvidersView.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import type { RuntimeConsoleViewModel } from "../../app/useRuntimeConsole";
 import { buildConflictMap, providerDotColor, resolvedBaseURL } from "../../lib/provider-utils";
 import { describeCredentialState, describeHealthErrorClass, describeRoutingBlockedReason } from "../../lib/runtime-utils";
@@ -35,10 +35,25 @@ function iconColorByID(id: string): string {
   return PRESET_COLORS[id.toLowerCase()] ?? "var(--teal)";
 }
 
+// Interval for background provider discovery refresh (ms). Matches the backend's
+// local-failure TTL (30 s) so a freshly-started Ollama / LM Studio server will
+// surface its models within one poll cycle.
+const PROVIDER_POLL_INTERVAL_MS = 30_000;
+
 export function ProvidersView({ state, actions }: Props) {
   const [selectedID, setSelectedID] = useState<string | null>(null);
   const [pendingKey, setPendingKey] = useState("");
   const [pendingToggles, setPendingToggles] = useState<Map<string, boolean>>(new Map());
+  const [refreshing, setRefreshing] = useState(false);
+
+  // Auto-poll while the providers tab is visible so local inference servers
+  // that start after Hecate appear automatically without a full page reload.
+  useEffect(() => {
+    const id = setInterval(() => {
+      void actions.refreshProviders();
+    }, PROVIDER_POLL_INTERVAL_MS);
+    return () => clearInterval(id);
+  }, [actions.refreshProviders]);
 
   const configuredProviders = state.adminConfig?.providers ?? [];
   const healthyNames = new Set(state.providers.filter(p => p.healthy).map(p => p.name));
@@ -242,11 +257,23 @@ export function ProvidersView({ state, actions }: Props) {
     <div style={{ display: "flex", height: "100%", overflow: "hidden" }}>
       {/* Provider list */}
       <div style={{ flex: 1, overflowY: "auto", padding: 16 }}>
-        <div style={{ display: "flex", flexWrap: "wrap", gap: 8, marginBottom: 16 }}>
+        <div style={{ display: "flex", flexWrap: "wrap", gap: 8, marginBottom: 16, alignItems: "center" }}>
           <Badge status="ok" label={`${readyCount} route ready`} />
           <Badge status={blockedCount > 0 ? "warn" : "ok"} label={`${blockedCount} blocked`} />
           <Badge status={unhealthyCount > 0 ? "error" : "ok"} label={`${unhealthyCount} unhealthy`} />
           <Badge status={misconfiguredCount > 0 ? "warn" : "ok"} label={`${misconfiguredCount} missing credentials`} />
+          <button
+            className="btn btn-ghost btn-sm"
+            style={{ marginLeft: "auto", display: "flex", alignItems: "center", gap: 4, opacity: refreshing ? 0.5 : 1 }}
+            disabled={refreshing}
+            title="Re-discover models from all local providers"
+            onClick={() => {
+              setRefreshing(true);
+              void actions.refreshProviders().finally(() => setRefreshing(false));
+            }}>
+            <Icon d={Icons.refresh} size={12} />
+            {refreshing ? "Refreshing…" : "Refresh"}
+          </button>
         </div>
         {renderSection(
           "Cloud providers",

ui/src/test/runtime-console-fixture.ts

@@ -116,6 +116,7 @@ export function createRuntimeConsoleActions(): RuntimeConsoleViewModel["actions"
     setModelFilter: () => undefined,
     setProviderFilter: () => undefined,
     setProviderEnabled: async () => undefined,
+    refreshProviders: async () => undefined,
     setRetentionSubsystems: () => undefined,
     setRotateAPIKeyID: () => undefined,
     setRotateAPIKeySecret: () => undefined,