Skip to content

Agent Activity

Codex-style agent progress panel with task checklist, status badges, progress bar, and timestamped tool call log.

CodexWorking…
2m 14s
2/4 tasks50%

Analyze repository structure

Locate failing tests

3 files

Apply fixes to parser

Re-run test suite

14:02:11bashnpm test -- parser
14:02:19read_filesrc/lib/parser.ts
14:02:33edit_file3 hunks applied

Installation

bash
npx @galaxy-stack/nebula-cli@latest add agent-activity

Usage

tsx
import { AgentActivity, type AgentTask } from '@/components/assistant/agent-activity';

const tasks: AgentTask[] = [
  { id: '1', label: 'Analyze repository structure', status: 'completed' },
  { id: '2', label: 'Locate failing tests', status: 'completed', detail: '3 files' },
  { id: '3', label: 'Apply fixes to parser', status: 'running' },
  { id: '4', label: 'Re-run test suite', status: 'pending' },
];

<AgentActivity
  agentName="Codex"
  status="working"
  tasks={tasks}
  elapsedLabel="2m 14s"
  toolEvents={[
    { id: 'e1', name: 'bash', summary: 'npm test -- parser', timestamp: new Date() },
  ]}
/>

Features

  • Task checklist — pending / running / completed / error states
  • Progress bar — percentage + counts in header
  • Status badge — Idle / Thinking / Working
  • Tool call log — timestamped monospace events
  • Elapsed time — display run duration

API Reference

AgentActivityProps

PropTypeDefaultDescription
agentNamestring'Agent'Header title
status'idle' | 'thinking' | 'working''idle'Agent state badge
tasksAgentTask[]requiredTask checklist
toolEventsAgentToolEvent[]?[]Timestamped tool log
elapsedLabelstring?Run duration text

Released under the MIT License.