OpenViSTAI · Agents · Blockchain · Crypto
Menu
Agent Evaluation & Observability

Agent Flow

Agent Flow is a developer tool that visualizes Claude Code and Codex orchestration as interactive graphs, with views for tool calls, branching, timelines and transcripts.

Independent OpenViST project profile, based on linked sources.

Agent Flow — OpenViST project profile in Agent Evaluation & Observability.
OpenViST project illustration. See the linked sources for product details.
Understand the project

Practical overview

When it fits

Use Agent Flow while an agent session is running to observe its execution, or afterward to review a JSONL event log and trace tool-call sequences.

Who it is for

  • Developers debugging Claude Code or Codex agent behavior.
  • Teams reviewing concurrent agent sessions and their coordination.
  • Developers studying how agents interpret prompts and spend time during execution.

Documented uses

  • Trace the sequence of decisions and tool calls that led to an unexpected result.
  • Inspect agent branches, return flows and subagent coordination.
  • Review execution timelines, transcripts and file-attention heatmaps.
  • Compare concurrent sessions or watch activity from a JSONL event log.
Before you choose

Requirements & limits

  • The README documents Claude Code and Codex as supported runtimes; additional orchestration systems are not demonstrated.
  • The VS Code extension requires a VS Code-compatible IDE version 1.85 or later.
  • The source-based setup lists Node.js 20+, pnpm and the Claude Code CLI.
  • Opt-out anonymous telemetry is enabled by default only in the published npx binary; the README says the VS Code extension and pnpm run dev emit none.

Check current requirements in the official documentation. Source-based guidance does not mean OpenViST has run or independently tested this project.

Source-based practical guide

Start the browser visualizer with npx

Open the browser visualizer and stream activity from a Claude Code session.

Before you start

  • Node.js 20 or later
  • Claude Code CLI

Steps

  1. Run the command below.

    Documented command
    npx agent-flow-app
  2. Start a Claude Code session in another terminal.

Expected outcome

The visualizer opens in a browser and receives events from the Claude Code session.

Guide limitations

  • This quick-start path is documented for Claude Code; the README's stated event-streaming instruction here is to start a Claude Code session.
Source-based practical guide

Set up the standalone web app from source

Install the project and start its web app and event relay.

Before you start

  • Node.js 20 or later
  • pnpm
  • Claude Code CLI

Steps

  1. Clone the repository and change into its directory.

  2. Run pnpm i.

  3. Run pnpm run setup to configure Claude Code hooks.

  4. Run pnpm run dev, then open http://localhost:3000 and start a Claude Code session in another terminal.

Expected outcome

The local web app and event relay start, with Claude Code events streamed to the browser.

Guide limitations

  • This documented setup configures Claude Code hooks; it does not describe a source-based setup procedure for Codex.
Evidence and transparency

Sources & review

Source record details
Source availability
Active
Sources checked
11 October 2026
Original website title
patoles/agent-flow · Official homepage title · retained in its source language