@tonyclaw/llm-inspector 1.10.0 → 1.11.0

package/src/components/ui/crab-logo.tsx

@@ -0,0 +1,45 @@
+import type { JSX } from "react";
+import { cn } from "../../lib/utils";
+
+/**
+ * Small inline-SVG crab mark used in the inspector header. Stroke-based so
+ * the colour follows `currentColor` — pair with a Tailwind text colour class
+ * (e.g. `text-amber-500`) to recolour without editing the SVG. Sized to
+ * match the title text by default; pass `className` to override.
+ *
+ * Plays on the project owner's `TonyClaw` handle and keeps the title bar
+ * visually distinct in the same way Claude Code's CLI uses a small
+ * block-cursor mark next to its name.
+ */
+export function CrabLogo({ className }: { className?: string }): JSX.Element {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="1.5"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      aria-hidden="true"
+      className={cn("inline-block size-5", className)}
+    >
+      {/* Body */}
+      <path d="M5 13 C5 9 8 7 12 7 C16 7 19 9 19 13 C19 16 16 18 12 18 C8 18 5 16 5 13 Z" />
+      {/* Left claw */}
+      <path d="M5 11 C3.5 9.5 1.5 10 2 12.5 C2.5 14 4 13.5 5 12.5" />
+      {/* Right claw */}
+      <path d="M19 11 C20.5 9.5 22.5 10 22 12.5 C21.5 14 20 13.5 19 12.5" />
+      {/* Eye stalks */}
+      <line x1="10" y1="7" x2="9.5" y2="5" />
+      <line x1="14" y1="7" x2="14.5" y2="5" />
+      {/* Eyes */}
+      <circle cx="9.5" cy="4.5" r="0.9" fill="currentColor" stroke="none" />
+      <circle cx="14.5" cy="4.5" r="0.9" fill="currentColor" stroke="none" />
+      {/* Legs */}
+      <line x1="6.5" y1="16" x2="4.5" y2="19.5" />
+      <line x1="9" y1="17.5" x2="8" y2="20.5" />
+      <line x1="15" y1="17.5" x2="16" y2="20.5" />
+      <line x1="17.5" y1="16" x2="19.5" y2="19.5" />
+    </svg>
+  );
+}

package/src/proxy/config.ts

@@ -7,8 +7,9 @@ import {
   renameSync,
   copyFileSync,
 } from "node:fs";
-import { join, isAbsolute } from "node:path";
+import { join } from "node:path";
 import { logger } from "./logger";
+import { getDataDir } from "./dataDir";
 import { RuntimeConfigSchema, type RuntimeConfig } from "../lib/runtimeConfig";
 
 // Re-export so server-side callers (api/config.ts, tests) keep the
@@ -33,22 +34,7 @@ export type { RuntimeConfig };
  * precedence over the env var for the lifetime of the process.
  */
 
