Routes
/pipelines— the saved-pipelines list/pipelines/new— empty builder canvas/pipelines/:graphId/edit— edit an existing pipeline/pipelines/:graphId— live monitor for a running execution/pipelines/history— list of past executions/pipelines/history/:graphId— detail view of a single past run
Under the hood
The canvas is a custom Lit component (ic-graph-canvas) rendering SVG by hand — there’s no React, React Flow, or D3 dependency. It supports:
- Snap-to-grid (24 px)
- Pan + zoom (range 0.1x to 4x)
- Cycle detection on drag-connect (rejects edges that would form a loop)
- Auto-layout via a topological sort (Kahn’s algorithm)
- Graph validation against the same Zod schema the daemon uses
graph.save; runs through graph.execute(graphId, variables?); live updates through SSE events graph:node:status and graph:progress. Saved graphs are stored on disk so they survive restarts.
For the underlying domain model (node types, barrier modes, retry policy, context modes) see Execution Graphs.
What You See
The Pipelines area has three sub-views: a list of all your pipelines, a visual builder for creating and editing them, and a monitor for watching them run.Pipeline List
The Pipeline List is a searchable table of all your pipelines. Each row shows:- Status dot — a colored indicator showing the pipeline’s state:
- Gray = draft (not yet run)
- Cyan = currently running
- Green = completed successfully
- Red = failed
- Orange = cancelled
- Name — the pipeline’s label
- Node count — how many steps the pipeline contains
- Last executed — when the pipeline was last run
- Actions — buttons to Edit, Run, Clone, or Delete the pipeline
Pipeline Builder
The Pipeline Builder is a visual editor where you design workflows using boxes and arrows. Each box represents a step (an agent performing a task), and arrows show the flow between steps. The builder includes:- Toolbar — buttons across the top for common actions: add a new node, delete selected items, toggle snap-to-grid alignment, auto-arrange the layout, validate the pipeline, save your work, and run the pipeline
- Canvas — the main workspace where you see your pipeline as a diagram. You can drag boxes to rearrange them, drag arrows between boxes to create connections, and pan or zoom to navigate larger pipelines
- Node editor panel — when you click a box on the canvas, a configuration panel appears on the side where you can set the node type (regular, debate, vote, refine, collaborate, approval-gate, or map-reduce), configure type-specific settings, assign an agent, write the task prompt, and choose failure behavior
- Template picker — when creating a new pipeline, a dialog offers pre-built workflow templates to start from. Templates give you a working pattern that you can customize
- Variable prompt — if your pipeline uses placeholders (like a recipient name or topic), a dialog asks you to fill them in before running
- Validation overlay — after clicking Validate, any errors or warnings appear as badges on the affected nodes so you can fix issues before running
Pipeline Monitor
The Pipeline Monitor is a read-only view that shows a running pipeline’s progress in real time:- Color-coded nodes — each box on the canvas changes color as execution progresses:
- Green = completed successfully
- Cyan = currently running
- Gray = waiting to start
- Red = failed
- Status bar — at the top, showing the overall pipeline status and counts of completed, running, pending, and failed nodes
- Node detail panel — click any box on the canvas to see its output text, any error messages, and how long it took to run
- Execution timeline — a horizontal bar chart at the bottom showing when each step started and finished, like a project timeline. This helps you understand the overall timing and find bottlenecks
- Minimap — a small overview in the corner for navigating large pipelines. Drag within the minimap to move the main view
- Cancel button — stops the pipeline execution. Running steps will be terminated
Building a Pipeline
Start a new pipeline
Click New Pipeline from the list view, or open an existing pipeline and click Edit. For a new pipeline, the template picker appears — choose a template to start from a pre-built pattern, or dismiss it to start with a blank canvas.
Add nodes to the canvas
Use the toolbar’s add button or press the N key to place a new step on the canvas. Each node is a box representing one agent task.
Connect nodes with arrows
Drag from one box’s output port to another box’s input port to create a connection. The arrow shows that the first step must complete before the second one begins.
Configure each node
Click a box on the canvas to open the node editor panel. Choose a node type from the type picker (leave as “Regular” for single-agent tasks, or select a type like “Debate” or “Vote” for multi-agent patterns). Configure the type-specific settings, select which agent should handle the step, write the task prompt, and set failure behavior (stop the whole pipeline, skip and continue, or retry).
Validate the pipeline
Click Validate in the toolbar. The validator checks for common mistakes like disconnected nodes, missing agent assignments, invalid type configurations, or circular dependencies. Any issues appear as badges on the affected nodes.
Worked example: a 3-node research pipeline
End-to-end walkthrough of building a “research a topic, vote on conclusions, summarize” pipeline by drag-and-drop.Open the builder
Sidebar > Pipelines > New Pipeline. Dismiss the template picker (we want to learn the pattern from scratch).
Add three nodes
Press N three times. Three boxes labeled “Untitled Node 1, 2, 3” appear stacked at the canvas origin. Drag them into a left-to-right row.
Wire them in series
Drag from the right port of node 1 to the left port of node 2. Drag from the right port of node 2 to the left port of node 3. Two arrows now flow left-to-right.
Configure node 1: research
Click node 1. In the editor panel: Type = Agent, Agent =
research-bot, Task = Research the topic ${TOPIC} and produce a 5-bullet briefing.. Save the panel.Configure node 2: vote
Click node 2. Type = Vote, Voters =
[research-bot, analyst-bot, critic-bot], Verdict format = YES or NO with one-sentence justification, Task = Read the briefing in the upstream output. Vote whether the topic warrants a follow-up deep dive.. Save.Configure node 3: summarize
Click node 3. Type = Agent, Agent =
analyst-bot, Task = Combine the briefing and the votes into a one-paragraph executive summary.. Save.Validate
Click Validate. All three nodes show green checkmarks: connected, agents assigned, no cycles.
Save and run
Click Save, name the pipeline “Topic Research Vote”, click Run. The variable dialog asks for
TOPIC — enter Q3 product roadmap. The view switches to the Monitor.Monitoring a Running Pipeline
Open the running pipeline
From the Pipeline List, click a pipeline with a cyan (running) status dot. The Monitor view opens automatically.
Watch nodes complete
As each step finishes, its box on the canvas turns green. The status bar at the top updates with running counts.
Inspect a node's results
Click any box on the canvas to open the detail panel. For completed nodes, you can see the full output text. For failed nodes, the error message explains what went wrong.
Check the timeline
The execution timeline at the bottom shows a horizontal bar for each step, indicating when it started and finished. This helps you spot slow steps or understand parallel execution.
Node Types
When configuring a node in the editor panel, the Type dropdown lets you choose what kind of operation the node performs. Each type changes the configuration fields shown below the dropdown. Typed nodes display a badge next to the agent ID on the canvas (for example, “Debate” or “Vote”) so you can identify node types at a glance. The following types are available:Agent
Run a single sub-agent with explicit driver configuration. Selecting Agent shows fields for:- Agent — the agent ID to run this node (required)
- Model — optional model override for this node
- Max steps — optional limit on agentic steps
Debate
Multi-round adversarial debate between agents. Selecting Debate shows fields for:- Agents — multi-select list of agent IDs to participate (minimum 2)
- Rounds — number of debate rounds (1-5, defaults to 2)
- Synthesizer — optional agent that writes a final synthesis after all rounds
Vote
Parallel independent voting by multiple agents. Selecting Vote shows fields for:- Voters — multi-select list of agent IDs to vote (minimum 2)
- Prompt suffix — optional text appended to each voter’s prompt
- Verdict format — optional format hint for voter responses (e.g., “YES or NO with justification”)
Refine
Sequential refinement chain through reviewers. Selecting Refine shows fields for:- Reviewers — ordered list of agent IDs (minimum 2). Each reviewer receives the output of the previous reviewer and improves upon it.
Collaborate
Sequential multi-perspective collaboration. Selecting Collaborate shows fields for:- Agents — ordered list of agent IDs to contribute (minimum 2). Each agent builds on the accumulated work from prior agents.
- Rounds — number of collaboration rounds (1-3, defaults to 1)
Approval Gate
Human approval checkpoint with timeout. Selecting Approval Gate shows fields for:- Message — optional prompt sent to the chat channel asking for approval
- Timeout (minutes) — how long to wait for a response (1-1440 minutes, defaults to 60)
Map-Reduce
Parallel map tasks then single reduce. Selecting Map-Reduce shows fields for:- Mappers — list of mapper entries, each with an agent ID and optional task suffix (minimum 2). All mappers run in parallel.
- Reducer — the agent ID that receives all mapper outputs and produces a single combined result
- Reducer prompt — optional instructions for the reducer agent
Template Gallery
When creating a new pipeline, a template picker dialog offers pre-built workflow patterns. Each template creates a working pipeline with properly connected nodes that you can customize. Templates are a fast way to set up common patterns without building from scratch. The available templates are:| Template | Pattern | Nodes | Description |
|---|---|---|---|
| Linear Chain | Sequential | 3 | Each step depends on the previous one |
| Fan-out Fan-in | Parallel + merge | 4 | Parallel workers with a single merge point |
| Parallel Tracks | Side-by-side | 4 | Two independent streams running side by side |
| Independent Workers | Unconnected | 3 | Unconnected nodes that run in parallel |
| Diamond | Fork + converge | 4 | Fork into two paths, then converge at the end |
| Debate Pipeline | Typed (debate) | 3 | Research, multi-agent debate, then synthesize conclusions |
| Vote Pipeline | Typed (vote) | 3 | Research a topic, have multiple agents vote, then summarize results |
| Refine Chain | Typed (refine) | 3 | Draft content, refine through sequential reviewers, then publish |
| Map-Reduce | Typed (map-reduce) | 3 | Split work across parallel mappers, then reduce into a single output |
| Approval Gate | Typed (approval-gate) | 3 | Prepare an action, wait for human approval, then execute |
| Blank Canvas | Empty | 0 | Start from scratch with an empty graph |
Variable Prompts
Templates and saved pipelines can include variables written as${VARIABLE_NAME} in task text. When you run a pipeline that uses variables, a dialog appears asking you to fill in each value before execution begins. For example, a template with ${TOPIC} in the task text will prompt you to enter the topic before running.
Pipeline History
Route:/pipelines/history
The Pipeline History view shows a sortable grid-table of all past pipeline executions stored on disk. This is your record of every pipeline run, whether it completed successfully, failed, or was cancelled.
History List
Each row in the history table shows:| Column | What It Shows |
|---|---|
| Status dot | Colored indicator: green (completed) or red (failed) |
| Name | The pipeline’s label |
| Node count | How many steps the pipeline contained |
| Date | When the pipeline was last executed (shown as relative time) |
| Actions | View (opens detail) and Delete (with confirmation) |
/pipelines/history.
Pipeline History Detail
Route:/pipelines/history/:graphId
Click any row in the history list to open the detail view for that specific run. The detail page shows:
- Metadata header — pipeline name, overall status with colored dot, completion time, and node count
- Node accordion — each pipeline node is shown as an expandable section. Click to reveal:
- The node’s output text, rendered as markdown with syntax highlighting for code blocks
- Status indicator (completed or failed)
- Any error messages for failed nodes
- Expandable artifacts section if the node produced additional outputs
- Breadcrumb navigation — Pipelines > History > [pipeline name] for easy navigation
- Delete action — remove the historical run record (with confirmation dialog)
History vs Live Monitor
The Pipeline History Detail is a read-only historical view of a completed execution. It differs from the live Pipeline Monitor in several ways:| Aspect | Live Monitor | History Detail |
|---|---|---|
| Data source | Real-time SSE events | Stored run records on disk |
| Updates | Nodes change color as they execute | Static snapshot of final state |
| Canvas | Interactive graph visualization | Node accordion list (no canvas) |
| Timeline | Live execution timeline | Not shown (historical view) |
| Actions | Cancel running pipeline | Delete historical record |
| Node output | Live streaming text | Markdown-rendered final output |
Related Pages
Pipeline Tool Reference
YAML parameter reference with per-type configuration examples.
Agents View
View and manage the agents that power your pipeline steps.
Developer Guide: Pipelines
Technical reference for building and extending pipelines programmatically.
