Agent activity

import { useState } from "react"
import { AgentActivity, type ActivityStep } from "@/components/ui/agent-activity"

const runSteps: ActivityStep[] = [
  { id: "s1", label: "Searching for “sortable table accessibility”", status: "running", icon: "search" },
  { id: "s2", label: "Reading 3 pages", status: "running", icon: "read" },
  { id: "s3", label: "Writing the answer", status: "running" },
];

export function AgentActivityDemo() {
  const [done] = useState(2);
  const [open, setOpen] = useState(false);
  const steps = runSteps.map<ActivityStep>((s, i) => ({ ...s, status: i < done ? "done" : i === done ? "running" : "running", duration: i < done ? `${[1.4, 1.6, 1.4][i]} s` : undefined, detail: i === 1 && i < done ? "example.com, example.org, example.net" : undefined }));
  const visible = steps.slice(0, Math.min(3, done + 1)).map((s, i) => (i < done ? { ...s, status: "done" as const } : s));
  return (
    <AgentActivity steps={visible} open={open} onOpenChange={setOpen} summary={done >= 3 ? "Worked for 4.4 s · 3 steps" : undefined} />
  );
}