@tonyclaw/llm-inspector 1.7.0 → 1.7.2

package/.output/server/_ssr/{router-Bq_mxeNz.mjs → router-D7g2K6y6.mjs}

@@ -65,7 +65,7 @@ function RootDocument({ children }) {
     ] })
   ] });
 }
-const $$splitComponentImporter = () => import("./index-ByCLZu7J.mjs");
+const $$splitComponentImporter = () => import("./index-BZkxgx8f.mjs");
 const Route$d = createFileRoute("/")({
   component: lazyRouteComponent($$splitComponentImporter, "component")
 });
@@ -2074,6 +2074,77 @@ const Route$3 = createFileRoute("/api/config/paths")({
     }
   }
 });
+const ERROR_HINTS = {
+  timeout: "The request took too long. Check your network connection or try again.",
+  network_unreachable: "Cannot reach the server. Verify the base URL and check your firewall settings.",
+  connection_refused: "Connection was refused. Make sure the provider server is running and the URL is correct.",
+  auth_failed: "Authentication failed. Check your API key is correct and has not expired.",
+  rate_limited: "Too many requests. Wait a moment and try again, or check your API quota.",
+  server_error: "The provider server encountered an error. Check their status page and try again later.",
+  invalid_response: "Received an unexpected response. The provider may be experiencing issues.",
+  unknown: "An unexpected error occurred. Check the details and try again."
+};
+const MAX_ERROR_DETAILS_LENGTH = 200;
+function classifyError(error, responseStatus) {
+  const errorStr = String(error);
+  if (error instanceof Error && error.name === "AbortError") {
+    return { type: "timeout", details: "Request was aborted due to timeout" };
+  }
+  if (errorStr.includes("timeout") || errorStr.includes("timed out") || errorStr.includes("Timeout")) {
+    return { type: "timeout", details: truncateErrorDetails(errorStr) };
+  }
+  if (errorStr.includes("ECONNREFUSED") || errorStr.includes("connection refused")) {
+    return { type: "connection_refused", details: truncateErrorDetails(errorStr) };
+  }
+  if (errorStr.includes("ENOTFOUND") || errorStr.includes("getaddrinfo") || errorStr.includes("DNS") || errorStr.includes("network") || errorStr.includes("fetch failed")) {
+    return { type: "network_unreachable", details: truncateErrorDetails(errorStr) };
+  }
+  if (responseStatus !== void 0) {
+    if (responseStatus === 401 || responseStatus === 403) {
+      return { type: "auth_failed", details: `HTTP ${responseStatus}` };
+    }
+    if (responseStatus === 429) {
+      return { type: "rate_limited", details: `HTTP ${responseStatus}` };
+    }
+    if (responseStatus >= 500 && responseStatus < 600) {
+      return { type: "server_error", details: `HTTP ${responseStatus}` };
+    }
+  }
+  return { type: "unknown", details: truncateErrorDetails(errorStr) };
+}
+function truncateErrorDetails(details) {
+  if (details.length <= MAX_ERROR_DETAILS_LENGTH) {
+    return details;
+  }
+  return details.slice(0, MAX_ERROR_DETAILS_LENGTH) + "...";
+}
+function createErrorResult(error, latencyMs, streaming, responseStatus) {
+  const { type, details } = classifyError(error, responseStatus);
+  return {
+    success: false,
+    error: {
+      message: getErrorMessage(type),
+      type,
+      details,
+      hint: ERROR_HINTS[type]
+    },
+    latencyMs,
+    streaming
+  };
+}
+function getErrorMessage(type) {
+  const messages = {
+    timeout: "Request timed out",
+    network_unreachable: "Cannot reach host",
+    connection_refused: "Connection refused",
+    auth_failed: "Authentication failed",
+    rate_limited: "Rate limited",
+    server_error: "Provider server error",
+    invalid_response: "Invalid response",
+    unknown: "Unknown error"
+  };
+  return messages[type];
+}
 const AnthropicResponseSchema = object({
   id: string().optional(),
   type: string().optional(),
@@ -2106,6 +2177,7 @@ const OpenAIResponseSchema = object({
     })
   )
 });
