@tonyclaw/llm-inspector 1.10.0 → 1.11.0

package/.output/server/_ssr/{router-BR4XO8XJ.mjs → router-BVxfVFsb.mjs}

@@ -1,17 +1,19 @@
 import { c as createRouter, a as createRootRoute, b as createFileRoute, l as lazyRouteComponent, O as Outlet, H as HeadContent, S as Scripts } from "../_libs/tanstack__react-router.mjs";
 import { j as jsxRuntimeExports } from "../_libs/react.mjs";
 import { S as SWRConfig } from "../_libs/swr.mjs";
-import { mkdirSync, writeFileSync, renameSync, copyFileSync, unlinkSync, existsSync, readFileSync } from "node:fs";
+import { existsSync, mkdirSync, writeFileSync, renameSync, copyFileSync, unlinkSync, readFileSync } from "node:fs";
 import path, { join, isAbsolute, dirname } from "node:path";
-import { mkdir, appendFile, readdir, stat, unlink, readFile, writeFile } from "node:fs/promises";
+import { mkdir, appendFile, readFile, readdir, stat, unlink, writeFile } from "node:fs/promises";
 import { C as Conf } from "../_libs/conf.mjs";
 import { randomUUID } from "crypto";
 import { exec } from "node:child_process";
 import { promisify } from "node:util";
-import { o as object, s as string, _ as _enum, u as union, a as array, b as boolean, n as number, d as discriminatedUnion, l as literal, r as record, c as lazy, e as _null, f as unknown } from "../_libs/zod.mjs";
+import { o as object, s as string, _ as _enum, u as union, a as array, b as boolean, n as number, d as discriminatedUnion, l as literal, r as record, c as _null, e as lazy, f as unknown } from "../_libs/zod.mjs";
+import "../_libs/tiny-warning.mjs";
 import "../_libs/tanstack__router-core.mjs";
-import "../_libs/tanstack__history.mjs";
 import "../_libs/cookie-es.mjs";
+import "../_libs/tanstack__history.mjs";
+import "../_libs/tiny-invariant.mjs";
 import "../_libs/seroval.mjs";
 import "../_libs/seroval-plugins.mjs";
 import "node:stream/web";
@@ -42,7 +44,7 @@ import "../_libs/debounce-fn.mjs";
 import "../_libs/mimic-function.mjs";
 import "../_libs/semver.mjs";
 import "../_libs/uint8array-extras.mjs";
-const appCss = "/assets/index-F2ojFPJp.css";
+const appCss = "/assets/index-SmtLx1lM.css";
 const Route$h = createRootRoute({
   head: () => ({
     meta: [
@@ -66,7 +68,7 @@ function RootDocument({ children }) {
     ] })
   ] });
 }
-const $$splitComponentImporter = () => import("./index-XyU4WVWt.mjs");
+const $$splitComponentImporter = () => import("./index-I_Nx8QEB.mjs");
 const Route$g = createFileRoute("/")({
   component: lazyRouteComponent($$splitComponentImporter, "component")
 });
@@ -328,6 +330,9 @@ const JsonValueSchema = lazy(
     record(string(), JsonValueSchema)
   ])
 );