-// --- Persistence (declared before init so getDataDir() is callable at module load) ---
-
-function getDataDir(): string {
-  const isWindows = process.platform === "win32";
-  const base = isWindows
-    ? (process.env["APPDATA"] ?? join(process.env["USERPROFILE"] ?? "C:\\", ".llm-inspector"))
-    : (process.env["HOME"] ?? "/tmp");
-
-  // Read the env var on every call so tests can override the directory
-  // after the module has been imported.
-  const configDirEnv = process.env["LLM_INSPECTOR_CONFIG_DIR"];
-  if (configDirEnv !== undefined) {
-    return isAbsolute(configDirEnv) ? configDirEnv : join(base, configDirEnv);
-  }
-  return join(base, ".llm-inspector");
-}
+// --- Persistence ---
 
 function getConfigFilePath(): string {
   return join(getDataDir(), "config.json");

package/src/proxy/dataDir.ts

@@ -0,0 +1,56 @@
+import { isAbsolute, join } from "node:path";
+
+/**
+ * Compute the directory where llm-inspector stores its on-disk state
+ * (runtime config, providers config, log chunks, etc.). Centralised here
+ * so every store agrees on the same path.
+ *
+ * Resolution order (first match wins):
+ *   1. `LLM_INSPECTOR_DATA_DIR` env var — absolute path used as-is,
+ *      relative path joined to the OS-specific base below.
+ *   2. `LLM_INSPECTOR_CONFIG_DIR` env var — kept for backward compat
+ *      with the runtime config; treated as a directory *name* (relative
+ *      to the OS-specific base) when not absolute.
+ *   3. Windows: `%APPDATA%\.llm-inspector` (falls back to
+ *      `%USERPROFILE%\.llm-inspector` if APPDATA is unset, then to
+ *      `C:\.llm-inspector` as a last resort).
+ *      macOS / Linux: `$HOME/.llm-inspector` (falls back to `/tmp`).
+ *
+ * The env var is re-read on every call so tests and the CLI can swap the
+ * directory after this module has been imported.
+ */
+export function getDataDir(): string {
+  const isWindows = process.platform === "win32";
+  const base = isWindows
+    ? (process.env["APPDATA"] ?? join(process.env["USERPROFILE"] ?? "C:\\", ".llm-inspector"))
+    : (process.env["HOME"] ?? "/tmp");
+
+  const dirEnv = process.env["LLM_INSPECTOR_DATA_DIR"];
+  if (dirEnv !== undefined && dirEnv !== "") {
+    return isAbsolute(dirEnv) ? dirEnv : join(base, dirEnv);
+  }
+
+  // Backward-compat: the runtime config historically read
+  // `LLM_INSPECTOR_CONFIG_DIR` as a directory *name* (relative to base).
+  // Honour it so existing CLI scripts keep working.
+  const legacyDirEnv = process.env["LLM_INSPECTOR_CONFIG_DIR"];
+  if (legacyDirEnv !== undefined && legacyDirEnv !== "") {
+    return isAbsolute(legacyDirEnv) ? legacyDirEnv : join(base, legacyDirEnv);
+  }
+
+  return join(base, ".llm-inspector");
+}
+
+/**
+ * `true` when the user has explicitly asked for a non-default data
+ * directory. Used to skip the one-time legacy migration so we don't
+ * write to a path the user didn't choose.
+ */
+export function hasExplicitDataDir(): boolean {
+  return (
+    (process.env["LLM_INSPECTOR_DATA_DIR"] !== undefined &&
+      process.env["LLM_INSPECTOR_DATA_DIR"] !== "") ||
+    (process.env["LLM_INSPECTOR_CONFIG_DIR"] !== undefined &&
+      process.env["LLM_INSPECTOR_CONFIG_DIR"] !== "")
+  );
+}

package/src/proxy/formats/anthropic/stream.ts

@@ -1,5 +1,5 @@
 import type { CapturedLog, JsonValue } from "../../schemas";
-import { JsonValueSchema } from "../jsonSchema";
+import { trustAsJsonValue } from "../jsonSchema";
 import { SseEventSchema } from "./schemas";
 
 type StreamTextBlock = { type: "text"; text: string };
@@ -78,7 +78,10 @@ export function extractAnthropicStream(
           index: chunkIndex,
           timestamp: Date.now() - streamStartMs,
           type: data.type,
-          data: JsonValueSchema.parse(data),
+          // `data` has already been validated by SseEventSchema above; the
+          // recursive JsonValue walk is a redundant full-tree zod parse on
+          // every SSE event. See trustAsJsonValue for the rationale.
+          data: trustAsJsonValue(data),
         });
       }
       chunkIndex++;

package/src/proxy/formats/jsonSchema.ts

@@ -22,3 +22,15 @@ export const JsonValueSchema: z.ZodType<JsonValue> = z.lazy(() =>
     z.record(z.string(), JsonValueSchema),
   ]),
 );
+
+/**
+ * Re-types a value as `JsonValue` without re-walking it. Use this ONLY when
+ * the value has already been validated (e.g., via `SseEventSchema.safeParse`)
+ * AND originated from `JSON.parse`. Skipping the recursive `JsonValueSchema`
+ * walk avoids a second full-tree zod parse on every event of every streaming
+ * response. Centralized here so the eslint-disable is one site, not two.
+ */
+export function trustAsJsonValue<T>(value: T): JsonValue {
+  // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+  return value as unknown as JsonValue;
+}

package/src/proxy/formats/openai/stream.ts

@@ -1,5 +1,5 @@
 import type { CapturedLog, JsonValue } from "../../schemas";