+const TEST_TIMEOUT_MS = 3e4;
 async function testEndpoint(baseUrl, apiKey, path2, model, isOpenAI) {
   const startTime = Date.now();
   const body = JSON.stringify({
@@ -2113,6 +2185,8 @@ async function testEndpoint(baseUrl, apiKey, path2, model, isOpenAI) {
     messages: [{ role: "user", content: "say hello and briefly introduce yourself" }],
     max_tokens: 1024
   });
+  const controller = new AbortController();
+  const timeoutId = setTimeout(() => controller.abort(), TEST_TIMEOUT_MS);
   try {
     const url = `${baseUrl}${path2}`;
     const response = await fetch(url, {
@@ -2121,17 +2195,20 @@ async function testEndpoint(baseUrl, apiKey, path2, model, isOpenAI) {
         "Content-Type": "application/json",
         Authorization: `Bearer ${apiKey}`
       },
-      body
+      body,
+      signal: controller.signal
     });
+    clearTimeout(timeoutId);
     const latencyMs = Date.now() - startTime;
-    const responseText = await response.text();
     if (!response.ok) {
-      return {
-        success: false,
-        error: `HTTP ${response.status}: ${responseText.slice(0, 200)}`,
-        latencyMs
-      };
+      return createErrorResult(
+        `HTTP ${response.status}: ${response.statusText}`,
+        latencyMs,
+        false,
+        response.status
+      );
     }
+    const responseText = await response.text();
     try {
       if (isOpenAI) {
         const json = OpenAIResponseSchema.parse(JSON.parse(responseText));
@@ -2181,11 +2258,8 @@ async function testEndpoint(baseUrl, apiKey, path2, model, isOpenAI) {
       };
     }
   } catch (err) {
-    return {
-      success: false,
-      error: String(err),
-      latencyMs: Date.now() - startTime
-    };
+    clearTimeout(timeoutId);
+    return createErrorResult(err, Date.now() - startTime, false);
   }
 }
 async function testStreamingEndpoint(baseUrl, apiKey, path2, model, isOpenAI) {
@@ -2196,6 +2270,8 @@ async function testStreamingEndpoint(baseUrl, apiKey, path2, model, isOpenAI) {
     max_tokens: 256,
     stream: true
   });
+  const controller = new AbortController();
+  const timeoutId = setTimeout(() => controller.abort(), TEST_TIMEOUT_MS);
   try {
     const url = `${baseUrl}${path2}`;
     const response = await fetch(url, {
@@ -2204,24 +2280,29 @@ async function testStreamingEndpoint(baseUrl, apiKey, path2, model, isOpenAI) {
         "Content-Type": "application/json",
         Authorization: `Bearer ${apiKey}`
       },
-      body
+      body,
+      signal: controller.signal
     });
+    clearTimeout(timeoutId);
     const latencyMs = Date.now() - startTime;
     if (!response.ok) {
-      const responseText = await response.text();
-      return {
-        success: false,
-        error: `HTTP ${response.status}: ${responseText.slice(0, 200)}`,
+      return createErrorResult(
+        `HTTP ${response.status}: ${response.statusText}`,
         latencyMs,
-        streaming: true
-      };
+        true,
+        response.status
+      );
     }
     const chunks = [];
     const reader = response.body?.getReader();
     if (!reader) {
       return {
         success: false,
-        error: "No response body",
+        error: {
+          message: "No response body",
+          type: "invalid_response",
+          hint: ERROR_HINTS.invalid_response
+        },
         latencyMs,
         streaming: true
       };
@@ -2234,12 +2315,7 @@ async function testStreamingEndpoint(baseUrl, apiKey, path2, model, isOpenAI) {
         chunks.push(decoder.decode(value, { stream: true }));
       }
     } catch (readErr) {
-      return {
-        success: false,
-        error: `Stream read error: ${readErr}`,
-        latencyMs,
-        streaming: true
-      };
+      return createErrorResult(`Stream read error: ${readErr}`, latencyMs, true);
     }
     const fullResponse = chunks.join("");
     const mockLog = {
@@ -2320,12 +2396,8 @@ async function testStreamingEndpoint(baseUrl, apiKey, path2, model, isOpenAI) {
       };
     }
   } catch (err) {
-    return {
-      success: false,
-      error: String(err),
-      latencyMs: Date.now() - startTime,
-      streaming: true
-    };
+    clearTimeout(timeoutId);
+    return createErrorResult(err, Date.now() - startTime, true);
   }
 }
 function createTestLogEntry(providerName, path2, body, upstreamUrl, result, isTest) {
@@ -2346,7 +2418,7 @@ function createTestLogEntry(providerName, path2, body, upstreamUrl, result, isTe
     userAgent: "provider-test",
     origin: null,
     upstreamUrl,
-    error: result.success ? null : result.error,
+    error: result.success ? null : result.error?.message ?? String(result.error),
     isTest: true,
     providerName
   };

package/.output/server/{_tanstack-start-manifest_v-C4E0e9my.mjs → _tanstack-start-manifest_v-b6u6g-Cr.mjs}

@@ -1,4 +1,4 @@
-const tsrStartManifest = () => ({ "routes": { "__root__": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/__root.tsx", "children": ["/", "/api/health", "/api/logs", "/api/models", "/api/providers", "/api/sessions", "/proxy/$", "/api/config/paths"], "preloads": ["/assets/main-Cp8AM0Pa.js"], "assets": [] }, "/": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/index.tsx", "assets": [], "preloads": ["/assets/index-s4lwsWvq.js"] }, "/api/health": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/health.ts" }, "/api/logs": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/logs.ts", "children": ["/api/logs/$id", "/api/logs/stream"] }, "/api/models": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/models.ts" }, "/api/providers": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/providers.ts", "children": ["/api/providers/$providerId"] }, "/api/sessions": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/sessions.ts" }, "/proxy/$": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/proxy/$.ts" }, "/api/config/paths": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/config.paths.ts" }, "/api/logs/$id": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/logs.$id.ts", "children": ["/api/logs/$id/chunks", "/api/logs/$id/replay"] }, "/api/logs/stream": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/logs.stream.ts" }, "/api/providers/$providerId": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/providers.$providerId.ts", "children": ["/api/providers/$providerId/test"] }, "/api/logs/$id/chunks": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/logs.$id.chunks.ts" }, "/api/logs/$id/replay": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/logs.$id.replay.ts" }, "/api/providers/$providerId/test": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/providers.$providerId.test.ts" } }, "clientEntry": "/assets/main-Cp8AM0Pa.js" });
+const tsrStartManifest = () => ({ "routes": { "__root__": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/__root.tsx", "children": ["/", "/api/health", "/api/logs", "/api/models", "/api/providers", "/api/sessions", "/proxy/$", "/api/config/paths"], "preloads": ["/assets/main-CpIX1ZHy.js"], "assets": [] }, "/": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/index.tsx", "assets": [], "preloads": ["/assets/index-Bf_WGooQ.js"] }, "/api/health": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/health.ts" }, "/api/logs": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/logs.ts", "children": ["/api/logs/$id", "/api/logs/stream"] }, "/api/models": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/models.ts" }, "/api/providers": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/providers.ts", "children": ["/api/providers/$providerId"] }, "/api/sessions": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/sessions.ts" }, "/proxy/$": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/proxy/$.ts" }, "/api/config/paths": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/config.paths.ts" }, "/api/logs/$id": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/logs.$id.ts", "children": ["/api/logs/$id/chunks", "/api/logs/$id/replay"] }, "/api/logs/stream": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/logs.stream.ts" }, "/api/providers/$providerId": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/providers.$providerId.ts", "children": ["/api/providers/$providerId/test"] }, "/api/logs/$id/chunks": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/logs.$id.chunks.ts" }, "/api/logs/$id/replay": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/logs.$id.replay.ts" }, "/api/providers/$providerId/test": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/providers.$providerId.test.ts" } }, "clientEntry": "/assets/main-CpIX1ZHy.js" });
 export {
   tsrStartManifest
 };

