Task Pipeline

Visual flow of all agent tasks — delegation chains, real-time status, and multi-agent handoffs on an interactive canvas.

Overview

The Task Pipeline page provides a full-screen, zoomable, pannable canvas that renders every task as a node in a left-to-right flow graph. Tasks are grouped into delegation chains — horizontal rows where each step represents a handoff between agents. Orphan tasks (not part of any chain) are displayed in a separate row.

Key capabilities include:

• Horizontal left-to-right flow visualization of task chains
• Animated SVG edges showing active task flow
• Real-time updates via Server-Sent Events (SSE)
• Customer context badges on chain origins
• Circular flow detection for revision/review loops
• Inline expanded chain flowcharts below clicked nodes
• Full task detail modal with activity log, progress, and cost tracking

How It Works

When you open the Task Pipeline, the system:

1. Fetches tasks — Loads up to 200 tasks from the /task-pipeline endpoint along with aggregate statistics.
2. Groups by chain — Tasks with a shared chainId are grouped into horizontal rows, sorted by chainSeq. Single-task "chains" become orphans.
3. Lays out nodes — Each chain is a horizontal row of 200×52px nodes spaced 32px apart. Chains stack vertically with 12px gaps.
4. Draws edges — SVG cubic Bézier curves connect consecutive nodes. Active edges get animated dash overlays. Circular (revision) flows use arc paths.
5. Streams updates — An SSE connection at /task-pipeline/stream pushes task updates in real-time. Stats refresh every 15 seconds.

Key Concepts

Delegation Chain

A chain is a sequence of tasks linked by a shared chainId. When a manager agent delegates work to a junior agent, both tasks share the same chain. Each task has a chainSeq (sequence number) determining its position in the flow.

Chain Flow Types

Circular Flows

When a task returns to an agent who already appeared earlier in the chain (e.g., Agent A → B → A for revision), the edge renders as an upward arc to visually distinguish the loop from forward flow.

Canvas Interactions

Task Statuses & Priority

Statuses

Priority Levels

Delegation Chains

The expanded chain view (shown when clicking a node) renders a person-centric flow:

1. Creator — The person or system that originated the chain
2. Agent steps — Each agent in the chain, with status, duration, and progress
3. Terminal node — Final status (completed ✓, failed ✗, or cancelled ⊘)

Arrows between steps are labeled with the delegation type (delegation, review, revision, etc.) and colored accordingly.

Source Badges

Each task can have a source indicating where it originated:

Metrics Bar

Below the toolbar, a compact metrics bar shows real-time stats:

• Today's counters: Done, Active, New, Failed
• All-time: Total tasks, average duration, total tokens used, total cost
• Top agents: Up to 3 agents with their completed/active task counts

Task Detail Modal

Double-clicking a task node opens a detailed modal containing:

• Status, priority, source, chain ID, and delegation type badges
• Customer context card (name, email, company, channel, new/returning)
• Full task description
• Progress bar (for in-progress tasks)
• Assignment details: assigned to, created by, creation time, duration, model, tokens/cost
• Delegation chain timeline (visual horizontal flow of all chain steps)
• Paginated activity log with search and type filter
• Error display (for failed tasks)
• Cancel button (for active tasks)

Toolbar & Filters

The toolbar provides:

• Filter buttons: Active (default), All, Completed, Failed
• Status legend: Color dots for Active, Done, Failed
• Zoom controls: +, −, percentage display, Fit button
• Refresh: Manual data reload
• Live indicator: Green pulsing dot confirming SSE connection

Real-Time Updates (SSE)

The pipeline maintains a persistent Server-Sent Events connection to /api/engine/task-pipeline/stream. Events include:

• init — Bulk task load with initial stats
• task update — Individual task state changes (new, status change, progress)

On every task event, stats are also refreshed. A 15-second interval additionally polls stats as a fallback.

Configuration & Setup

The Task Pipeline works out of the box once agents are configured and tasks are being created. No additional configuration is required.

Organization Filtering

When an organization is selected via the org switcher, the pipeline filters tasks to only show those belonging to agents in that organization.

Agent Avatars

Agent avatars are resolved from config.identity.avatar, config.avatar, or config.persona.avatar. If none is set, a colored initial circle is displayed.

API Reference

Best Practices

• Use chain IDs: Always link related tasks with a shared chainId so the pipeline can visualize the full delegation flow.
• Set delegation types: Mark each handoff with the correct type (delegation, review, revision, escalation, return) for clear visual labeling.
• Add customer context: Include customerContext on chain-origin tasks so support workflows display customer badges.
• Monitor the metrics bar: Watch the Active count and average duration to spot bottlenecks early.
• Use the "Active" filter: Focus on in-progress and pending tasks during daily operations. Switch to "All" for auditing.

Troubleshooting

Related Pages