feat: search api

Author: fayekelmith

mcp/benchmark/src/api.ts

@@ -1,4 +1,4 @@
-import type { ProductionRun, Annotation, AnnotationMarker } from "./types";
+import type { ProductionRun, SearchResult, Annotation, AnnotationMarker } from "./types";
 
 const BASE = "/api";
 
@@ -18,6 +18,7 @@ export const api = {
   sessions: {
     list: () => req<ProductionRun[]>("/sessions"),
     get: (id: string) => req<ProductionRun>(`/sessions/${id}`),
+    search: (q: string) => req<SearchResult[]>(`/sessions/search?q=${encodeURIComponent(q)}`),
     annotate: (
       id: string,
       body: { target: "session" | "tool_call"; target_id?: string; marker: AnnotationMarker; note?: string; author?: string },

mcp/benchmark/src/components/Sessions.tsx

@@ -26,6 +26,8 @@ export function Sessions() {
         setRangeFilter={state.setRangeFilter}
         setDayFilter={state.setDayFilter}
         clearFilters={state.clearFilters}
+        searching={state.searching}
+        searchMatchMap={state.searchMatchMap}
       />
       <SessionDetail
         selected={state.selected}

mcp/benchmark/src/components/sessions/SessionSidebar.tsx

@@ -3,7 +3,7 @@ import { shortId } from "../ui";
 import { SourceBadge } from "./SessionBadges";
 import { card, muted } from "./styles";
 import { formatNumber, formatSourceLabel } from "../../utils";
-import type { ProductionRun } from "../../types";
+import type { ProductionRun, SearchMatchInfo } from "../../types";
 
 interface SessionSidebarProps {
   loading: boolean;
@@ -25,6 +25,8 @@ interface SessionSidebarProps {
   setRangeFilter: (v: "24h" | "7d" | "30d" | "all") => void;
   setDayFilter: (v: string) => void;
   clearFilters: () => void;
+  searching: boolean;
+  searchMatchMap: Map<string, SearchMatchInfo>;
 }
 
 export function SessionSidebar({
@@ -47,6 +49,8 @@ export function SessionSidebar({
   setRangeFilter,
   setDayFilter,
   clearFilters,
+  searching,
+  searchMatchMap,
 }: SessionSidebarProps) {
   const navigate = useNavigate();
   const location = useLocation();
@@ -155,11 +159,16 @@ export function SessionSidebar({
             }}
           >
             <input
-              placeholder={"Search id, repo, model, prompt\u2026"}
+              placeholder={"Search traces, repos, models\u2026"}
               value={quickSearch}
               onChange={(e) => setQuickSearch(e.target.value)}
               style={inputStyle}
             />
+            {searching && (
+              <p style={{ ...muted, fontSize: "10px", margin: 0, textAlign: "center" }}>
+                Searching traces\u2026
+              </p>
+            )}
             <input
               placeholder={"Filter by repo\u2026"}
               value={repoSearch}
@@ -329,6 +338,25 @@ export function SessionSidebar({
                       {run.user_prompt_preview}
                     </p>
                   )}
+                  {searchMatchMap.has(run.id) && (() => {
+                    const m = searchMatchMap.get(run.id)!;
+                    return (
+                      <p
+                        style={{
+                          fontSize: "10px",
+                          color: "#22d3ee",
+                          margin: "3px 0 0 0",
+                          overflow: "hidden",
+                          textOverflow: "ellipsis",
+                          whiteSpace: "nowrap",
+                        }}
+                      >
+                        {m.first_match_at_call === 0
+                          ? "match in prompt"
+                          : `match at call #${m.first_match_at_call}/${m.total_tool_calls}`}
+                      </p>
+                    );
+                  })()}
                 </button>
               ))
             )}

mcp/benchmark/src/hooks/useSessionsState.ts

@@ -1,4 +1,4 @@
-import { useState, useEffect, useCallback, useMemo } from "react";
+import { useState, useEffect, useCallback, useMemo, useRef } from "react";
 import { useSearchParams } from "react-router-dom";
 import { toast } from "sonner";
 import { api } from "../api";
@@ -10,7 +10,7 @@ import {
 import { parseTrace } from "../trace/parse";
 import { analyzeTrace } from "../trace/analyze";
 import type { ParsedTrace, TraceAnalysis, IssueKind } from "../trace/types";
-import type { ProductionRun, TokenUsage } from "../types";
+import type { ProductionRun, TokenUsage, SearchResult, SearchMatchInfo } from "../types";
 import type { Annotation, AnnotationMarker } from "../components/Annotations";
 
 export interface SessionsState {
@@ -43,6 +43,8 @@ export interface SessionsState {
     toolCallId?: string,
   ) => void;
   handleTurnToggle: (turnId: string) => void;
+  searching: boolean;
+  searchMatchMap: Map<string, SearchMatchInfo>;
   setQuickSearch: (v: string) => void;
   setRepoSearch: (v: string) => void;
   setSourceFilter: (v: string) => void;
@@ -69,6 +71,9 @@ export function useSessionsState(): SessionsState {
   const [showSessionAnnotationForm, setShowSessionAnnotationForm] =
     useState(false);
   const [loading, setLoading] = useState(true);
+  const [searching, setSearching] = useState(false);
+  const [searchResults, setSearchResults] = useState<SearchResult[] | null>(null);
+  const searchTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const [quickSearch, setQuickSearch] = useState(
     searchParams.get("q") || "",
   );
@@ -190,6 +195,30 @@ export function useSessionsState(): SessionsState {
     setSearchParams(nextParams, { replace: true });
   }, [dayFilter, quickSearch, repoSearch, rangeFilter, setSearchParams, sourceFilter]);
 
+  useEffect(() => {
+    if (searchTimerRef.current) clearTimeout(searchTimerRef.current);
+    if (!quickSearch || quickSearch.trim().length < 2) {
+      setSearchResults(null);
+      setSearching(false);
+      return;
+    }
+    setSearching(true);
+    searchTimerRef.current = setTimeout(async () => {
+      try {
+        const results = await api.sessions.search(quickSearch.trim());
+        setSearchResults(results);
+      } catch (e: any) {
+        toast.error(e.message);
+        setSearchResults([]);
+      } finally {
+        setSearching(false);
+      }
+    }, 300);
+    return () => {
+      if (searchTimerRef.current) clearTimeout(searchTimerRef.current);
+    };
+  }, [quickSearch]);
+
   useEffect(() => {
     if (parsed.turns.length === 0) {
       setOpenTurnId(null);
@@ -202,7 +231,7 @@ export function useSessionsState(): SessionsState {
 
   const filteredRuns = useMemo(
     () =>
-      runs.filter((r) => {
+      (searchResults ?? runs).filter((r) => {
         if (sourceFilter !== "all" && (r.source || "unknown") !== sourceFilter)
           return false;
         if (
@@ -218,21 +247,16 @@ export function useSessionsState(): SessionsState {
         const rangeStart = getRangeStart(rangeFilter);
         if (rangeStart && new Date(r.timestamp).getTime() < rangeStart)
           return false;
-        if (quickSearch) {
-          const q = quickSearch.toLowerCase();
-          const matches =
-            r.id.toLowerCase().includes(q) ||
-            r.repo.toLowerCase().includes(q) ||
-            (r.source || "").toLowerCase().includes(q) ||
-            (r.model || "").toLowerCase().includes(q) ||
-            (r.user_prompt_preview || "").toLowerCase().includes(q);
-          if (!matches) return false;
-        }
         return true;
       }),
-    [runs, dayFilter, quickSearch, repoSearch, rangeFilter, sourceFilter],
+    [runs, searchResults, dayFilter, repoSearch, rangeFilter, sourceFilter],
   );
 
+  const searchMatchMap = useMemo(() => {
+    if (!searchResults) return new Map<string, SearchMatchInfo>();
+    return new Map(searchResults.map((r) => [r.id, r.search_match]));
+  }, [searchResults]);
+
   const clearFilters = () => {
     setQuickSearch("");
     setRepoSearch("");
@@ -262,6 +286,8 @@ export function useSessionsState(): SessionsState {
     selectedUsage,
     prompt,
     answer,
+    searching,
+    searchMatchMap,
     showSessionAnnotationForm,
     load,
     loadDetail,

mcp/benchmark/src/types.ts

@@ -79,3 +79,13 @@ export interface ProductionRun {
   annotations?: Annotation[];
   trace?: unknown;
 }
+
+export interface SearchMatchInfo {
+  first_match_at_call: number;
+  total_tool_calls: number;
+  match_context: string;
+}
+
+export interface SearchResult extends ProductionRun {
+  search_match: SearchMatchInfo;
+}

mcp/src/benchmark/router.ts

@@ -1,11 +1,12 @@
 import { Router } from "express";
-import { list_sessions, get_session, session_stats, add_annotation } from "./sessions.js";
+import { list_sessions, get_session, session_stats, add_annotation, search_sessions } from "./sessions.js";
 
 export function benchmarkRouter(): Router {
   const router = Router();
 
   // Sessions
   router.get("/sessions", list_sessions);
+  router.get("/sessions/search", search_sessions);
   router.get("/sessions/stats", session_stats);
   router.get("/sessions/:id", get_session);
   router.post("/sessions/:id/annotations", add_annotation);