package/.output/server/index.mjs

@@ -100,51 +100,51 @@ const assets = {
   "/assets/alibaba-TTwafVwX.svg": {
     "type": "image/svg+xml",
     "etag": '"171b-6dyV5K8QjiaY35sN9qNprh9zDIs"',
-    "mtime": "2026-06-03T08:20:44.008Z",
+    "mtime": "2026-06-03T09:30:18.865Z",
     "size": 5915,
     "path": "../public/assets/alibaba-TTwafVwX.svg"
   },
   "/assets/index-B3RwBPLW.css": {
     "type": "text/css; charset=utf-8",
     "etag": '"10c74-aXacU4DRFVsUwcC5jHnjoPRSlTA"',
-    "mtime": "2026-06-03T08:20:44.011Z",
+    "mtime": "2026-06-03T09:30:18.865Z",
     "size": 68724,
     "path": "../public/assets/index-B3RwBPLW.css"
   },
   "/assets/minimax-BPMzvuL-.jpeg": {
     "type": "image/jpeg",
     "etag": '"1b06-IwivU89ko5UTMUM1/t7hn4sQK9A"',
-    "mtime": "2026-06-03T08:20:44.010Z",
+    "mtime": "2026-06-03T09:30:18.865Z",
     "size": 6918,
     "path": "../public/assets/minimax-BPMzvuL-.jpeg"
   },
   "/assets/zhipuai-BPNAnxo-.svg": {
     "type": "image/svg+xml",
     "etag": '"2bf8-hNaLCTi89nOFCsIIfWpP/jrfo0s"',
-    "mtime": "2026-06-03T08:20:44.010Z",
+    "mtime": "2026-06-03T09:30:18.862Z",
     "size": 11256,
     "path": "../public/assets/zhipuai-BPNAnxo-.svg"
   },
-  "/assets/main-Cp8AM0Pa.js": {
+  "/assets/main-CpIX1ZHy.js": {
     "type": "text/javascript; charset=utf-8",
-    "etag": '"4db57-FpqlPRLq9OHoaAFCL2NIXtZbW5c"',
-    "mtime": "2026-06-03T08:20:44.011Z",
+    "etag": '"4db57-PIyiLXQGvlFJuizUFXRhGOYXJwY"',
+    "mtime": "2026-06-03T09:30:18.865Z",
     "size": 318295,
-    "path": "../public/assets/main-Cp8AM0Pa.js"
+    "path": "../public/assets/main-CpIX1ZHy.js"
   },
   "/assets/qwen-CONDcHqt.png": {
     "type": "image/png",
     "etag": '"572c3-cdJAPaHdOvFCGzuaQjagdgOu6XE"',
-    "mtime": "2026-06-03T08:20:44.010Z",
+    "mtime": "2026-06-03T09:30:18.865Z",
     "size": 357059,
     "path": "../public/assets/qwen-CONDcHqt.png"
   },
-  "/assets/index-s4lwsWvq.js": {
+  "/assets/index-Bf_WGooQ.js": {
     "type": "text/javascript; charset=utf-8",
-    "etag": '"828c8-LEW/XL92J2/5lU4VKALlH7aVpaA"',
-    "mtime": "2026-06-03T08:20:44.011Z",
-    "size": 534728,
-    "path": "../public/assets/index-s4lwsWvq.js"
+    "etag": '"831df-gmdpd1CCnM4IdaxHIs9uyMgWFaY"',
+    "mtime": "2026-06-03T09:30:18.865Z",
+    "size": 537055,
+    "path": "../public/assets/index-Bf_WGooQ.js"
   }
 };
 function readAsset(id) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tonyclaw/llm-inspector",
-  "version": "1.7.0",
+  "version": "1.7.2",
   "type": "module",
   "description": "LLM API proxy inspector — captures and displays requests/responses from AI coding tools in a web UI",
   "license": "MIT",

package/src/cli.ts

@@ -1,7 +1,8 @@
 #!/usr/bin/env node
-import { spawn } from "node:child_process";
+import { spawn, execSync } from "node:child_process";
 import { fileURLToPath } from "node:url";
 import { dirname, join } from "node:path";
+import { existsSync } from "node:fs";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
@@ -35,8 +36,78 @@ for (let i = 0; i < args.length; i++) {
   }
 }
 
+/**
+ * Check if a port is in use and kill the process using it
+ */
+function killProcessOnPort(targetPort: number): void {
+  const platform = process.platform;
+
+  try {
+    let pids: number[] = [];
+
+    if (platform === "win32") {
+      // Windows: use netstat to find PID, then taskkill
+      const output = execSync(`netstat -ano | findstr :${targetPort}`, {
+        encoding: "utf8",
+        timeout: 5000,
+      });
+      const lines = output.trim().split("\n");
+      for (const line of lines) {
+        const parts = line.trim().split(/\s+/);
+        if (parts.length >= 5) {
+          const localAddress = parts[1] ?? "";
+          const pidStr = parts[4] ?? "";
+          if (localAddress !== "" && pidStr !== "" && localAddress.includes(`:${targetPort}`)) {
+            const pid = parseInt(pidStr, 10);
+            if (!isNaN(pid) && pid > 0) {
+              pids.push(pid);
+            }
+          }
+        }
+      }
+      // Remove duplicates
+      pids = [...new Set(pids)];
+
+      for (const pid of pids) {
+        try {
+          console.log(`Killing process ${pid} on port ${port}...`);
+          execSync(`taskkill /PID ${pid} /F`, { encoding: "utf8", timeout: 5000 });
+        } catch {
+          // Process may have already exited
+        }
+      }
+    } else {
+      // Unix-like: use lsof
+      const output = execSync(`lsof -ti:${targetPort}`, { encoding: "utf8", timeout: 5000 });
+      const lines = output.trim().split("\n");
+      for (const line of lines) {
+        const pid = parseInt(line.trim(), 10);
+        if (!isNaN(pid) && pid > 0) {
+          pids.push(pid);
+        }
+      }
+      // Remove duplicates
+      pids = [...new Set(pids)];
+
+      for (const pid of pids) {
+        try {
+          console.log(`Killing process ${pid} on port ${targetPort}...`);
+          execSync(`kill -9 ${pid}`, { encoding: "utf8", timeout: 5000 });
+        } catch {
+          // Process may have already exited
+        }
+      }
+    }
+  } catch {
+    // No process found on port, which is fine
+  }
+}
+
 process.env["PORT"] = String(port);
 
+// Kill any existing process on the port
+killProcessOnPort(port);
+
 const url = `http://localhost:${port}`;
 
 console.log(`Server running at ${url}`);

package/src/components/providers/ProviderCard.tsx

@@ -10,6 +10,14 @@ import {
   XCircle,
   Minus,
   ExternalLink,
+  AlertCircle,
+  Wifi,
+  WifiOff,
+  Lock,
+  Gauge,
+  Server,
+  HelpCircle,
+  Clock,
 } from "lucide-react";
 import type { ProviderConfig } from "../../proxy/providers";
 
@@ -18,9 +26,26 @@ const KNOWN_PROVIDER_DOCS: Record<string, string> = {
   deepseek: "https://api-docs.deepseek.com/zh-cn/",
 };
 
+type ErrorType =
+  | "timeout"
+  | "network_unreachable"
+  | "connection_refused"
+  | "auth_failed"
+  | "rate_limited"
+  | "server_error"
+  | "invalid_response"
+  | "unknown";
+
+type EnhancedError = {
+  message: string;
+  type: ErrorType;
+  details?: string;
+  hint?: string;
+};
+
 type TestResult = {
   success: boolean;
-  error?: string;
+  error?: EnhancedError;
 };
 
 type NotConfigured = { notConfigured: true };
@@ -53,7 +78,37 @@ function hasSuccessField(result: TestResult | NotConfigured): result is TestResu
   return Object.prototype.hasOwnProperty.call(result, "success");
 }
 
