@tonyclaw/agent-inspector 3.0.12 → 3.0.14

package/src/components/ecosystem/AgentLabDialog.tsx

@@ -6,6 +6,7 @@ import {
   Copy,
   Download,
   FlaskConical,
+  History,
   Loader2,
   Network,
   PackageCheck,
@@ -18,8 +19,10 @@ import useSWR from "swr";
 import {
   EcosystemPackagesResponseSchema,
   EcosystemTaskResponseSchema,
+  EcosystemTasksResponseSchema,
   type EcosystemPackage,
   type EcosystemPackageState,
+  type EcosystemRecipe,
   type EcosystemRunnerPreset,
   type EcosystemTask,
   type EcosystemTaskAction,
@@ -101,6 +104,15 @@ async function fetchEcosystemTask(url: string) {
   );
 }
 
+async function fetchEcosystemTasks(url: string) {
+  return fetchJson(
+    url,
+    EcosystemTasksResponseSchema,
+    undefined,
+    (response) => `Failed to load ecosystem tasks: ${String(response.status)}`,
+  );
+}
+
 async function startEcosystemTask(
   packageId: string,
   action: EcosystemTaskAction,
@@ -114,6 +126,16 @@ async function startEcosystemTask(
   return response.task;
 }
 
+async function startEcosystemRecipe(recipeId: string): Promise<EcosystemTask> {
+  const response = await fetchJson(
+    `/api/ecosystem/recipes/${encodeURIComponent(recipeId)}/run`,
+    EcosystemTaskResponseSchema,
+    { method: "POST" },
+    (result) => `Failed to start ecosystem recipe: ${String(result.status)}`,
+  );
+  return response.task;
+}
+
 function stateLabel(state: EcosystemPackageState): string {
   switch (state) {
     case "installed":
@@ -164,6 +186,8 @@ function taskActionLabel(action: EcosystemTaskAction): string {
       return "Help";
     case "runner-presets":
       return "Presets";
+    case "recipe":
+      return "Recipe";
   }
 }
 
@@ -180,6 +204,18 @@ function taskStatusLabel(task: EcosystemTask): string {
   }
 }
 
+function taskStatusClassName(status: EcosystemTask["status"]): string {
+  switch (status) {
+    case "queued":
+    case "running":
+      return "border-cyan-300/20 bg-cyan-300/8 text-cyan-100";
+    case "succeeded":
+      return "border-emerald-400/20 bg-emerald-400/8 text-emerald-100";
+    case "failed":
+      return "border-red-400/20 bg-red-400/8 text-red-100";
+  }
+}
+
 function packagePrimaryAction(pkg: EcosystemPackage): EcosystemTaskAction | null {
   switch (pkg.state) {
     case "available":
@@ -292,15 +328,7 @@ function TaskConsole({ task }: { task: EcosystemTask | null }): JSX.Element | nu
             <div className="break-all font-mono text-[11px] text-white/35">{task.command}</div>
           </div>
         </div>
-        <Badge
-          variant="outline"
-          className={cn(
-            "shrink-0",
-            task.status === "failed"
-              ? "border-red-400/20 bg-red-400/8 text-red-100"
-              : "border-cyan-300/20 bg-cyan-300/8 text-cyan-100",
-          )}
-        >
+        <Badge variant="outline" className={cn("shrink-0", taskStatusClassName(task.status))}>
           {task.status}
         </Badge>
       </div>
@@ -372,10 +400,110 @@ function RunnerPresetCard({ preset }: { preset: EcosystemRunnerPreset }): JSX.El
   );
 }
 
+function RecipeCard({
+  recipe,
+  copied,
+  running,
+  onCopy,
+  onRun,
+}: {
+  recipe: EcosystemRecipe;
+  copied: boolean;
+  running: boolean;
+  onCopy: (recipe: EcosystemRecipe) => void;
+  onRun: (recipe: EcosystemRecipe) => void;
+}): JSX.Element {
+  return (
+    <div className="rounded-lg bg-white/[0.025] p-3 shadow-[inset_0_0_0_1px_rgba(255,255,255,0.055)]">
+      <div className="flex flex-wrap items-start justify-between gap-3">
+        <div className="min-w-0">
+          <div className="flex min-w-0 items-start gap-2">
+            <FlaskConical className="size-4 shrink-0 text-cyan-200/75" />
+            <div className="text-sm font-semibold leading-snug">{recipe.title}</div>
+          </div>
+          <div className="mt-1 text-xs leading-5 text-muted-foreground">{recipe.description}</div>
+        </div>
+        <Badge variant="outline" className="border-white/10 bg-white/[0.04] text-white/55">
+          {recipe.runnable ? recipe.stage : "Template"}
+        </Badge>
+      </div>
+      <div className="mt-3 rounded-md bg-black/20 p-2 font-mono text-[11px] leading-5 text-white/50 shadow-[inset_0_0_0_1px_rgba(255,255,255,0.045)]">
+        {recipe.command}
+      </div>
+      <div className="mt-3 flex items-center justify-between gap-2">
+        <span className="rounded bg-white/[0.035] px-2 py-1 font-mono text-[11px] text-white/35">
+          {recipe.packageId}
+        </span>
+        <div className="flex items-center gap-2">
+          <Button type="button" size="sm" variant="outline" onClick={() => onCopy(recipe)}>
+            {copied ? <Check className="size-3.5" /> : <Copy className="size-3.5" />}
+            {copied ? "Copied" : "Copy"}
+          </Button>
+          {recipe.runnable && (
+            <Button
+              type="button"
+              size="sm"
+              variant="secondary"
+              disabled={running}
+              onClick={() => onRun(recipe)}
+            >
+              {running ? (
+                <Loader2 className="size-3.5 animate-spin" />
+              ) : (
+                <Rocket className="size-3.5" />
+              )}
+              {running ? "Running" : "Run"}
+            </Button>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function RecentTaskRow({
+  task,
+  selected,
+  onSelect,
+}: {
+  task: EcosystemTask;
+  selected: boolean;
+  onSelect: (task: EcosystemTask) => void;
+}): JSX.Element {
+  const label = task.recipeId ?? taskActionLabel(task.action);
+  return (
+    <div className="flex items-center justify-between gap-3 rounded-md bg-white/[0.025] px-3 py-2 shadow-[inset_0_0_0_1px_rgba(255,255,255,0.045)]">
+      <div className="min-w-0">
+        <div className="flex min-w-0 items-center gap-2">
+          <History className="size-3.5 shrink-0 text-white/40" />
+          <div className="truncate text-xs font-semibold text-white/75">{label}</div>
+          <Badge variant="outline" className={cn("shrink-0", taskStatusClassName(task.status))}>
+            {task.status}
+          </Badge>
+        </div>
+        <div className="mt-1 flex min-w-0 flex-wrap items-center gap-2 font-mono text-[10px] text-white/35">
+          <span>{task.packageId}</span>
+          <span>{new Date(task.createdAt).toLocaleTimeString()}</span>
+          {task.exitCode !== null && <span>exit {String(task.exitCode)}</span>}
+        </div>
+      </div>
+      <Button
+        type="button"
+        size="sm"
+        variant={selected ? "secondary" : "outline"}
+        onClick={() => onSelect(task)}
+      >
+        {selected ? "Open" : "View"}
+      </Button>
+    </div>
+  );
+}
+
 export function AgentLabDialog({ currentSessionId, logCount }: AgentLabDialogProps): JSX.Element {
   const [open, setOpen] = useState(false);
   const [copied, setCopied] = useState(false);
   const [copiedPresets, setCopiedPresets] = useState(false);
+  const [copiedRecipeId, setCopiedRecipeId] = useState<string | null>(null);
   const [activeTaskId, setActiveTaskId] = useState<string | null>(null);
   const [taskError, setTaskError] = useState<string | null>(null);
   const response = useSWR("/api/ecosystem/packages", fetchEcosystemPackages, {
@@ -395,8 +523,14 @@ export function AgentLabDialog({ currentSessionId, logCount }: AgentLabDialogPro
       revalidateOnFocus: false,
     },
   );
+  const tasksResponse = useSWR(open ? "/api/ecosystem/tasks" : null, fetchEcosystemTasks, {
+    refreshInterval: 2500,
+    revalidateOnFocus: false,
+  });
   const packages = response.data?.packages ?? [];
   const runnerPresets = response.data?.runnerPresets ?? [];
+  const recipes = response.data?.recipes ?? [];
+  const recentTasks = (tasksResponse.data?.tasks ?? []).slice(0, 6);
   const installedCount = useMemo(
     () =>
       packages.filter((pkg) => pkg.state === "installed" || pkg.state === "update-available")
@@ -418,14 +552,33 @@ export function AgentLabDialog({ currentSessionId, logCount }: AgentLabDialogPro
       window.setTimeout(() => setCopiedPresets(false), 1200);
     });
   };
+  const copyRecipeCommand = (recipe: EcosystemRecipe): void => {
+    void copyTextToClipboard(recipe.command).then(() => {
+      setCopiedRecipeId(recipe.id);
+      window.setTimeout(() => setCopiedRecipeId(null), 1200);
+    });
+  };
+  const runRecipe = (recipe: EcosystemRecipe): void => {
+    setTaskError(null);
+    void startEcosystemRecipe(recipe.id)
+      .then((task) => {
+        setActiveTaskId(task.id);
+        void activeTaskResponse.mutate({ task }, { revalidate: true });
+        void tasksResponse.mutate();
+      })
+      .catch((error: unknown) => {
+        setTaskError(error instanceof Error ? error.message : "Failed to start ecosystem recipe");
+      });
+  };
 
   const activeTask = activeTaskResponse.data?.task ?? null;
 
   useEffect(() => {
     if (activeTask === null) return;
+    void tasksResponse.mutate();
     if (activeTask.status !== "succeeded") return;
     void response.mutate();
-  }, [activeTask, response]);
+  }, [activeTask, response, tasksResponse]);
 
   const handleStartTask = (packageId: string, action: EcosystemTaskAction): void => {
     setTaskError(null);
@@ -433,6 +586,7 @@ export function AgentLabDialog({ currentSessionId, logCount }: AgentLabDialogPro
       .then((task) => {
         setActiveTaskId(task.id);
         void activeTaskResponse.mutate({ task }, { revalidate: true });
+        void tasksResponse.mutate();
       })
       .catch((error: unknown) => {
         setTaskError(error instanceof Error ? error.message : "Failed to start ecosystem task");
@@ -514,6 +668,40 @@ export function AgentLabDialog({ currentSessionId, logCount }: AgentLabDialogPro
             </section>
           </div>
 
+          <section className="mt-3">
+            <div className="mb-2 flex items-center justify-between gap-3">
+              <div className="text-sm font-semibold">Lab recipes</div>
+              <div className="hidden items-center gap-1 font-mono text-[11px] text-muted-foreground sm:flex">
+                <Sparkles className="size-3.5" />
+                copy-ready workflows
+              </div>
+            </div>
+            <div className="grid gap-3 md:grid-cols-2">
+              {recipes.map((recipe) => (
+                <RecipeCard
+                  key={recipe.id}
+                  recipe={recipe}
+                  copied={copiedRecipeId === recipe.id}
+                  running={
+                    activeTask !== null &&
+                    activeTask.recipeId === recipe.id &&
+                    (activeTask.status === "queued" || activeTask.status === "running")
+                  }
+                  onCopy={copyRecipeCommand}
+                  onRun={runRecipe}
+                />
+              ))}
+              {response.isLoading &&
+                recipes.length === 0 &&
+                [0, 1].map((index) => (
+                  <div
+                    key={index}
+                    className="h-40 animate-pulse rounded-lg bg-white/[0.025] shadow-[inset_0_0_0_1px_rgba(255,255,255,0.055)]"
+                  />
+                ))}
+            </div>
+          </section>
+
           <section className="mt-3">
             <div className="mb-2 flex items-center justify-between gap-3">
               <div className="text-sm font-semibold">Runner presets</div>
@@ -574,6 +762,29 @@ export function AgentLabDialog({ currentSessionId, logCount }: AgentLabDialogPro
               {taskError}
             </div>
           )}
+          {recentTasks.length > 0 && (
+            <section className="mt-3">
+              <div className="mb-2 flex items-center justify-between gap-3">
+                <div className="text-sm font-semibold">Recent Lab runs</div>
+                <div className="hidden font-mono text-[11px] text-muted-foreground sm:block">
+                  last {String(recentTasks.length)}
+                </div>
+              </div>
+              <div className="grid gap-2 md:grid-cols-2">
+                {recentTasks.map((task) => (
+                  <RecentTaskRow
+                    key={task.id}
+                    task={task}
+                    selected={activeTaskId === task.id}
+                    onSelect={(selectedTask) => {
+                      setActiveTaskId(selectedTask.id);
+                      void activeTaskResponse.mutate({ task: selectedTask }, { revalidate: true });
+                    }}
+                  />
+                ))}
+              </div>
+            </section>
+          )}
           <TaskConsole task={activeTask} />
         </div>
       </DialogContent>

package/src/lib/ecosystemContract.ts

@@ -35,13 +35,31 @@ export const EcosystemRunnerPresetSchema = z.object({
   agentsDir: z.string(),
 });
 
+export const EcosystemRecipeSchema = z.object({
+  id: z.string(),
+  title: z.string(),
+  stage: z.string(),
+  packageId: z.string(),
+  description: z.string(),
+  command: z.string(),
+  requiresSession: z.boolean(),
+  runnable: z.boolean(),
+});
+
 export const EcosystemPackagesResponseSchema = z.object({
   checkedAt: z.string(),
   packages: z.array(EcosystemPackageSchema),
   runnerPresets: z.array(EcosystemRunnerPresetSchema),
+  recipes: z.array(EcosystemRecipeSchema),
 });
 
-export const EcosystemTaskActionSchema = z.enum(["install", "upgrade", "help", "runner-presets"]);
+export const EcosystemTaskActionSchema = z.enum([
+  "install",
+  "upgrade",
+  "help",
+  "runner-presets",
+  "recipe",
+]);
 
 export const EcosystemTaskStatusSchema = z.enum(["queued", "running", "succeeded", "failed"]);
 
@@ -49,6 +67,7 @@ export const EcosystemTaskSchema = z.object({
   id: z.string(),
   packageId: z.string(),
   npmName: z.string(),
+  recipeId: z.string().nullable().default(null),
   action: EcosystemTaskActionSchema,
   status: EcosystemTaskStatusSchema,
   command: z.string(),
@@ -71,6 +90,7 @@ export const EcosystemTasksResponseSchema = z.object({
 export type EcosystemPackageState = z.infer<typeof EcosystemPackageStateSchema>;
 export type EcosystemPackage = z.infer<typeof EcosystemPackageSchema>;
 export type EcosystemRunnerPreset = z.infer<typeof EcosystemRunnerPresetSchema>;
+export type EcosystemRecipe = z.infer<typeof EcosystemRecipeSchema>;
 export type EcosystemPackagesResponse = z.infer<typeof EcosystemPackagesResponseSchema>;
 export type EcosystemTaskAction = z.infer<typeof EcosystemTaskActionSchema>;
 export type EcosystemTaskStatus = z.infer<typeof EcosystemTaskStatusSchema>;

package/src/proxy/ecosystemRegistry.ts

@@ -5,6 +5,7 @@ import packageJson from "../../package.json";
 import type {
   EcosystemPackage,
   EcosystemPackageState,
+  EcosystemRecipe,
   EcosystemRunnerPreset,
 } from "../lib/ecosystemContract";
 import { npmSpawnCommand } from "./platformCommands";
@@ -106,6 +107,53 @@ export const RUNNER_PRESETS: EcosystemRunnerPreset[] = [
   },
 ];
 
+export const LAB_RECIPES: EcosystemRecipe[] = [
+  {
+    id: "inspector-mcp-smoke",
+    title: "Inspector MCP smoke",
+    stage: "Validate",
+    packageId: "eval-harness",
+    description: "Check that the running Inspector exposes the MCP tools eval-harness expects.",
+    command: "npx @tonyclaw/eval-harness check-inspector-mcp",
+    requiresSession: false,
+    runnable: true,
+  },
+  {
+    id: "session-evidence-smoke",
+    title: "Session evidence smoke",
+    stage: "Capture",
+    packageId: "eval-harness",
+    description:
+      "Create a lightweight Inspector evidence run from the latest captured logs or selected session.",
+    command:
+      'npx @tonyclaw/eval-harness inspector-smoke --title "TonyClaw Lab smoke" --latest-log-limit 5',
+    requiresSession: false,
+    runnable: true,
+  },
+  {
+    id: "runner-presets-json",
+    title: "Runner presets JSON",
+    stage: "Connect",
+    packageId: "eval-harness",
+    description: "Export runner adapter baselines as machine-readable JSON for CI or docs.",
+    command: "npx @tonyclaw/eval-harness runner-presets --format json",
+    requiresSession: false,
+    runnable: true,
+  },
+  {
+    id: "local-smoke-batch",
+    title: "Local smoke batch",
+    stage: "Evaluate",
+    packageId: "eval-harness",
+    description:
+      "Run one short local Jenkins-like evaluation using explicit project/work directories.",
+    command:
+      "npx @tonyclaw/eval-harness run-once --smoke --project-source <project> --work-source <work> --count 1 --parallel 1",
+    requiresSession: false,
+    runnable: false,
+  },
+];
+
 const NPM_TIMEOUT_MS = 4000;
 
 function runNpm(args: readonly string[]): Promise<NpmResult> {
@@ -242,3 +290,7 @@ export async function listEcosystemPackages(): Promise<EcosystemPackage[]> {
 export function findEcosystemPackage(packageId: string): PackageDefinition | null {
   return ECOSYSTEM_PACKAGES.find((definition) => definition.id === packageId) ?? null;
 }
+
+export function findEcosystemRecipe(recipeId: string): EcosystemRecipe | null {
+  return LAB_RECIPES.find((recipe) => recipe.id === recipeId) ?? null;
+}

package/src/proxy/ecosystemTasks.ts

@@ -6,13 +6,14 @@ import type {
   EcosystemTaskAction,
   EcosystemTaskStatus,
 } from "../lib/ecosystemContract";
-import { findEcosystemPackage } from "./ecosystemRegistry";
+import { findEcosystemPackage, findEcosystemRecipe } from "./ecosystemRegistry";
 import { npmCommand, npmSpawnCommand } from "./platformCommands";
 
 const MAX_TASKS = 50;
 const OUTPUT_LIMIT = 40_000;
 const INSTALL_TIMEOUT_MS = 120_000;
 const HELP_TIMEOUT_MS = 30_000;
+const RECIPE_TIMEOUT_MS = 90_000;
 
 const tasks = new Map<string, EcosystemTask>();
 
@@ -47,7 +48,32 @@ function packageActionArgs(action: EcosystemTaskAction, npmName: string): string
       return ["exec", "--yes", npmName, "--", "--help"];
     case "runner-presets":
       return ["exec", "--yes", "@tonyclaw/eval-harness", "--", "runner-presets"];
+    case "recipe":
+      return ["exec", "--yes", npmName, "--", "--help"];
+  }
+}
+
+function recipeActionArgs(recipeId: string): string[] | null {
+  const execPrefix = ["exec", "--yes", "@tonyclaw/eval-harness", "--"];
+  switch (recipeId) {
+    case "inspector-mcp-smoke":
+      return [...execPrefix, "check-inspector-mcp"];
+    case "session-evidence-smoke":
+      return [
+        ...execPrefix,
+        "inspector-smoke",
+        "--title",
+        "TonyClaw Lab smoke",
+        "--latest-log-limit",
+        "5",
+      ];
+    case "runner-presets-json":
+      return [...execPrefix, "runner-presets", "--format", "json"];
+    case "local-smoke-batch":
+      return null;
   }
+
+  return null;
 }
 
 function packageActionTimeout(action: EcosystemTaskAction): number {
@@ -58,6 +84,8 @@ function packageActionTimeout(action: EcosystemTaskAction): number {
     case "help":
     case "runner-presets":
       return HELP_TIMEOUT_MS;
+    case "recipe":
+      return RECIPE_TIMEOUT_MS;
   }
 }
 
@@ -101,6 +129,7 @@ export function startEcosystemTask(
     id: randomUUID(),
     packageId: definition.id,
     npmName: definition.npmName,
+    recipeId: null,
     action,
     status: "queued",
     command: taskCommand(args),
@@ -151,3 +180,68 @@ export function startEcosystemTask(
 
   return task;
 }
+
+export function startEcosystemRecipeTask(recipeId: string): EcosystemTask | null {
+  const recipe = findEcosystemRecipe(recipeId);
+  if (recipe === null) return null;
+  if (!recipe.runnable) return null;
+  const definition = findEcosystemPackage(recipe.packageId);
+  if (definition === null) return null;
+  const args = recipeActionArgs(recipe.id);
+  if (args === null) return null;
+
+  const task: EcosystemTask = {
+    id: randomUUID(),
+    packageId: definition.id,
+    npmName: definition.npmName,
+    recipeId: recipe.id,
+    action: "recipe",
+    status: "queued",
+    command: taskCommand(args),
+    output: "",
+    createdAt: nowIso(),
+    startedAt: null,
+    finishedAt: null,
+    exitCode: null,
+    error: null,
+  };
+  rememberTask(task);
+
+  const spawnCommand = npmSpawnCommand(args);
+  const child = spawn(spawnCommand.command, spawnCommand.args, {
+    windowsHide: true,
+    shell: false,
+    stdio: ["ignore", "pipe", "pipe"],
+  });
+  const timeout = setTimeout(() => {
+    child.kill();
+    appendTaskOutput(task, `\nTimed out after ${String(RECIPE_TIMEOUT_MS / 1000)}s.\n`);
+  }, RECIPE_TIMEOUT_MS);
+
+  task.status = "running";
+  task.startedAt = nowIso();
+  appendTaskOutput(task, `$ ${task.command}\n`);
+
+  child.stdout.on("data", (chunk: Buffer) => {
+    appendTaskOutput(task, chunk.toString("utf8"));
+  });
+  child.stderr.on("data", (chunk: Buffer) => {
+    appendTaskOutput(task, chunk.toString("utf8"));
+  });
+  child.on("error", (error) => {
+    clearTimeout(timeout);
+    appendTaskOutput(task, `\n${error.message}\n`);
+    completeTask(task, "failed", null, error.message);
+  });
+  child.on("close", (code) => {
+    clearTimeout(timeout);
+    if (task.status === "failed") return;
+    if (code === 0) {
+      completeTask(task, "succeeded", code, null);
+      return;
+    }
+    completeTask(task, "failed", code, `Command exited with code ${String(code ?? "unknown")}`);
+  });
+
+  return task;
+}

package/src/routes/api/ecosystem.packages.ts

@@ -1,5 +1,5 @@
 import { createFileRoute } from "@tanstack/react-router";
-import { listEcosystemPackages, RUNNER_PRESETS } from "../../proxy/ecosystemRegistry";
+import { LAB_RECIPES, listEcosystemPackages, RUNNER_PRESETS } from "../../proxy/ecosystemRegistry";
 
 export const Route = createFileRoute("/api/ecosystem/packages")({
   server: {
@@ -9,6 +9,7 @@ export const Route = createFileRoute("/api/ecosystem/packages")({
           checkedAt: new Date().toISOString(),
           packages: await listEcosystemPackages(),
           runnerPresets: RUNNER_PRESETS,
+          recipes: LAB_RECIPES,
         });
       },
     },

package/src/routes/api/ecosystem.recipes.$recipeId.run.ts

@@ -0,0 +1,16 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { startEcosystemRecipeTask } from "../../proxy/ecosystemTasks";
+
+export const Route = createFileRoute("/api/ecosystem/recipes/$recipeId/run")({
+  server: {
+    handlers: {
+      POST: ({ params }: { params: { recipeId: string } }) => {
+        const task = startEcosystemRecipeTask(params.recipeId);
+        if (task === null) {
+          return Response.json({ error: "Unknown ecosystem recipe" }, { status: 404 });
+        }
+        return Response.json({ task });
+      },
+    },
+  },
+});