+function trustAsJsonValue(value) {
+  return value;
+}
 const CacheControl = object({
   type: string(),
   ttl: string().optional(),
@@ -698,6 +703,25 @@ function extractModelFromBody(body) {
     return null;
   }
 }
+const LooseRequestSchema = object({
+  model: string().optional(),
+  metadata: object({ user_id: string().optional() }).passthrough().optional()
+});
+function extractRequestMetadata(body, headers) {
+  if (body === null) return { model: null, sessionId: null };
+  try {
+    const json = 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 {
+  }
+  return { model: null, sessionId: null };
+}
 function parseRequest(rawBody) {
   if (rawBody === null) return null;
   try {
@@ -777,10 +801,6 @@ function readChunks(path2) {
     return null;
   }
 }
-const LooseRequestSchema = object({
-  model: string().optional(),
-  metadata: object({ user_id: string().optional() }).passthrough().optional()
-});
 const MAX_MEMORY_CACHE = 100;
 const memoryCache = /* @__PURE__ */ new Map();
 let headId = null;
@@ -840,23 +860,10 @@ async function addTestLogEntry(entry) {
   emitLogUpdate(log);
   return log;
 }
-async function createLog(method, path2, requestBody, headers, clientInfo, rawHeaders, upstreamHeaders, apiFormat = "unknown") {
-  let model = null;
-  let sessionId = null;
-  if (requestBody !== null) {
-    try {
-      const json = 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 {
-    }
-  }
+async function createLog(method, path2, requestBody, headers, clientInfo, rawHeaders, upstreamHeaders, apiFormat = "unknown", model = null, sessionId = null, preAcquiredId) {
   const userAgent = headers.get("user-agent");
   const origin = headers.get("origin");
-  const id = await getNextLogId();
+  const id = preAcquiredId ?? await getNextLogId();
   const log = {
     id,
     timestamp: (/* @__PURE__ */ new Date()).toISOString(),
@@ -1098,7 +1105,10 @@ function extractAnthropicStream(raw, log, fallbackModel, collectChunks) {
           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++;
@@ -1325,7 +1335,7 @@ function extractOpenAIStream(raw, log, fallbackModel, collectChunks = true) {
   let completionTokens = 0;
   let usageCaptured = false;
   let started = false;
-  const toolCalls = [];
+  const toolCalls = /* @__PURE__ */ new Map();
   const MAX_CHUNKS = 1e3;
   let chunkIndex = 0;
   let streamStartMs = 0;
@@ -1352,15 +1362,12 @@ function extractOpenAIStream(raw, log, fallbackModel, collectChunks = true) {
       const chunk = chunkResult.data;
       if (chunkIndex === 0) streamStartMs = Date.now();
       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
-          });
-        }
+        chunks.push({
+          index: chunkIndex,
+          timestamp: Date.now() - streamStartMs,
+          type: "chat.completion.chunk",
+          data: trustAsJsonValue(chunk)
+        });
       }
       chunkIndex++;
       if (!started) {
@@ -1394,14 +1401,14 @@ function extractOpenAIStream(raw, log, fallbackModel, collectChunks = true) {
         }
         if (delta.tool_calls !== void 0 && delta.tool_calls !== null) {
           for (const tc of delta.tool_calls) {
-            let existing = toolCalls.find((t) => t.index === tc.index);
-            if (!existing) {
+            let existing = toolCalls.get(tc.index);
+            if (existing === void 0) {
               existing = {
                 index: tc.index,
                 type: "function",
                 function: { name: "", arguments: "" }
               };
-              toolCalls.push(existing);
+              toolCalls.set(tc.index, existing);
             }
             if (tc.id !== void 0) existing.id = tc.id;
             if (tc.function?.name !== void 0) existing.function.name += tc.function.name;
@@ -1428,7 +1435,7 @@ function extractOpenAIStream(raw, log, fallbackModel, collectChunks = true) {
     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,
     object: "chat.completion",
@@ -1549,6 +1556,22 @@ const alibabaProvider = {
   }
 };
 registry.register(alibabaProvider);
+function getDataDir() {
+  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 !== void 0 && dirEnv !== "") {
+    return isAbsolute(dirEnv) ? dirEnv : join(base, dirEnv);
+  }
+  const legacyDirEnv = process.env["LLM_INSPECTOR_CONFIG_DIR"];
+  if (legacyDirEnv !== void 0 && legacyDirEnv !== "") {
+    return isAbsolute(legacyDirEnv) ? legacyDirEnv : join(base, legacyDirEnv);
+  }
+  return join(base, ".llm-inspector");
+}
+function hasExplicitDataDir() {
+  return process.env["LLM_INSPECTOR_DATA_DIR"] !== void 0 && process.env["LLM_INSPECTOR_DATA_DIR"] !== "" || process.env["LLM_INSPECTOR_CONFIG_DIR"] !== void 0 && process.env["LLM_INSPECTOR_CONFIG_DIR"] !== "";
+}
 const ProviderConfigSchema = object({
   id: string(),
   name: string(),
@@ -1572,14 +1595,42 @@ const ProviderConfigSchema = object({
 object({
   providers: array(ProviderConfigSchema)
 });
+function migrateFromLegacyConfLocation(targetStore) {
+  if (process.env["LLM_INSPECTOR_CONFIG_PATH"] !== void 0) return;
+  if (hasExplicitDataDir()) return;
+  if (targetStore.get("providers", []).length > 0) return;
+  let legacyStore;
+  try {
+    legacyStore = new Conf({
+      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();
+  }
+}
 const configPath = process.env["LLM_INSPECTOR_CONFIG_PATH"];
+const dataDir = getDataDir();
+if (configPath === void 0) {
+  mkdirSync(dataDir, { recursive: true });
+}
 const store = new Conf({
-  projectName: "llm-inspector",
+  cwd: dataDir,
+  configName: "providers",
   defaults: {
     providers: []
   },
   ...configPath !== void 0 ? { path: configPath } : {}
 });
+migrateFromLegacyConfLocation(store);
 function migrateProvider(p) {
   const currentAnthropicUrl = p.anthropicBaseUrl ?? "";
   const currentOpenaiUrl = p.openaiBaseUrl ?? "";
@@ -1930,15 +1981,6 @@ async function getClientInfo(request) {
 const RuntimeConfigSchema = object({
   stripClaudeCodeBillingHeader: boolean()
 });
-function getDataDir() {
-  const isWindows = process.platform === "win32";
-  const base = isWindows ? process.env["APPDATA"] ?? join(process.env["USERPROFILE"] ?? "C:\\", ".llm-inspector") : process.env["HOME"] ?? "/tmp";
-  const configDirEnv = process.env["LLM_INSPECTOR_CONFIG_DIR"];
-  if (configDirEnv !== void 0) {
-    return isAbsolute(configDirEnv) ? configDirEnv : join(base, configDirEnv);
-  }
-  return join(base, ".llm-inspector");
-}
 function getConfigFilePath() {
   return join(getDataDir(), "config.json");
 }
@@ -2265,7 +2307,7 @@ async function handleProxy(req) {
       bodyToForward = stripped.body;
     }
   }
-  const model = requestBody !== null ? extractModelFromBody(requestBody) : null;
+  const { model, sessionId } = extractRequestMetadata(requestBody, req.headers);
   const matchedProviderConfig = model !== null ? findProviderByModel(model) : null;
   const upstreamBase = selectUpstreamBase$1(parsed.isChatCompletions, matchedProviderConfig);
   const upstreamUrl = buildUpstreamUrl$1(upstreamBase, parsed.normalizedPath);
@@ -2290,7 +2332,7 @@ async function handleProxy(req) {
   if (formatHandler === null) {
     return new Response("Forbidden: unsupported format", { status: STATUS_FORBIDDEN });
   }
-  const clientInfo = await getClientInfo(req);
+  const [clientInfo, preAcquiredId] = await Promise.all([getClientInfo(req), getNextLogId()]);
   const upstreamHeadersObj = {};
   upstreamHeaders.forEach((value, key) => {
     upstreamHeadersObj[key.toLowerCase()] = value;
@@ -2303,7 +2345,10 @@ async function handleProxy(req) {
     clientInfo,
     rawHeaders,
     upstreamHeadersObj,
-    formatHandler.format
+    formatHandler.format,
+    model,
+    sessionId,
+    preAcquiredId
   );
   let upstreamRes;
   try {

package/.output/server/_tanstack-start-manifest_v-Cm2Owszu.mjs

@@ -0,0 +1,4 @@
+const tsrStartManifest = () => ({ "routes": { "__root__": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/__root.tsx", "children": ["/", "/api/config", "/api/health", "/api/logs", "/api/models", "/api/providers", "/api/sessions", "/proxy/$"], "preloads": ["/assets/main-QfbQ5oBP.js"], "assets": [] }, "/": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/index.tsx", "assets": [], "preloads": ["/assets/index-BIZeMR5N.js"] }, "/api/config": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/config.ts", "children": ["/api/config/paths"] }, "/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/providers/export", "/api/providers/import"] }, "/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/providers/export": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/providers.export.ts" }, "/api/providers/import": { "filePath": "C:/Users/claw/workspace/llm-inspector/src/routes/api/providers.import.ts" }, "/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-QfbQ5oBP.js" });
+export {
+  tsrStartManifest
+};

package/.output/server/index.mjs

@@ -38,51 +38,51 @@ const assets = {
   "/assets/alibaba-TTwafVwX.svg": {
     "type": "image/svg+xml",
     "etag": '"171b-6dyV5K8QjiaY35sN9qNprh9zDIs"',
-    "mtime": "2026-06-06T06:10:03.367Z",
+    "mtime": "2026-06-06T08:18:21.509Z",
     "size": 5915,
     "path": "../public/assets/alibaba-TTwafVwX.svg"
   },
-  "/assets/index-F2ojFPJp.css": {
-    "type": "text/css; charset=utf-8",
-    "etag": '"10ec0-6l9kmLR4Pe6YaaY4kOiwBp4tyLs"',
-    "mtime": "2026-06-06T06:10:03.368Z",
-    "size": 69312,
-    "path": "../public/assets/index-F2ojFPJp.css"
-  },
-  "/assets/index-BFuUQkWu.js": {
-    "type": "text/javascript; charset=utf-8",
-    "etag": '"5103c-l+8AHdGxgCZ2mb5rpeb9f++id64"',
-    "mtime": "2026-06-06T06:10:03.369Z",
-    "size": 331836,
-    "path": "../public/assets/index-BFuUQkWu.js"
-  },
   "/assets/minimax-BPMzvuL-.jpeg": {
     "type": "image/jpeg",
     "etag": '"1b06-IwivU89ko5UTMUM1/t7hn4sQK9A"',
-    "mtime": "2026-06-06T06:10:03.368Z",
+    "mtime": "2026-06-06T08:18:21.509Z",
     "size": 6918,
     "path": "../public/assets/minimax-BPMzvuL-.jpeg"
   },
-  "/assets/qwen-CONDcHqt.png": {
-    "type": "image/png",
-    "etag": '"572c3-cdJAPaHdOvFCGzuaQjagdgOu6XE"',
-    "mtime": "2026-06-06T06:10:03.368Z",
-    "size": 357059,
-    "path": "../public/assets/qwen-CONDcHqt.png"
+  "/assets/index-SmtLx1lM.css": {
+    "type": "text/css; charset=utf-8",
+    "etag": '"11492-YrH3CdmyZtpurvkMiG+Z8YMKpbg"',
+    "mtime": "2026-06-06T08:18:21.509Z",
+    "size": 70802,
+    "path": "../public/assets/index-SmtLx1lM.css"
   },
   "/assets/zhipuai-BPNAnxo-.svg": {
     "type": "image/svg+xml",
     "etag": '"2bf8-hNaLCTi89nOFCsIIfWpP/jrfo0s"',
-    "mtime": "2026-06-06T06:10:03.367Z",
+    "mtime": "2026-06-06T08:18:21.506Z",
     "size": 11256,
     "path": "../public/assets/zhipuai-BPNAnxo-.svg"
   },
-  "/assets/index-nKnhyW4Y.js": {
+  "/assets/main-QfbQ5oBP.js": {
+    "type": "text/javascript; charset=utf-8",
+    "etag": '"50599-yvOA/5xDdT1OIDnPKqlDcpJMeK8"',
+    "mtime": "2026-06-06T08:18:21.511Z",
+    "size": 329113,
+    "path": "../public/assets/main-QfbQ5oBP.js"
+  },
+  "/assets/qwen-CONDcHqt.png": {
+    "type": "image/png",
+    "etag": '"572c3-cdJAPaHdOvFCGzuaQjagdgOu6XE"',
+    "mtime": "2026-06-06T08:18:21.509Z",
+    "size": 357059,
+    "path": "../public/assets/qwen-CONDcHqt.png"
+  },
+  "/assets/index-BIZeMR5N.js": {
     "type": "text/javascript; charset=utf-8",
-    "etag": '"88176-QQw6RfsFjx/+JC7JvSklqQcNnXg"',
-    "mtime": "2026-06-06T06:10:03.369Z",
-    "size": 557430,
-    "path": "../public/assets/index-nKnhyW4Y.js"
+    "etag": '"899b2-Z4qeBA7/hHMhVcDcD+o7Iw8hgNw"',
+    "mtime": "2026-06-06T08:18:21.511Z",
+    "size": 563634,
+    "path": "../public/assets/index-BIZeMR5N.js"
   }
 };
 function readAsset(id) {

package/README.md

@@ -1,6 +1,6 @@
 # llm-inspector
 
-> LLM API 透明代理调试器 / Transparent LLM API proxy inspector
+> LLM Inspector
 
 ![Proxy Overview](docs/Proxy.png)
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tonyclaw/llm-inspector",
-  "version": "1.10.0",
+  "version": "1.11.0",
   "type": "module",
   "description": "LLM API proxy inspector — captures and displays requests/responses from AI coding tools in a web UI",
   "license": "MIT",
@@ -55,6 +55,7 @@
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "conf": "^15.1.0",
+    "diff": "^9.0.0",
     "jszip": "^3.10.1",
     "lucide-react": "^0.563.0",
     "radix-ui": "^1.4.3",

package/src/components/ProxyViewer.tsx

@@ -10,6 +10,7 @@ import {
   LogEntry,
   type ConversationGroupData,
 } from "./proxy-viewer";
+import { CrabLogo } from "./ui/crab-logo";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./ui/select";
 import { SettingsDialog } from "./providers/SettingsDialog";
 
@@ -91,6 +92,8 @@ export type ProxyViewerProps = {
   onClearAll: () => void;
   viewMode: "simple" | "full";
   onViewModeChange: (mode: "simple" | "full") => void;
+  /** Live strip-Claude-Code-billing-header flag, sourced once at the container. */
+  strip: boolean;
 };
 
 export function ProxyViewer({
@@ -104,6 +107,7 @@ export function ProxyViewer({
   onClearAll,
   viewMode,
   onViewModeChange,
+  strip,
 }: ProxyViewerProps): JSX.Element {
   const { totalIn, totalOut } = computeTokenSummary(logs);
   const [groupedView, setGroupedView] = useState(true);
@@ -142,7 +146,10 @@ export function ProxyViewer({
     <div className="max-w-[1200px] mx-auto flex flex-col h-screen" style={{ maxHeight: "100vh" }}>
       {/* Header */}
       <div className="flex items-center gap-4 mb-4 px-6 pt-6">
-        <h1 className="text-lg font-bold flex-1">LLM Proxy Inspector</h1>
+        <h1 className="text-lg font-bold flex-1 flex items-center gap-2">
+          <CrabLogo className="size-10 text-amber-500" />
+          LLM Inspector
+        </h1>
         <span className="text-muted-foreground text-xs font-mono">v{packageJson.version}</span>
         <div className="flex items-center border border-border rounded-md overflow-hidden">
           <button
@@ -294,7 +301,7 @@ export function ProxyViewer({
                         transform: `translateY(${virtualRow.start}px)`,
                       }}
                     >
-                      <ConversationGroup group={group} viewMode={viewMode} />
+                      <ConversationGroup group={group} viewMode={viewMode} strip={strip} />
                     </div>
                   );
                 } else {
@@ -313,7 +320,7 @@ export function ProxyViewer({
                         transform: `translateY(${virtualRow.start}px)`,
                       }}
                     >
-                      <LogEntry log={log} viewMode={viewMode} />
+                      <LogEntry log={log} viewMode={viewMode} strip={strip} />
                     </div>
                   );
                 }

package/src/components/ProxyViewerContainer.tsx

@@ -1,6 +1,7 @@
 import { useState, useEffect, useCallback, useRef, type JSX } from "react";
 import { z } from "zod";
 import { CapturedLogSchema, type CapturedLog } from "../proxy/schemas";
+import { useStripConfig } from "../lib/useStripConfig";
 import { ProxyViewer } from "./ProxyViewer";
 
 type logsResponse = {
@@ -196,6 +197,10 @@ export function ProxyViewerContainer(): JSX.Element {
     })();
   }, []);
 
+  // Read the strip config once at the container so the virtualized list does
+  // not need N independent SWR subscriptions per row.
+  const { strip } = useStripConfig();
+
   return (
     <>
       {error !== null && (
@@ -214,6 +219,7 @@ export function ProxyViewerContainer(): JSX.Element {
         onClearAll={handleClearAll}
         viewMode={viewMode}
         onViewModeChange={setViewMode}
+        strip={strip}
       />
     </>
   );

package/src/components/proxy-viewer/ConversationGroup.tsx

@@ -13,6 +13,8 @@ import { LogEntry } from "./LogEntry";
 export type ConversationGroupProps = {
   group: ConversationGroupData;
   viewMode?: "simple" | "full";
+  /** Live strip-Claude-Code-billing-header flag from the viewer container. */
+  strip: boolean;
 };
 
 function computeStats(logs: CapturedLog[]): {
@@ -31,6 +33,7 @@ function computeStats(logs: CapturedLog[]): {
 export const ConversationGroup = memo(function ({
   group,
   viewMode = "simple",
+  strip,
 }: ConversationGroupProps): JSX.Element {
   const [expanded, setExpanded] = useState(false);
 
@@ -64,7 +67,13 @@ export const ConversationGroup = memo(function ({
       {expanded && (
         <div className="pl-4 border-l-2 border-muted ml-3">
           {group.logs.map((log) => (
-            <LogEntry key={log.id} log={log} viewMode={viewMode} suppressApiFormatBadge={!mixed} />
+            <LogEntry
+              key={log.id}
+              log={log}
+              viewMode={viewMode}
+              suppressApiFormatBadge={!mixed}
+              strip={strip}
+            />
           ))}
         </div>
       )}