-import { JsonValueSchema } from "../jsonSchema";
+import { trustAsJsonValue } from "../jsonSchema";
 import { OpenAISSERawChunkSchema } from "./schemas";
 
 /**
@@ -21,12 +21,17 @@ export function extractOpenAIStream(
   let completionTokens = 0;
   let usageCaptured = false;
   let started = false;
-  const toolCalls: Array<{
+  type ToolCallEntry = {
     index: number;
     id?: string;
     type: "function";
     function: { name: string; arguments: string };
-  }> = [];
+  };
+  // Map keyed by `index` so delta accumulation is O(1) per delta instead of
+  // O(N) (the previous Array#find). Map preserves insertion order, so the
+  // final `[...toolCalls.values()]` keeps tool calls in the order they were
+  // first seen.
+  const toolCalls: Map<number, ToolCallEntry> = new Map();
 
   // Chunk collection state
   const MAX_CHUNKS = 1000;
@@ -66,15 +71,15 @@ export function extractOpenAIStream(
 
       // Collect chunks if enabled
       if (collectChunks === true && chunks.length < MAX_CHUNKS) {
-        const jsonResult = JsonValueSchema.safeParse(chunk);
-        if (jsonResult.success) {
-          chunks.push({
-            index: chunkIndex,
-            timestamp: Date.now() - streamStartMs,
-            type: "chat.completion.chunk",
-            data: jsonResult.data,
-          });
-        }
+        // `chunk` has already been validated by OpenAISSERawChunkSchema above;
+        // skipping the recursive JsonValue walk avoids a second full-tree zod
+        // parse on every SSE event. See trustAsJsonValue for the rationale.
+        chunks.push({
+          index: chunkIndex,
+          timestamp: Date.now() - streamStartMs,
+          type: "chat.completion.chunk",
+          data: trustAsJsonValue(chunk),
+        });
       }
       chunkIndex++;
 
@@ -114,14 +119,14 @@ export function extractOpenAIStream(
         if (delta.tool_calls !== undefined && delta.tool_calls !== null) {
           for (const tc of delta.tool_calls) {
             // Find or create tool call entry by index
-            let existing = toolCalls.find((t) => t.index === tc.index);
-            if (!existing) {
+            let existing = toolCalls.get(tc.index);
+            if (existing === undefined) {
               existing = {
                 index: tc.index,
                 type: "function",
                 function: { name: "", arguments: "" },
               };
-              toolCalls.push(existing);
+              toolCalls.set(tc.index, existing);
             }
             if (tc.id !== undefined) existing.id = tc.id;
             if (tc.function?.name !== undefined) existing.function.name += tc.function.name;
@@ -154,7 +159,7 @@ export function extractOpenAIStream(
     content: completionContent,
   };
   if (reasoningContent) message.reasoning_content = reasoningContent;
-  if (toolCalls.length > 0) message.tool_calls = toolCalls;
+  if (toolCalls.size > 0) message.tool_calls = [...toolCalls.values()];
 
   return JSON.stringify({
     id,

package/src/proxy/handler.ts

@@ -1,7 +1,7 @@
-import { createLog, emitLogUpdate, type CapturedLog } from "./store";
+import { createLog, emitLogUpdate, getNextLogId, type CapturedLog } from "./store";
 import { appendLogEntry, logger } from "./logger";
 import { writeChunks } from "./chunkStorage";
-import { extractModelFromBody, type RequestFormat } from "./schemas";
+import { extractModelFromBody, extractRequestMetadata, type RequestFormat } from "./schemas";
 import { registry } from "./formats";
 import { findProviderByModel } from "./providers";
 import { getClientInfo } from "./socketTracker";
@@ -332,8 +332,10 @@ export async function handleProxy(req: Request): Promise<Response> {
     }
   }
 
-  // Extract model once and reuse - avoid duplicate parsing
-  const model = requestBody !== null ? extractModelFromBody(requestBody) : null;
+  // Parse the request body exactly once. The handler needs the model for
+  // provider routing and the session id for the log; `createLog` would
+  // otherwise re-parse the same body to extract the same fields.
+  const { model, sessionId } = extractRequestMetadata(requestBody, req.headers);
 
   // Find provider config using already-extracted model (not calling extractModelFromBody again)
   const matchedProviderConfig = model !== null ? findProviderByModel(model) : null;
@@ -369,7 +371,12 @@ export async function handleProxy(req: Request): Promise<Response> {
     return new Response("Forbidden: unsupported format", { status: STATUS_FORBIDDEN });
   }
 
-  const clientInfo = await getClientInfo(req);
+  // Acquire client info and the next log id in parallel. On Windows
+  // `getClientInfo` shells out to PowerShell and is the single slowest
+  // thing on the hot path; serializing it before `createLog` paid the
+  // full PowerShell round-trip on top of everything else before
+  // `fetch` is even issued.
+  const [clientInfo, preAcquiredId] = await Promise.all([getClientInfo(req), getNextLogId()]);
   const upstreamHeadersObj: Record<string, string> = {};
   upstreamHeaders.forEach((value, key) => {
     upstreamHeadersObj[key.toLowerCase()] = value;
@@ -383,6 +390,9 @@ export async function handleProxy(req: Request): Promise<Response> {
     rawHeaders,
     upstreamHeadersObj,
     formatHandler.format,
+    model,
+    sessionId,
+    preAcquiredId,
   );
 
   let upstreamRes: Response;

package/src/proxy/providers.ts

@@ -1,6 +1,10 @@
 import { z } from "zod";
 import Conf from "conf";
 import { randomUUID } from "crypto";
+import { mkdirSync } from "node:fs";
+import { join } from "node:path";
+import { logger } from "./logger";
+import { getDataDir, hasExplicitDataDir } from "./dataDir";
 
 export const ProviderConfigSchema = z.object({
   id: z.string(),
@@ -31,17 +35,73 @@ const ProvidersStoreSchema = z.object({
 
 type ProvidersStore = z.infer<typeof ProvidersStoreSchema>;
 
+/**
+ * One-time migration from the legacy conf v15 default location
+ * (`%APPDATA%\llm-inspector-nodejs\Config\config.json` on Windows,
+ * `$XDG_CONFIG_HOME/llm-inspector-nodejs/Config/config.json` on Linux).
+ * Older versions of llm-inspector let the `conf` library pick the path,
+ * which produced a project-suffixed directory under the OS user-config
+ * root. Users who upgrade now have their providers copied to the new
+ * `<dataDir>/providers.json` location; the legacy file is left in
+ * place for safety and can be deleted manually.
+ *
+ * The check is "new store is still empty" rather than "new file doesn't
+ * exist" because `Conf` materialises the defaults file on construction
+ * — so the file is always present immediately after the `new Conf()`
+ * call above, even on a brand-new install.
+ */
+function migrateFromLegacyConfLocation(targetStore: Conf<ProvidersStore>): void {
+  if (process.env["LLM_INSPECTOR_CONFIG_PATH"] !== undefined) return;
+  if (hasExplicitDataDir()) return;
+  if (targetStore.get("providers", []).length > 0) return;
+  let legacyStore: Conf<ProvidersStore> | undefined;
+  try {
+    legacyStore = new Conf<ProvidersStore>({
+      projectName: "llm-inspector",
+      defaults: { providers: [] },
+    });
+    const legacyProviders = legacyStore.get("providers", []);
+    if (legacyProviders.length === 0) return;
+    targetStore.set("providers", legacyProviders);
+    logger.info(
+      `[providers] Migrated ${legacyProviders.length} provider(s) from ${legacyStore.path} to ${targetStore.path}`,
+    );
+  } catch (err) {
+    logger.warn(`[providers] Legacy migration failed: ${String(err)}`);
+  } finally {
+    legacyStore?._closeWatcher();
+  }
+}
+
 // Using conf for storage - works in any Node.js environment without Electron
 // Note: conf stores data in plain JSON. For production, consider additional encryption.
 const configPath = process.env["LLM_INSPECTOR_CONFIG_PATH"];
