Agent Run Timeline

1"use client";
2 
3import * as React from "react";
4import { motion, AnimatePresence, type Transition } from "motion/react";
5 
6import { cn } from "@/lib/utils";
7import {
8  getStatusMeta,
9  statusVars,
10  formatTimestamp as defaultFormatTimestamp,
11  useReducedMotion,
12  useDisclosure,
13  useCopy,
14  useControllableState,
15  scrollIntoViewWithin,
16  streamItemVariants,
17  type StatusTone,
18} from "@/lib/motiq";
19 
20/**
21 * AgentRunTimeline — a run-level view of a multi-step agent / automation run.
22 * Where a flat "tool call" list shows *what was invoked*, this shows *how a run
23 * unfolds*: an ordered rail of steps, each with an optional tool call, output,
24 * error, retry attempts, nested sub-stages, and a summary — plus human approval
25 * checkpoints and run-level lifecycle controls (cancel / resume).
26 *
27 * It is strictly a *presentation* component. The application owns the run and
28 * every status; the component never executes an agent, never generates
29 * reasoning, never reveals chain-of-thought, never invents confidence or a
30 * verification result, and never claims a step succeeded unless the supplied
31 * `status` says so. It renders exactly the `run` you give it and reports user
32 * intent back through callbacks.
33 *
34 * Accessibility: run + step status are conveyed with an icon AND a text label
35 * AND a border — never colour alone — so they survive forced-colors. Steps are a
36 * semantic ordered list; each step header is a real disclosure <button> with
37 * `aria-expanded`; Approve / Reject / Retry / Cancel / Resume / Copy are real
38 * <button>s with accessible names. A single polite `role="status"` region
39 * announces lifecycle transitions (run + step) — never on every render. Under
40 * `prefers-reduced-motion` everything renders in its final state with no motion
41 * and no perpetual pulse after a step resolves. Focus is preserved on the
42 * relevant step after Retry / Approve / Reject. Clean-room original.
43 */
44 
45/* -------------------------------------------------------------------------- */
46/* Types                                                                       */
47/* -------------------------------------------------------------------------- */
48 
49export type RunStatus =
50  | "queued"
51  | "running"
52  | "waiting"
53  | "completed"
54  | "failed"
55  | "cancelled"
56  | "paused";
57 
58export type StepStatus =
59  | "pending"
60  | "active"
61  | "completed"
62  | "failed"
63  | "skipped"
64  | "waiting_approval"
65  | "cancelled";
66 
67export interface ToolCall {
68// … truncated