Tool Run

1"use client";
2 
3import { useId, useState, type ReactNode } from "react";
4import {
5  AlertTriangleIcon,
6  CheckIcon,
7  ChevronDownIcon,
8  Loader2Icon,
9  RotateCcwIcon,
10  XIcon,
11} from "lucide-react";
12import { AnimatePresence, motion, useReducedMotion } from "motion/react";
13 
14import {
15  ApprovalRequest,
16  type ApprovalRequestProps,
17} from "@/components/trovecn/ai-workbench/approval-request";
18import { Button } from "@/components/ui/button";
19import { spring } from "@/lib/springs";
20import { cn } from "@/lib/utils";
21 
22export type ToolRunStatus =
23  | "queued"
24  | "running"
25  | "needs-approval"
26  | "success"
27  | "error"
28  | "cancelled";
29 
30export interface ToolRunDetail {
31  /** Compact key:value call arguments, rendered in mono. */
32  args?: readonly ReactNode[];
33  /** The call's result, once it has one — body copy, not a key:value list. */
34  result?: ReactNode;
35}
36 
37export interface ToolRunProps {
38  /** Stable identifier for the call. Not rendered — for the caller's own keys/lookups. */
39  id: string;
40  /** The tool being called, e.g. "search_docs" or "Read file". */
41  tool: ReactNode;
42  /** A short call summary next to the tool name — an argument preview, not the full arguments. */
43  summary?: ReactNode;
44  /** Caller-owned source of truth. This component renders it; it never sets it itself. */
45  status: ToolRunStatus;
46  detail?: ToolRunDetail;
47  /** Trailing metadata — elapsed time, a timestamp. */
48  meta?: ReactNode;
49  errorMessage?: ReactNode;
50  /** A rejected retry re-renders the same anchored error — never a toast. */
51  onRetry?: () => void | Promise<void>;
52  /**
53   * Required while status is "needs-approval" — the props ToolRun forwards
54   * to an embedded ApprovalRequest, whose card body replaces ToolRun's own
55   * for the duration of the pause. `variant` and `className` are owned by
56   * ToolRun and can't be overridden here.
57   */
58  approval?: Omit<ApprovalRequestProps, "variant" | "className">;
59  className?: string;
60}
61 
62type StatusTone = "muted" | "success" | "destructive";
63 
64const STATUS_COPY: Record<
65  Exclude<ToolRunStatus, "needs-approval">,
66  { label: string; tone: StatusTone }
67> = {
68  queued: { label: "Queued", tone: "muted" },
69  running: { label: "Running", tone: "muted" },
70  success: { label: "Done", tone: "success" },
71  error: { label: "Failed", tone: "destructive" },
72  cancelled: { label: "Cancelled", tone: "muted" },
73};
74 
75function ToolRunStatusIcon({
76  status,
77  reduceMotion,
78}: {
79  status: ToolRunStatus;
80  reduceMotion: boolean;
81}) {
82// … truncated