+
+// The data directory is shared with the runtime config (`config.ts`).
+// We pass `cwd` so conf writes the file as `<cwd>/<configName>.<ext>`,
+// i.e. `<dataDir>/providers.json`. The runtime config lives at
+// `<dataDir>/config.json`; the different filenames keep the two stores
+// from overwriting each other. `mkdirSync(..., { recursive: true })` is
+// a no-op when the directory already exists.
+const dataDir = getDataDir();
+if (configPath === undefined) {
+  mkdirSync(dataDir, { recursive: true });
+}
+
 export const store = new Conf<ProvidersStore>({
-  projectName: "llm-inspector",
+  cwd: dataDir,
+  configName: "providers",
   defaults: {
     providers: [],
   },
   ...(configPath !== undefined ? { path: configPath } : {}),
 });
 
+// Run the legacy migration once on module load. No-op when the new file
+// already has data, when the user has set LLM_INSPECTOR_CONFIG_PATH or
+// an explicit data dir, or when the legacy file is empty.
+migrateFromLegacyConfLocation(store);
+
 /**
  * Migrates a single provider config to preserve both Anthropic and OpenAI URLs.
  */

package/src/proxy/schemas.ts

@@ -145,6 +145,48 @@ export function extractModelFromBody(body: string): string | null {
   }
 }
 
