@tonyclaw/agent-inspector 3.0.35 → 3.0.36

package/src/components/ProxyViewer.tsx

@@ -1,6 +1,7 @@
 import {
   type ChangeEvent,
   type JSX,
+  type KeyboardEvent,
   type ReactNode,
   useCallback,
   useEffect,
@@ -115,6 +116,228 @@ function truncateSessionId(id: string): string {
   return `${id.slice(0, 12)}...${id.slice(-12)}`;
 }
 
+type SessionSearchSuggestion = {
+  id: string;
+  label: string;
+  detail: string;
+  kind: "session" | "model" | "all";
+  value: string;
+};
+
+function normalizeSearchQuery(value: string): string {
+  return value.trim().toLowerCase();
+}
+
+function includesSearchText(value: string | null | undefined, query: string): boolean {
+  return value !== null && value !== undefined && value.toLowerCase().includes(query);
+}
+
+function buildSessionSuggestionDetail(sessionId: string, logs: readonly CapturedLog[]): string {
+  const scopedLogs = logs.filter((log) => log.sessionId === sessionId);
+  if (scopedLogs.length === 0) return "Stored session";
+  const models = new Set<string>();
+  const providers = new Set<string>();
+  for (const log of scopedLogs) {
+    if (log.model !== null && log.model !== "") models.add(log.model);
+    if (
+      log.providerName !== null &&
+      log.providerName !== undefined &&
+      log.providerName.trim() !== ""
+    ) {
+      providers.add(log.providerName);
+    }
+  }
+  const modelLabel = models.size === 0 ? "unknown model" : [...models].slice(0, 2).join(", ");
+  const providerLabel =
+    providers.size === 0 ? "unknown provider" : [...providers].slice(0, 2).join(", ");
+  return `${String(scopedLogs.length)} req · ${providerLabel} · ${modelLabel}`;
+}
+
+function sessionMatchesSearchQuery(
+  sessionId: string,
+  logs: readonly CapturedLog[],
+  query: string,
+): boolean {
+  if (includesSearchText(sessionId, query)) return true;
+  return logs.some(
+    (log) =>
+      log.sessionId === sessionId &&
+      (includesSearchText(log.model, query) ||
+        includesSearchText(log.providerName, query) ||
+        includesSearchText(log.path, query)),
+  );
+}
+
+function buildSessionSearchSuggestions({
+  query,
+  sessions,
+  models,
+  logs,
+}: {
+  query: string;
+  sessions: readonly string[];
+  models: readonly string[];
+  logs: readonly CapturedLog[];
+}): SessionSearchSuggestion[] {
+  const normalizedQuery = normalizeSearchQuery(query);
+  const suggestions: SessionSearchSuggestion[] = [];
+
+  if (normalizedQuery === "") {
+    suggestions.push({
+      id: "all",
+      label: "All sessions",
+      detail: `${String(logs.length)} visible requests`,
+      kind: "all",
+      value: "__all__",
+    });
+    for (const session of sessions.slice(0, 5)) {
+      suggestions.push({
+        id: `session-${session}`,
+        label: truncateSessionId(session),
+        detail: buildSessionSuggestionDetail(session, logs),
+        kind: "session",
+        value: session,
+      });
+    }
+    return suggestions;
+  }
+
+  const matchingSessions = sessions.filter((session) =>
+    sessionMatchesSearchQuery(session, logs, normalizedQuery),
+  );
+  for (const session of matchingSessions.slice(0, 5)) {
+    suggestions.push({
+      id: `session-${session}`,
+      label: truncateSessionId(session),
+      detail: buildSessionSuggestionDetail(session, logs),
+      kind: "session",
+      value: session,
+    });
+  }
+
+  const matchingModels = models.filter((model) => includesSearchText(model, normalizedQuery));
+  for (const model of matchingModels.slice(0, 3)) {
+    suggestions.push({
+      id: `model-${model}`,
+      label: model,
+      detail: "Model filter",
+      kind: "model",
+      value: model,
+    });
+  }
+
+  return suggestions.slice(0, 7);
+}
+
+function buildAssistantQuestionFromSearch(query: string, selectedSession: string): string {
+  const trimmed = query.trim();
+  const scope =
+    selectedSession === "__all__" ? "all visible Inspector sessions" : `session ${selectedSession}`;
+  if (trimmed === "") {
+    return `Analyze ${scope}. What failed, slowed down, or deserves attention?`;
+  }
+  return `Search ${scope} for "${trimmed}" and explain the relevant failures, latency, token usage, provider behavior, and evidence.`;
+}
+
+function SessionSearchBox({
+  query,
+  suggestions,
+  selectedSession,
+  selectedModel,
+  onQueryChange,
+  onApplySuggestion,
+  onClear,
+  onAskAssistant,
+}: {
+  query: string;
+  suggestions: readonly SessionSearchSuggestion[];
+  selectedSession: string;
+  selectedModel: string;
+  onQueryChange: (value: string) => void;
+  onApplySuggestion: (suggestion: SessionSearchSuggestion) => void;
+  onClear: () => void;
+  onAskAssistant: () => void;
+}): JSX.Element {
+  const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>): void => {
+    if (event.key !== "Enter") return;
+    const firstSuggestion = suggestions[0];
+    if (firstSuggestion === undefined) return;
+    event.preventDefault();
+    onApplySuggestion(firstSuggestion);
+  };
+
+  return (
+    <div className="rounded-xl bg-black/20 p-2 shadow-[inset_0_0_0_1px_rgba(255,255,255,0.055)]">
+      <div className="relative">
+        <Search className="pointer-events-none absolute left-3 top-1/2 size-3.5 -translate-y-1/2 text-cyan-100/70" />
+        <input
+          type="search"
+          value={query}
+          onChange={(event) => onQueryChange(event.currentTarget.value)}
+          onKeyDown={handleKeyDown}
+          placeholder="Search sessions, models, providers..."
+          className="h-10 w-full rounded-full bg-black/30 px-9 pr-9 text-xs text-foreground outline-none shadow-[inset_0_0_0_1px_rgba(103,232,249,0.13)] transition-colors placeholder:text-muted-foreground hover:bg-black/35 focus-visible:ring-1 focus-visible:ring-cyan-200/70"
+          aria-label="Search sessions and models"
+        />
+        {(query !== "" || selectedSession !== "__all__" || selectedModel !== "__all__") && (
+          <button
+            type="button"
+            onClick={onClear}
+            className="absolute right-2 top-1/2 inline-flex size-6 -translate-y-1/2 items-center justify-center rounded-full text-muted-foreground transition-colors hover:bg-white/[0.07] hover:text-foreground focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-none"
+            aria-label="Clear session search"
+            title="Clear search"
+          >
+            <X className="size-3.5" />
+          </button>
+        )}
+      </div>
+
+      <div className="mt-2 flex flex-wrap gap-1.5">
+        <button
+          type="button"
+          onClick={onAskAssistant}
+          className="inline-flex h-7 items-center rounded-full bg-cyan-400/10 px-2.5 text-[11px] font-medium text-cyan-100 shadow-[inset_0_0_0_1px_rgba(103,232,249,0.14)] transition-colors hover:bg-cyan-400/16"
+        >
+          Ask Assistant
+        </button>
+        {selectedSession !== "__all__" && (
+          <span className="inline-flex h-7 max-w-full items-center rounded-full bg-white/[0.045] px-2.5 font-mono text-[10px] text-muted-foreground">
+            session:{truncateSessionId(selectedSession)}
+          </span>
+        )}
+        {selectedModel !== "__all__" && (
+          <span className="inline-flex h-7 max-w-full items-center rounded-full bg-white/[0.045] px-2.5 text-[10px] text-muted-foreground">
+            model:{selectedModel}
+          </span>
+        )}
+      </div>
+
+      <div className="mt-2 space-y-1">
+        {suggestions.map((suggestion) => (
+          <button
+            key={suggestion.id}
+            type="button"
+            onClick={() => onApplySuggestion(suggestion)}
+            className="grid w-full grid-cols-[minmax(0,1fr)_auto] items-center gap-2 rounded-lg px-2 py-1.5 text-left transition-colors hover:bg-white/[0.045] focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-none"
+          >
+            <span className="min-w-0">
+              <span className="block truncate text-[11px] font-medium text-foreground">
+                {suggestion.label}
+              </span>
+              <span className="block truncate text-[10px] text-muted-foreground">
+                {suggestion.detail}
+              </span>
+            </span>
+            <span className="rounded-full bg-white/[0.045] px-2 py-0.5 text-[9px] uppercase tracking-[0.12em] text-muted-foreground">
+              {suggestion.kind}
+            </span>
+          </button>
+        ))}
+      </div>
+    </div>
+  );
+}
+
 function buildDisplayNumberByLogId(groups: readonly ConversationGroupData[]): Map<number, number> {
   const result = new Map<number, number>();
   for (const group of groups) {
@@ -1333,6 +1556,10 @@ export function ProxyViewer({
   const [detailsPanelStorageLoaded, setDetailsPanelStorageLoaded] = useState(false);
   const [petVisible, setPetVisible] = useState(true);
   const [petVisibilityStorageLoaded, setPetVisibilityStorageLoaded] = useState(false);
+  const [sessionSearchQuery, setSessionSearchQuery] = useState("");
+  const [assistantSuggestedQuestion, setAssistantSuggestedQuestion] = useState<string | undefined>(
+    undefined,
+  );
   const [comparePair, setComparePair] = useState<[CapturedLog, CapturedLog] | null>(null);
   const logListRef = useRef<HTMLDivElement>(null);
   const logListWrapperRef = useRef<HTMLDivElement>(null);
@@ -1572,11 +1799,16 @@ export function ProxyViewer({
       ? "Deletes every stored log, streaming chunk, and session archive entry across all sessions."
       : "Deletes every stored log, streaming chunk, and session archive entry for this session, including history that is not currently loaded.";
   const reloadSessionLabel = logs.length === 0 ? "Load" : "Reload";
-  const sessionInputValue = selectedSession === "__all__" ? "" : selectedSession;
-  const sessionSelectValue =
-    selectedSession === "__all__" || sessions.includes(selectedSession)
-      ? selectedSession
-      : "__typed__";
+  const sessionSearchSuggestions = useMemo(
+    () =>
+      buildSessionSearchSuggestions({
+        query: sessionSearchQuery,
+        sessions,
+        models,
+        logs,
+      }),
+    [logs, models, sessionSearchQuery, sessions],
+  );
   const activeScopeLabel =
     hasSessionContext && sessionContextScope !== null
       ? truncateSessionId(sessionContextScope.label)
@@ -1603,20 +1835,36 @@ export function ProxyViewer({
     },
     [comparisonPredecessors],
   );
-  const handleSessionInputChange = useCallback(
-    (event: ChangeEvent<HTMLInputElement>) => {
-      const value = event.currentTarget.value.trim();
-      onSessionChange(value === "" ? "__all__" : value);
-    },
-    [onSessionChange],
-  );
-  const handleSessionSelectChange = useCallback(
-    (value: string) => {
-      if (value === "__typed__") return;
-      onSessionChange(value);
+  const handleApplySessionSearchSuggestion = useCallback(
+    (suggestion: SessionSearchSuggestion) => {
+      switch (suggestion.kind) {
+        case "all":
+          onSessionChange("__all__");
+          onModelChange("__all__");
+          setSessionSearchQuery("");
+          break;
+        case "session":
+          onSessionChange(suggestion.value);
+          setSessionSearchQuery(suggestion.value);
+          break;
+        case "model":
+          onModelChange(suggestion.value);
+          setSessionSearchQuery(suggestion.value);
+          break;
+      }
     },
-    [onSessionChange],
+    [onModelChange, onSessionChange],
   );
+  const handleClearSessionSearch = useCallback(() => {
+    setSessionSearchQuery("");
+    onSessionChange("__all__");
+    onModelChange("__all__");
+  }, [onModelChange, onSessionChange]);
+  const handleAskAssistantFromSearch = useCallback(() => {
+    setAssistantSuggestedQuestion(
+      buildAssistantQuestionFromSearch(sessionSearchQuery, selectedSession),
+    );
+  }, [selectedSession, sessionSearchQuery]);
   const labSessionId =
     pinnedSessionId !== undefined
       ? pinnedSessionId
@@ -1715,7 +1963,11 @@ export function ProxyViewer({
                 </div>
               </SidebarPanel>
 
-              <PiAgentPanel currentSessionId={labSessionId} logCount={logs.length} />
+              <PiAgentPanel
+                currentSessionId={labSessionId}
+                logCount={logs.length}
+                suggestedQuestion={assistantSuggestedQuestion}
+              />
 
               {hasSessionContext && sessionContextScope !== null && (
                 <SessionContextBar
@@ -1736,72 +1988,22 @@ export function ProxyViewer({
                 )}
 
               <SidebarPanel label="Filters">
-                <div className="space-y-2">
-                  {!hideSessionFilter && (
-                    <>
-                      <div className="relative">
-                        <Search className="pointer-events-none absolute left-2.5 top-1/2 size-3.5 -translate-y-1/2 text-muted-foreground" />
-                        <input
-                          type="search"
-                          value={sessionInputValue}
-                          onChange={handleSessionInputChange}
-                          placeholder="Paste session ID"
-                          className="bg-black/25 hover:bg-white/[0.045] focus-visible:ring-ring h-9 w-full rounded-md px-8 font-mono text-xs text-foreground outline-none shadow-[inset_0_0_0_1px_rgba(255,255,255,0.06)] transition-colors placeholder:font-sans placeholder:text-muted-foreground focus-visible:ring-1"
-                          aria-label="Filter by session ID"
-                          title="Filter by exact session ID"
-                        />
-                        {sessionInputValue !== "" && (
-                          <button
-                            type="button"
-                            onClick={() => onSessionChange("__all__")}
-                            className="absolute right-1.5 top-1/2 inline-flex size-6 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-white/[0.06] hover:text-foreground focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-none"
-                            aria-label="Clear session filter"
-                            title="Clear session filter"
-                          >
-                            <X className="size-3.5" />
-                          </button>
-                        )}
-                      </div>
-                      <Select value={sessionSelectValue} onValueChange={handleSessionSelectChange}>
-                        <SelectTrigger
-                          aria-label="Select a session"
-                          className="bg-black/25 hover:bg-white/[0.045] h-9 w-full border-0 text-xs text-foreground shadow-[inset_0_0_0_1px_rgba(255,255,255,0.06)]"
-                        >
-                          <SelectValue placeholder="All sessions" />
-                        </SelectTrigger>
-                        <SelectContent>
-                          <SelectItem value="__all__">All sessions</SelectItem>
-                          {sessionSelectValue === "__typed__" && (
-                            <SelectItem value="__typed__">
-                              Typed: {truncateSessionId(selectedSession)}
-                            </SelectItem>
-                          )}
-                          {sessions.map((s) => (
-                            <SelectItem key={s} value={s}>
-                              {truncateSessionId(s)}
-                            </SelectItem>
-                          ))}
-                        </SelectContent>
-                      </Select>
-                    </>
-                  )}
-                  <Select value={selectedModel} onValueChange={onModelChange}>
-                    <SelectTrigger
-                      aria-label="Select a model"
-                      className="bg-black/25 hover:bg-white/[0.045] h-9 w-full border-0 text-xs text-foreground shadow-[inset_0_0_0_1px_rgba(255,255,255,0.06)]"
-                    >
-                      <SelectValue placeholder="All models" />
-                    </SelectTrigger>
-                    <SelectContent>
-                      <SelectItem value="__all__">All models</SelectItem>
-                      {models.map((m) => (
-                        <SelectItem key={m} value={m}>
-                          {m}
-                        </SelectItem>
-                      ))}
-                    </SelectContent>
-                  </Select>
-                </div>
+                {hideSessionFilter ? (
+                  <p className="text-[11px] leading-5 text-muted-foreground">
+                    This session is pinned by the current URL.
+                  </p>
+                ) : (
+                  <SessionSearchBox
+                    query={sessionSearchQuery}
+                    suggestions={sessionSearchSuggestions}
+                    selectedSession={selectedSession}
+                    selectedModel={selectedModel}
+                    onQueryChange={setSessionSearchQuery}
+                    onApplySuggestion={handleApplySessionSearchSuggestion}
+                    onClear={handleClearSessionSearch}
+                    onAskAssistant={handleAskAssistantFromSearch}
+                  />
+                )}
               </SidebarPanel>
             </div>
           </aside>

package/src/components/pi-agent/PiAgentPanel.tsx

@@ -1,5 +1,5 @@
 import { BrainCircuit, Loader2, RotateCcw, Send, Sparkles } from "lucide-react";
-import { useMemo, useState, type ChangeEvent, type JSX } from "react";
+import { useEffect, useMemo, useState, type ChangeEvent, type JSX } from "react";
 import {
   buildPiAgentHistory,
   createEmptyPiAgentConversation,
@@ -19,6 +19,7 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from ".
 type PiAgentPanelProps = {
   currentSessionId: string | null;
   logCount: number;
+  suggestedQuestion?: string;
 };
 
 const DEFAULT_QUESTION =
@@ -65,14 +66,39 @@ function nextMessageId(role: "user" | "assistant"): string {
   return `${role}-${String(Date.now())}-${String(Math.random()).slice(2)}`;
 }
 
+function TerminalLabel({
+  label,
+  value,
+  tone = "muted",
+}: {
+  label: string;
+  value?: string;
+  tone?: "cyan" | "muted";
+}): JSX.Element {
+  return (
+    <div className="flex min-w-0 items-center gap-1.5 font-mono text-[10px]">
+      <span className={tone === "cyan" ? "text-cyan-100" : "text-muted-foreground"}>{label}</span>
+      {value !== undefined && (
+        <>
+          <span className="text-muted-foreground/55">:</span>
+          <span className="truncate text-muted-foreground">{value}</span>
+        </>
+      )}
+    </div>
+  );
+}
+
 function MetricStrip({ metrics }: { metrics: readonly PiAgentMetricView[] }): JSX.Element | null {
   if (metrics.length === 0) return null;
   return (
-    <div className="mt-2 grid grid-cols-2 gap-1.5">
+    <div className="grid grid-cols-2 gap-1.5">
       {metrics.slice(0, 8).map((metric) => (
-        <div key={metric.key} className="rounded-sm bg-black/20 px-2 py-1">
-          <div className="truncate text-[9px] uppercase text-muted-foreground">{metric.label}</div>
-          <div className="truncate font-mono text-[11px] text-cyan-50">{metric.value}</div>
+        <div
+          key={metric.key}
+          className="rounded-sm bg-black/25 px-2 py-1 shadow-[inset_2px_0_0_rgba(103,232,249,0.22)]"
+        >
+          <div className="truncate font-mono text-[9px] text-muted-foreground">{metric.label}</div>
+          <div className="truncate font-mono text-[11px] text-cyan-50/95">{metric.value}</div>
         </div>
       ))}
     </div>
@@ -94,7 +120,7 @@ function EvidenceCard({ evidence }: { evidence: PiAgentEvidenceView }): JSX.Elem
       type="button"
       onClick={openLog}
       disabled={evidence.logId === null}
-      className="w-full rounded-sm bg-black/20 px-2 py-2 text-left shadow-[inset_0_0_0_1px_rgba(255,255,255,0.05)] transition-colors hover:bg-black/30 disabled:cursor-default disabled:hover:bg-black/20"
+      className="w-full rounded-sm bg-black/25 px-2 py-2 text-left shadow-[inset_2px_0_0_rgba(103,232,249,0.22),inset_0_0_0_1px_rgba(255,255,255,0.045)] transition-colors hover:bg-black/35 disabled:cursor-default disabled:hover:bg-black/25"
     >
       <div className="flex min-w-0 items-center justify-between gap-2">
         <span className="truncate font-mono text-[10px] text-cyan-100">{title}</span>
@@ -119,21 +145,37 @@ function EvidenceCard({ evidence }: { evidence: PiAgentEvidenceView }): JSX.Elem
 
 function AssistantMessage({ response }: { response: PiAgentResponseView }): JSX.Element {
   return (
-    <div className="rounded-md bg-black/25 p-3 shadow-[inset_0_0_0_1px_rgba(255,255,255,0.05)]">
-      <AnswerMarkdown text={response.answer} />
-      <div className="mt-2 break-words font-mono text-[10px] text-cyan-100/70">
-        {response.providerName} / {response.model} / {response.protocol} /{" "}
-        {String(response.logCount)} matched logs
+    <div className="overflow-hidden rounded-md bg-[#050b12]/85 shadow-[inset_0_0_0_1px_rgba(103,232,249,0.12),0_10px_24px_rgba(0,0,0,0.18)]">
+      <div className="flex min-w-0 items-center justify-between gap-2 border-b border-cyan-100/[0.08] bg-cyan-400/[0.045] px-3 py-2">
+        <TerminalLabel label="assistant@inspector" value="output" tone="cyan" />
+        <span className="shrink-0 font-mono text-[9px] text-muted-foreground">
+          {String(response.logCount)} logs
+        </span>
       </div>
-      <MetricStrip metrics={response.summaryMetrics} />
-      <MetricStrip metrics={response.queryMetrics} />
-      {response.evidence.length > 0 && (
-        <div className="mt-2 space-y-1.5">
-          {response.evidence.slice(0, 6).map((evidence) => (
-            <EvidenceCard key={`${evidence.source}-${evidence.id}`} evidence={evidence} />
-          ))}
+      <div className="space-y-3 p-3">
+        <div className="rounded-sm bg-black/20 px-2.5 py-2 text-xs leading-5 shadow-[inset_2px_0_0_rgba(103,232,249,0.28)]">
+          <AnswerMarkdown text={response.answer} />
         </div>
-      )}
+        <div className="grid gap-1.5 rounded-sm bg-black/20 px-2 py-1.5">
+          <TerminalLabel label="provider" value={response.providerName} />
+          <TerminalLabel label="model" value={response.model} />
+          <TerminalLabel label="protocol" value={response.protocol} />
+        </div>
+        {(response.summaryMetrics.length > 0 || response.queryMetrics.length > 0) && (
+          <div className="space-y-1.5">
+            <TerminalLabel label="metrics" tone="cyan" />
+            <MetricStrip metrics={[...response.summaryMetrics, ...response.queryMetrics]} />
+          </div>
+        )}
+        {response.evidence.length > 0 && (
+          <div className="space-y-1.5">
+            <TerminalLabel label="evidence" value="click to inspect source log" tone="cyan" />
+            {response.evidence.slice(0, 6).map((evidence) => (
+              <EvidenceCard key={`${evidence.source}-${evidence.id}`} evidence={evidence} />
+            ))}
+          </div>
+        )}
+      </div>
     </div>
   );
 }
@@ -143,13 +185,23 @@ function ConversationMessage({ message }: { message: PiAgentConversationMessage
     return <AssistantMessage response={message.response} />;
   }
   return (
-    <div className="rounded-md bg-cyan-400/10 px-3 py-2 text-xs leading-5 text-cyan-50">
-      {message.content}
+    <div className="overflow-hidden rounded-md bg-black/25 shadow-[inset_0_0_0_1px_rgba(255,255,255,0.055)]">
+      <div className="border-b border-white/[0.06] px-3 py-1.5">
+        <TerminalLabel label="user@inspector" value="query" tone="cyan" />
+      </div>
+      <div className="px-3 py-2 font-mono text-[11px] leading-5 text-cyan-50">
+        <span className="select-none text-cyan-100/60">&gt; </span>
+        {message.content}
+      </div>
     </div>
   );
 }
 
-export function PiAgentPanel({ currentSessionId, logCount }: PiAgentPanelProps): JSX.Element {
+export function PiAgentPanel({
+  currentSessionId,
+  logCount,
+  suggestedQuestion,
+}: PiAgentPanelProps): JSX.Element {
   const { providers } = useProviders();
   const piProviders = useMemo(
     () => sortProviderBySource(providers.filter(providerSupportsPiAgent)),
@@ -168,6 +220,11 @@ export function PiAgentPanel({ currentSessionId, logCount }: PiAgentPanelProps):
   const question = conversation.question;
   const canAsk = question.trim() !== "" && piProviders.length > 0 && !loading;
 
+  useEffect(() => {
+    if (suggestedQuestion === undefined || suggestedQuestion.trim() === "") return;
+    setConversation((current) => ({ ...current, question: suggestedQuestion, error: null }));
+  }, [suggestedQuestion]);
+
   const handleQuestionChange = (event: ChangeEvent<HTMLTextAreaElement>): void => {
     setConversation((current) => ({ ...current, question: event.currentTarget.value }));
   };
@@ -226,7 +283,7 @@ export function PiAgentPanel({ currentSessionId, logCount }: PiAgentPanelProps):
         if (!response.ok) {
           setConversation((current) => ({
             ...current,
-            error: `Pi Agent failed: HTTP ${String(response.status)} ${raw}`,
+            error: `Inspector Assistant failed: HTTP ${String(response.status)} ${raw}`,
           }));
           return;
         }
@@ -235,7 +292,7 @@ export function PiAgentPanel({ currentSessionId, logCount }: PiAgentPanelProps):
         if (normalized === null) {
           setConversation((current) => ({
             ...current,
-            error: "Pi Agent returned an unexpected response.",
+            error: "Inspector Assistant returned an unexpected response.",
           }));
           return;
         }
@@ -255,7 +312,7 @@ export function PiAgentPanel({ currentSessionId, logCount }: PiAgentPanelProps):
       .catch((err: unknown) => {
         setConversation((current) => ({
           ...current,
-          error: err instanceof Error ? err.message : "Pi Agent request failed.",
+          error: err instanceof Error ? err.message : "Inspector Assistant request failed.",
         }));
       })
       .finally(() => {
@@ -268,7 +325,7 @@ export function PiAgentPanel({ currentSessionId, logCount }: PiAgentPanelProps):
       <div className="flex items-center gap-2">
         <BrainCircuit className="size-4 text-cyan-200" />
         <div className="min-w-0 flex-1">
-          <div className="text-xs font-semibold text-foreground">Pi Agent</div>
+          <div className="text-xs font-semibold text-foreground">Inspector Assistant</div>
           <div className="text-[11px] text-muted-foreground">
             {currentSessionId === null ? "Ask saved Inspector data" : "Ask this session"}
           </div>
@@ -286,9 +343,8 @@ export function PiAgentPanel({ currentSessionId, logCount }: PiAgentPanelProps):
       {conversation.messages.length === 0 && (
         <div className="mt-3 rounded-md bg-black/[0.18] px-3 py-2 shadow-[inset_0_0_0_1px_rgba(255,255,255,0.045)]">
           <p className="text-[11px] leading-5 text-muted-foreground">
-            ChatBI for Inspector memory: Pi searches saved traffic, sessions, tools, Provider
-            signals, alerts, runs, groups, and knowledge candidates, then answers with linked
-            evidence.
+            Ask your Inspector memory across saved traffic, sessions, tools, Provider signals,
+            alerts, runs, groups, and knowledge candidates. Answers include linked evidence.
           </p>
           <div className="mt-2 grid gap-1.5">
             {PI_AGENT_SCOPE_PILLS.map((pill) => (
@@ -371,7 +427,7 @@ export function PiAgentPanel({ currentSessionId, logCount }: PiAgentPanelProps):
         value={question}
         onChange={handleQuestionChange}
         className="mt-3 min-h-20 w-full resize-y rounded-md bg-black/25 px-3 py-2 text-xs leading-5 text-foreground outline-none shadow-[inset_0_0_0_1px_rgba(255,255,255,0.06)] transition-colors placeholder:text-muted-foreground focus-visible:ring-1 focus-visible:ring-ring"
-        placeholder="Ask Pi Agent across saved Inspector data..."
+        placeholder="Ask across saved Inspector data..."
       />
 
       <button
@@ -381,7 +437,7 @@ export function PiAgentPanel({ currentSessionId, logCount }: PiAgentPanelProps):
         className="mt-2 inline-flex h-8 w-full items-center justify-center gap-2 rounded-md bg-cyan-400/12 px-3 text-xs font-medium text-cyan-100 shadow-[inset_0_0_0_1px_rgba(103,232,249,0.18)] transition-colors hover:bg-cyan-400/18 disabled:cursor-not-allowed disabled:opacity-50"
       >
         {loading ? <Loader2 className="size-3.5 animate-spin" /> : <Send className="size-3.5" />}
-        <span>{loading ? "Thinking..." : "Ask Pi"}</span>
+        <span>{loading ? "Thinking..." : "Ask Assistant"}</span>
       </button>
 
       {conversation.error !== null && (
@@ -389,12 +445,13 @@ export function PiAgentPanel({ currentSessionId, logCount }: PiAgentPanelProps):
       )}
       {piProviders.length === 0 && (
         <p className="mt-2 text-[11px] leading-5 text-muted-foreground">
-          Configure a Provider with Responses, Chat, or Anthropic URL to enable Pi Agent.
+          Configure a Provider with Responses, Chat, or Anthropic URL to enable Inspector Assistant.
         </p>
       )}
       {logCount === 0 && (
         <p className="mt-2 text-[11px] leading-5 text-muted-foreground">
-          No logs are visible in this scope yet; Pi Agent can still answer Provider setup questions.
+          No logs are visible in this scope yet; Inspector Assistant can still answer Provider setup
+          questions.
         </p>
       )}
     </section>