-function TestStatus({ result }: { result: TestResult | NotConfigured }): JSX.Element {
+function getErrorIcon(type: ErrorType): JSX.Element {
+  const iconProps = { className: "size-3", strokeWidth: 2 };
+  switch (type) {
+    case "timeout":
+      return <Clock {...iconProps} />;
+    case "network_unreachable":
+      return <WifiOff {...iconProps} />;
+    case "connection_refused":
+      return <Wifi {...iconProps} />;
+    case "auth_failed":
+      return <Lock {...iconProps} />;
+    case "rate_limited":
+      return <Gauge {...iconProps} />;
+    case "server_error":
+      return <Server {...iconProps} />;
+    case "invalid_response":
+      return <HelpCircle {...iconProps} />;
+    case "unknown":
+      return <AlertCircle {...iconProps} />;
+    default:
+      return <AlertCircle {...iconProps} />;
+  }
+}
+
+function TestStatus({
+  result,
+  isTesting,
+}: {
+  result: TestResult | NotConfigured;
+  isTesting?: boolean;
+}): JSX.Element {
   if (!hasSuccessField(result)) {
     return (
       <div className="flex items-center gap-1 text-xs text-muted-foreground">
@@ -70,10 +125,26 @@ function TestStatus({ result }: { result: TestResult | NotConfigured }): JSX.Ele
       </div>
     );
   }
+
+  const error = result.error;
+  const errorMessage = error?.message ?? "Connection failed";
+  const errorHint = error?.hint;
+  const errorType = error?.type ?? "unknown";
+
   return (
-    <div className="flex items-center gap-1 text-xs text-red-600" title={result.error}>
-      <XCircle className="size-3" />
-      <span className="truncate">{result.error}</span>
+    <div className="flex flex-col gap-1 min-w-0">
+      <div
+        className="flex items-center gap-1 text-xs text-red-600 min-w-0"
+        title={error?.details ?? errorMessage}
+      >
+        {getErrorIcon(errorType)}
+        <span className="truncate">{errorMessage}</span>
+      </div>
+      {errorHint !== undefined && (
+        <div className="text-xs text-muted-foreground pl-4 truncate" title={errorHint}>
+          {errorHint}
+        </div>
+      )}
     </div>
   );
 }
@@ -135,7 +206,9 @@ export function ProviderCard({
             <span className="font-medium">Anthropic:</span>{" "}
             <span className="truncate">{provider.anthropicBaseUrl}</span>
           </div>
-          {testResults && <TestStatus result={testResults.anthropic.nonStreaming} />}
+          {testResults && (
+            <TestStatus result={testResults.anthropic.nonStreaming} isTesting={isTesting} />
+          )}
         </div>
       )}
 
@@ -145,7 +218,9 @@ export function ProviderCard({
             <span className="font-medium">OpenAI:</span>{" "}
             <span className="truncate">{provider.openaiBaseUrl}</span>
           </div>
-          {testResults && <TestStatus result={testResults.openai.nonStreaming} />}
+          {testResults && (
+            <TestStatus result={testResults.openai.nonStreaming} isTesting={isTesting} />
+          )}
         </div>
       )}
 

package/src/components/providers/ProvidersPanel.tsx

@@ -9,9 +9,24 @@ type ConfigPathsResponse = {
   providerConfig: string;
 };
 
+type EnhancedError = {
+  message: string;
+  type:
+    | "timeout"
+    | "network_unreachable"
+    | "connection_refused"
+    | "auth_failed"
+    | "rate_limited"
+    | "server_error"
+    | "invalid_response"
+    | "unknown";
+  details?: string;
+  hint?: string;
+};
+
 type TestResult = {
   success: boolean;
-  error?: string;
+  error?: EnhancedError;
 };
 
 type NotConfigured = { notConfigured: true };
@@ -88,14 +103,23 @@ export function ProvidersPanel(): JSX.Element {
     name: string;
     apiKey: string;
     model?: string;
-    anthropicBaseUrl?: string;
-    openaiBaseUrl?: string;
+    format: "anthropic" | "openai";
+    baseUrl?: string;
   }): void {
     void (async () => {
+      // Convert baseUrl to format-specific URL
+      const payload = {
+        name: data.name,
+        apiKey: data.apiKey,
+        model: data.model,
+        format: data.format,
+        anthropicBaseUrl: data.format === "anthropic" ? data.baseUrl : undefined,
+        openaiBaseUrl: data.format === "openai" ? data.baseUrl : undefined,
+      };
       const res = await fetch("/api/providers", {
         method: "POST",
         headers: { "Content-Type": "application/json" },
-        body: JSON.stringify(data),
+        body: JSON.stringify(payload),
       });
       if (!res.ok) {
         // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
@@ -116,15 +140,24 @@ export function ProvidersPanel(): JSX.Element {
     name: string;
     apiKey: string;
     model?: string;
-    anthropicBaseUrl?: string;
-    openaiBaseUrl?: string;
+    format: "anthropic" | "openai";
+    baseUrl?: string;
   }): void {
     if (!editingProvider) return;
     void (async () => {
+      // Convert baseUrl to format-specific URL
+      const payload = {
+        name: data.name,
+        apiKey: data.apiKey,
+        model: data.model,
+        format: data.format,
+        anthropicBaseUrl: data.format === "anthropic" ? data.baseUrl : undefined,
+        openaiBaseUrl: data.format === "openai" ? data.baseUrl : undefined,
+      };
       const res = await fetch(`/api/providers/${editingProvider.id}`, {
         method: "PUT",
         headers: { "Content-Type": "application/json" },
-        body: JSON.stringify(data),
+        body: JSON.stringify(payload),
       });
       if (!res.ok) {
         // eslint-disable-next-line @typescript-eslint/consistent-type-assertions