+/**
+ * Loose request schema used for routing + log metadata. Tolerant of missing
+ * fields so it can extract what it can from a partially-valid or unparseable
+ * body without throwing.
+ */
+export const LooseRequestSchema = z.object({
+  model: z.string().optional(),
+  metadata: z.object({ user_id: z.string().optional() }).passthrough().optional(),
+});
+
+export type RequestMetadata = {
+  model: string | null;
+  sessionId: string | null;
+};
+
+/**
+ * Parse a request body exactly once and pull out everything the handler needs
+ * for routing + log creation: the model (used for provider selection) and the
+ * session id (from `metadata.user_id` or the `x-session-affinity` header).
+ *
+ * Returning `null` for either field is a valid outcome — callers must handle
+ * "unknown" gracefully. Callers that already have the body string should use
+ * this instead of re-parsing with `extractModelFromBody` and a second pass
+ * for the session id.
+ */
+export function extractRequestMetadata(body: string | null, headers: Headers): RequestMetadata {
+  if (body === null) return { model: null, sessionId: null };
+  try {
+    const json: unknown = JSON.parse(body);
+    const loose = LooseRequestSchema.safeParse(json);
+    if (loose.success) {
+      return {
+        model: loose.data.model ?? null,
+        sessionId: loose.data.metadata?.user_id ?? headers.get("x-session-affinity") ?? null,
+      };
+    }
+  } catch {
+    // body not valid JSON
+  }
+  return { model: null, sessionId: null };
+}
+
 /**
  * Parse a raw request body into an InspectorRequest.
  * @deprecated Use FormatHandler.parseRequest() instead

package/src/proxy/store.ts

@@ -1,4 +1,3 @@
-import { z } from "zod";
 import { readFileSync, existsSync, createReadStream } from "node:fs";
 import { readdir as readdirCallback } from "node:fs/promises";
 import { createInterface } from "node:readline";
@@ -17,11 +16,7 @@ import type { CapturedLog } from "./schemas";
 import { CapturedLogSchema } from "./schemas";
 
 export type { CapturedLog };
-
-const LooseRequestSchema = z.object({
-  model: z.string().optional(),
-  metadata: z.object({ user_id: z.string().optional() }).passthrough().optional(),
-});
+export { getNextLogId };
 
 const MAX_MEMORY_CACHE = 100;
 
@@ -142,27 +137,15 @@ export async function createLog(
   rawHeaders?: Record<string, string>,
   upstreamHeaders?: Record<string, string>,
   apiFormat: "anthropic" | "openai" | "unknown" = "unknown",
+  model: string | null = null,
+  sessionId: string | null = null,
+  /** Pre-acquired log id; if omitted, `getNextLogId` is awaited internally. */
+  preAcquiredId?: number,
 ): Promise<CapturedLog> {
-  let model: string | null = null;
-  let sessionId: string | null = null;
-
-  if (requestBody !== null) {
-    try {
-      const json: unknown = JSON.parse(requestBody);
-      const loose = LooseRequestSchema.safeParse(json);
-      if (loose.success) {
-        model = loose.data.model ?? null;
-        sessionId = loose.data.metadata?.user_id ?? headers.get("x-session-affinity") ?? null;
-      }
-    } catch {
-      // request body not valid JSON, skip parsing
-    }
-  }
-
   const userAgent = headers.get("user-agent");
   const origin = headers.get("origin");
 
-  const id = await getNextLogId();
+  const id = preAcquiredId ?? (await getNextLogId());
   const log: CapturedLog = {
     id,
     timestamp: new Date().toISOString(),