@tonyclaw/agent-inspector 2.0.41 → 2.0.43

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

@@ -1,7 +1,8 @@
 import { AlertTriangle, GitCompareArrows } from "lucide-react";
 import { Suspense, type JSX } from "react";
 import { useCallback, useEffect, useMemo, useRef, useState, memo } from "react";
-import type { CapturedLog } from "../../contracts";
+import { CapturedLogSchema, type CapturedLog } from "../../contracts";
+import { fetchJson } from "../../lib/apiClient";
 import type { TimeDisplayFormat } from "../../lib/runtimeConfig";
 import { stripClaudeCodeBillingHeader } from "../../proxy/claudeCodeStrip";
 import { Button } from "../ui/button";
@@ -50,6 +51,12 @@ function resolveFocusedTab(tab: LogFocusTab, anatomySegments: AnatomySegment[] |
   }
 }
 
+type BodyHydrationState = "idle" | "loading" | "failed";
+
+function shouldHydrateLogBody(log: CapturedLog): boolean {
+  return log.bodyContentMode === "compact" || log.bodyContentMode === "truncated";
+}
+
 export type LogEntryProps = {
   log: CapturedLog;
   viewMode?: "simple" | "full";
@@ -144,53 +151,56 @@ export const LogEntry = memo(function ({
   const [requestDiff, setRequestDiff] = useState<boolean>(false);
   const [activeTab, setActiveTab] = useState("request");
   const [expandToPath, setExpandToPath] = useState<string | null>(null);
+  const [hydratedLog, setHydratedLog] = useState<CapturedLog | null>(null);
+  const [bodyHydrationState, setBodyHydrationState] = useState<BodyHydrationState>("idle");
   const requestJsonRef = useRef<HTMLDivElement | null>(null);
-  const resolvedFormat = resolveLogFormat(log);
+  const displayLog = hydratedLog ?? log;
+  const resolvedFormat = resolveLogFormat(displayLog);
   const adapter = getLogFormatAdapter(resolvedFormat);
   const requestAnalysis = useMemo(
-    () => adapter.analyzeRequest(log.rawRequestBody),
-    [adapter, log.rawRequestBody],
+    () => adapter.analyzeRequest(displayLog.rawRequestBody),
+    [adapter, displayLog.rawRequestBody],
   );
   const responseAnalysis = useMemo(
-    () => adapter.analyzeResponse(log.responseText),
-    [adapter, log.responseText],
+    () => adapter.analyzeResponse(displayLog.responseText),
+    [adapter, displayLog.responseText],
   );
   const strippedRequestBody = useMemo(() => {
-    if (!strip || resolvedFormat !== "anthropic" || log.rawRequestBody === null) {
+    if (!strip || resolvedFormat !== "anthropic" || displayLog.rawRequestBody === null) {
       return null;
     }
-    return stripClaudeCodeBillingHeader(log.rawRequestBody).body;
-  }, [log.rawRequestBody, resolvedFormat, strip]);
-  const displayedRequestBody = strippedRequestBody ?? log.rawRequestBody;
+    return stripClaudeCodeBillingHeader(displayLog.rawRequestBody).body;
+  }, [displayLog.rawRequestBody, resolvedFormat, strip]);
+  const displayedRequestBody = strippedRequestBody ?? displayLog.rawRequestBody;
   const requestExpansion = useJsonBulkExpansion(displayedRequestBody);
-  const rawRequestExpansion = useJsonBulkExpansion(log.rawRequestBody);
-  const responseExpansion = useJsonBulkExpansion(log.responseText);
+  const rawRequestExpansion = useJsonBulkExpansion(displayLog.rawRequestBody);
+  const responseExpansion = useJsonBulkExpansion(displayLog.responseText);
 
   // Headers are rendered as a flat list, so we copy them as pretty-printed JSON.
   // Only build the string when there's at least one entry — empty headers would
   // otherwise copy "{}", which is misleading.
   const headersText = useMemo(
     () =>
-      log.headers && Object.keys(log.headers).length > 0
-        ? JSON.stringify(log.headers, null, 2)
+      displayLog.headers && Object.keys(displayLog.headers).length > 0
+        ? JSON.stringify(displayLog.headers, null, 2)
         : null,
-    [log.headers],
+    [displayLog.headers],
   );
   const rawHeadersText = useMemo(
     () =>
-      log.rawHeaders && Object.keys(log.rawHeaders).length > 0
-        ? JSON.stringify(log.rawHeaders, null, 2)
+      displayLog.rawHeaders && Object.keys(displayLog.rawHeaders).length > 0
+        ? JSON.stringify(displayLog.rawHeaders, null, 2)
         : null,
-    [log.rawHeaders],
+    [displayLog.rawHeaders],
   );
 
   // One copy-feedback hook per JSON-bearing tab, so each tab can surface its
   // own Copy button in the header with independent "Copied!" feedback.
   const requestCopy = useCopyFeedback(displayedRequestBody);
-  const rawRequestCopy = useCopyFeedback(log.rawRequestBody);
+  const rawRequestCopy = useCopyFeedback(displayLog.rawRequestBody);
   const headersCopy = useCopyFeedback(headersText);
   const rawHeadersCopy = useCopyFeedback(rawHeadersText);
-  const responseCopy = useCopyFeedback(log.responseText);
+  const responseCopy = useCopyFeedback(displayLog.responseText);
 
   // Per-tab action bundles consumed by the header. The header renders the
   // entry whose key matches `activeTab`. Tabs without an entry (Context,
@@ -214,7 +224,7 @@ export const LogEntry = memo(function ({
           resolvedFormat,
           viewMode,
           strip,
-          log.rawRequestBody !== null,
+          displayLog.rawRequestBody !== null,
         )
           ? { active: requestDiff, onToggle: () => setRequestDiff(!requestDiff) }
           : undefined,
@@ -222,12 +232,12 @@ export const LogEntry = memo(function ({
           onCompareWithPrevious === undefined
             ? undefined
             : () => {
-                onCompareWithPrevious(log);
+                onCompareWithPrevious(displayLog);
               },
       },
       "raw-request": {
         copyLabel: "Copy raw request",
-        copyText: log.rawRequestBody,
+        copyText: displayLog.rawRequestBody,
         copyCopied: rawRequestCopy.copied,
         onCopy: rawRequestCopy.copy,
         expansion: {
@@ -253,7 +263,7 @@ export const LogEntry = memo(function ({
       },
       raw: {
         copyLabel: "Copy response",
-        copyText: log.responseText,
+        copyText: displayLog.responseText,
         copyCopied: responseCopy.copied,
         onCopy: responseCopy.copy,
         expansion: {
@@ -268,14 +278,15 @@ export const LogEntry = memo(function ({
       requestCopy,
       requestExpansion,
       requestDiff,
-      log.rawRequestBody,
+      displayLog,
+      displayLog.rawRequestBody,
       rawRequestCopy,
       rawRequestExpansion,
       headersText,
       headersCopy,
       rawHeadersText,
       rawHeadersCopy,
-      log.responseText,
+      displayLog.responseText,
       responseCopy,
       responseExpansion,
       resolvedFormat,
@@ -295,7 +306,7 @@ export const LogEntry = memo(function ({
     () => parseRequestTools(requestExpansion.parsedData),
     [requestExpansion.parsedData],
   );
-  const warnings = log.warnings ?? [];
+  const warnings = displayLog.warnings ?? [];
   const anatomyPaths = useMemo(() => {
     if (anatomySegments === null) return undefined;
     return new Set(anatomySegments.map((s) => s.path));
@@ -316,6 +327,34 @@ export const LogEntry = memo(function ({
     setExpanded(nextExpanded);
   }, [anatomySegments, expanded]);
 
+  useEffect(() => {
+    setHydratedLog(null);
+    setBodyHydrationState("idle");
+  }, [log.id]);
+
+  useEffect(() => {
+    if (!expanded) return;
+    if (!shouldHydrateLogBody(log)) return;
+    if (hydratedLog !== null || bodyHydrationState !== "idle") return;
+
+    let cancelled = false;
+    setBodyHydrationState("loading");
+    void fetchJson(`/api/logs/${String(log.id)}`, CapturedLogSchema)
+      .then((fullLog) => {
+        if (cancelled) return;
+        setHydratedLog(fullLog);
+        setBodyHydrationState("idle");
+      })
+      .catch(() => {
+        if (cancelled) return;
+        setBodyHydrationState("failed");
+      });
+
+    return () => {
+      cancelled = true;
+    };
+  }, [bodyHydrationState, expanded, hydratedLog, log.bodyContentMode, log.id]);
+
   useEffect(() => {
     const handleLogFocusRequest = (event: Event): void => {
       const request = readLogFocusRequest(event);
@@ -335,7 +374,7 @@ export const LogEntry = memo(function ({
     <TooltipProvider>
       <div className="border border-border rounded-lg mb-1 overflow-hidden">
         <LogEntryHeader
-          log={log}
+          log={displayLog}
           messageCount={requestAnalysis.messageCount}
           toolCount={requestAnalysis.toolCount}
           expanded={expanded}
@@ -373,7 +412,7 @@ export const LogEntry = memo(function ({
                 <TabsContent value="raw-request">
                   {activeTab === "raw-request" && (
                     <div className="px-4 pt-1 pb-3">
-                      {log.rawRequestBody === null ? (
+                      {displayLog.rawRequestBody === null ? (
                         <p className="text-xs text-muted-foreground italic">No request body</p>
                       ) : rawRequestExpansion.parsedData !== null ? (
                         <Suspense fallback={<TabFallback />}>
@@ -385,7 +424,7 @@ export const LogEntry = memo(function ({
                         </Suspense>
                       ) : (
                         <pre className="font-mono text-xs whitespace-pre-wrap break-words">
-                          {log.rawRequestBody}
+                          {displayLog.rawRequestBody}
                         </pre>
                       )}
                     </div>
@@ -396,6 +435,17 @@ export const LogEntry = memo(function ({
               <TabsContent value="request">
                 {activeTab === "request" && (
                   <div className="px-4 pt-1 pb-3">
+                    {bodyHydrationState === "loading" && (
+                      <div className="mb-3 rounded border border-border bg-muted/30 p-3 text-xs text-muted-foreground">
+                        Loading full request and response bodies...
+                      </div>
+                    )}
+                    {bodyHydrationState === "failed" && (
+                      <div className="mb-3 rounded border border-amber-500/30 bg-amber-500/10 p-3 text-xs text-amber-200">
+                        Full request and response bodies could not be loaded. Compact metadata is
+                        still available.
+                      </div>
+                    )}
                     {warnings.length > 0 && (
                       <div className="mb-3 rounded border border-amber-500/30 bg-amber-500/10 p-3 text-xs">
                         <div className="flex items-center gap-2 font-semibold text-amber-300">
@@ -418,7 +468,7 @@ export const LogEntry = memo(function ({
                         the diff or JSON view, depending on toggle state. */}
                     {requestDiff ? (
                       <RequestDiffContent
-                        rawBody={log.rawRequestBody}
+                        rawBody={displayLog.rawRequestBody}
                         displayedBody={displayedRequestBody}
                         emptyLabel="No transformation applied; raw and sent request bodies are identical."
                       />
@@ -453,8 +503,8 @@ export const LogEntry = memo(function ({
                     <Suspense fallback={<TabFallback />}>
                       <LazyRequestAnatomy
                         parsed={requestExpansion.parsedData}
-                        inputTokens={log.inputTokens ?? null}
-                        model={log.model}
+                        inputTokens={displayLog.inputTokens ?? null}
+                        model={displayLog.model}
                         segments={anatomySegments}
                         onSegmentActivate={jumpToAnatomySegment}
                       />
@@ -471,7 +521,8 @@ export const LogEntry = memo(function ({
                       <div className="flex justify-end gap-2 mb-2">
                         {shouldShowHeadersDiffButton(
                           viewMode,
-                          log.rawHeaders !== undefined && Object.keys(log.rawHeaders).length > 0,
+                          displayLog.rawHeaders !== undefined &&
+                            Object.keys(displayLog.rawHeaders).length > 0,
                         ) && (
                           <DiffToggleButton
                             active={headersDiff}
@@ -484,13 +535,13 @@ export const LogEntry = memo(function ({
                       </div>
                       {headersDiff ? (
                         <HeadersDiffContent
-                          rawHeaders={log.rawHeaders}
-                          headers={log.headers}
+                          rawHeaders={displayLog.rawHeaders}
+                          headers={displayLog.headers}
                           emptyLabel="No transformation applied; raw and processed headers are identical."
                         />
-                      ) : log.headers && Object.keys(log.headers).length > 0 ? (
+                      ) : displayLog.headers && Object.keys(displayLog.headers).length > 0 ? (
                         <div className="space-y-1 font-mono text-xs">
-                          {Object.entries(log.headers)
+                          {Object.entries(displayLog.headers)
                             .sort(([a], [b]) => a.localeCompare(b))
                             .map(([key, value]) => (
                               <div key={key} className="flex gap-2">
@@ -516,9 +567,9 @@ export const LogEntry = memo(function ({
                   {activeTab === "raw-headers" && (
                     <div className="px-4 pt-1 pb-3">
                       {/* Copy lives in the log header. */}
-                      {log.rawHeaders && Object.keys(log.rawHeaders).length > 0 ? (
+                      {displayLog.rawHeaders && Object.keys(displayLog.rawHeaders).length > 0 ? (
                         <div className="space-y-1 font-mono text-xs">
-                          {Object.entries(log.rawHeaders)
+                          {Object.entries(displayLog.rawHeaders)
                             .sort(([a], [b]) => a.localeCompare(b))
                             .map(([key, value]) => (
                               <div key={key} className="flex gap-2">
@@ -544,16 +595,16 @@ export const LogEntry = memo(function ({
               <TabsContent value="raw">
                 {activeTab === "raw" && (
                   <div className="px-4 pt-1 pb-3 space-y-3">
-                    {log.error !== undefined && log.error !== null && (
+                    {displayLog.error !== undefined && displayLog.error !== null && (
                       <div className="rounded border border-destructive/50 bg-destructive/10 p-3 text-xs">
                         <div className="font-semibold text-destructive mb-1">SSE Error</div>
-                        <div className="text-muted-foreground font-mono">{log.error}</div>
+                        <div className="text-muted-foreground font-mono">{displayLog.error}</div>
                       </div>
                     )}
-                    {log.responseText !== null ? (
+                    {displayLog.responseText !== null ? (
                       <Suspense fallback={<TabFallback />}>
                         <LazyJsonViewerFromString
-                          text={log.responseText}
+                          text={displayLog.responseText}
                           defaultExpandDepth={0}
                           bulkDepth={responseExpansion.bulkDepth}
                           bulkRevision={responseExpansion.bulkRevision}
@@ -562,11 +613,11 @@ export const LogEntry = memo(function ({
                     ) : (
                       <p className="text-xs text-muted-foreground italic">No response</p>
                     )}
-                    {log.streaming === true && (
+                    {displayLog.streaming === true && (
                       <Suspense fallback={<TabFallback />}>
                         <LazyStreamingChunkSequence
-                          logId={log.id}
-                          truncated={log.streamingChunksPath !== null}
+                          logId={displayLog.id}
+                          truncated={displayLog.streamingChunksPath !== null}
                         />
                       </Suspense>
                     )}
@@ -579,15 +630,15 @@ export const LogEntry = memo(function ({
                   <div className="px-4 pt-1 pb-3">
                     <Suspense fallback={<TabFallback />}>
                       <LazyResponseView
-                        responseText={log.responseText}
-                        responseStatus={log.responseStatus}
-                        streaming={log.streaming}
-                        inputTokens={log.inputTokens}
-                        outputTokens={log.outputTokens}
-                        cacheCreationInputTokens={log.cacheCreationInputTokens}
-                        cacheReadInputTokens={log.cacheReadInputTokens}
+                        responseText={displayLog.responseText}
+                        responseStatus={displayLog.responseStatus}
+                        streaming={displayLog.streaming}
+                        inputTokens={displayLog.inputTokens}
+                        outputTokens={displayLog.outputTokens}
+                        cacheCreationInputTokens={displayLog.cacheCreationInputTokens}
+                        cacheReadInputTokens={displayLog.cacheReadInputTokens}
                         apiFormat={resolvedFormat}
-                        error={log.error}
+                        error={displayLog.error}
                       />
                     </Suspense>
                   </div>
@@ -598,7 +649,7 @@ export const LogEntry = memo(function ({
         )}
       </div>
       <Suspense fallback={null}>
-        <LazyReplayDialog log={log} open={replayOpen} onOpenChange={setReplayOpen} />
+        <LazyReplayDialog log={displayLog} open={replayOpen} onOpenChange={setReplayOpen} />
       </Suspense>
     </TooltipProvider>
   );

package/src/components/ui/dialog.tsx

@@ -38,7 +38,7 @@ function DialogOverlay({
     <DialogPrimitive.Overlay
       data-slot="dialog-overlay"
       className={cn(
-        "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        "fixed inset-0 z-40 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
         className,
       )}
       {...props}

package/src/lib/runContract.ts

@@ -76,6 +76,7 @@ export const EvidenceReportSchema = JenkinsReportSchema;
 export const InspectorRunSchema = z.object({
   id: z.string(),
   sessionId: z.string(),
+  groupId: z.string().nullable().default(null),
   title: z.string(),
   task: z.string().nullable(),
   project: z.string().nullable(),
@@ -92,6 +93,7 @@ export const CreateInspectorRunInputSchema = z
   .object({
     runId: z.string().min(1).optional(),
     sessionId: z.string().min(1).optional(),
+    groupId: z.string().min(1).nullable().optional(),
     title: z.string().min(1).optional(),
     task: z.string().nullable().optional(),
     project: z.string().nullable().optional(),
@@ -104,6 +106,7 @@ export const CreateInspectorRunInputSchema = z
 
 export const UpdateInspectorRunInputSchema = z.object({
   sessionId: z.string().min(1).optional(),
+  groupId: z.string().min(1).nullable().optional(),
   title: z.string().min(1).optional(),
   task: z.string().nullable().optional(),
   project: z.string().nullable().optional(),

package/src/mcp/currentContext.ts

@@ -0,0 +1,65 @@
+import type { JsonValue } from "../contracts";
+
+export type InspectorCurrentContext = {
+  groupId: string | null;
+  runId: string | null;
+  sessionId: string | null;
+  model: string | null;
+  provider: string | null;
+  agent: string | null;
+  project: string | null;
+  task: string | null;
+  metadata: Record<string, JsonValue>;
+  updatedAt: string;
+};
+
+export type InspectorCurrentContextPatch = Partial<
+  Omit<InspectorCurrentContext, "metadata" | "updatedAt">
+> & {
+  metadata?: Record<string, JsonValue>;
+};
+
+function envString(name: string): string | null {
+  const value = process.env[name];
+  if (value === undefined) return null;
+  const trimmed = value.trim();
+  return trimmed.length === 0 ? null : trimmed;
+}
+
+function initialContext(): InspectorCurrentContext {
+  return {
+    groupId: envString("INSPECTOR_GROUP_ID"),
+    runId: envString("INSPECTOR_RUN_ID"),
+    sessionId: envString("INSPECTOR_SESSION_ID"),
+    model: envString("INSPECTOR_MODEL"),
+    provider: envString("INSPECTOR_PROVIDER"),
+    agent: envString("INSPECTOR_AGENT"),
+    project: envString("INSPECTOR_PROJECT"),
+    task: envString("INSPECTOR_TASK"),
+    metadata: {},
+    updatedAt: new Date().toISOString(),
+  };
+}
+
+let currentContext = initialContext();
+
+export function getCurrentContext(): InspectorCurrentContext {
+  return currentContext;
+}
+
+export function setCurrentContext(patch: InspectorCurrentContextPatch): InspectorCurrentContext {
+  currentContext = {
+    ...currentContext,
+    ...patch,
+    metadata:
+      patch.metadata === undefined
+        ? currentContext.metadata
+        : { ...currentContext.metadata, ...patch.metadata },
+    updatedAt: new Date().toISOString(),
+  };
+  return currentContext;
+}
+
+export function _resetCurrentContextForTests(): void {
+  currentContext = initialContext();
+}

package/src/mcp/mode.ts

@@ -0,0 +1,56 @@
+export type McpWriteMode = "enabled" | "readonly";
+
+function parseFlag(value: string | undefined): boolean | null {
+  if (value === undefined) return null;
+  switch (value.trim().toLowerCase()) {
+    case "1":
+    case "true":
+    case "yes":
+    case "on":
+      return true;
+    case "0":
+    case "false":
+    case "no":
+    case "off":
+      return false;
+    default:
+      return null;
+  }
+}
+
+export function isMcpWriteEnabled(): boolean {
+  const readonlyFlag = parseFlag(process.env["AGENT_INSPECTOR_MCP_READONLY"]);
+  if (readonlyFlag === true) return false;
+
+  const writesFlag = parseFlag(process.env["AGENT_INSPECTOR_MCP_WRITES"]);
+  if (writesFlag === false) return false;
+
+  return true;
+}
+
+export function getMcpWriteMode(): McpWriteMode {
+  return isMcpWriteEnabled() ? "enabled" : "readonly";
+}
+
+export function getMcpModeInfo(): {
+  writeMode: McpWriteMode;
+  writesEnabled: boolean;
+  env: {
+    AGENT_INSPECTOR_MCP_READONLY: string | null;
+    AGENT_INSPECTOR_MCP_WRITES: string | null;
+  };
+  note: string;
+} {
+  const writesEnabled = isMcpWriteEnabled();
+  return {
+    writeMode: writesEnabled ? "enabled" : "readonly",
+    writesEnabled,
+    env: {
+      AGENT_INSPECTOR_MCP_READONLY: process.env["AGENT_INSPECTOR_MCP_READONLY"] ?? null,
+      AGENT_INSPECTOR_MCP_WRITES: process.env["AGENT_INSPECTOR_MCP_WRITES"] ?? null,
+    },
+    note: writesEnabled
+      ? "MCP write/action tools are enabled. Set AGENT_INSPECTOR_MCP_READONLY=1 to expose the same catalog while blocking mutations."
+      : "MCP is in readonly mode. Read tools/resources still work, while write/action tools return an isError result.",
+  };
+}