Hermes Switch UI — Workflow Output Flow

How node outputs travel from the DAG executor to expandable output bodies in the run detail panel

Legend Server (backend) Browser (frontend) Storage (DB) Approval gate (pause) DAG Executor core/dag-executor.ts command runner executor-shared.ts Claude SDK streaming bash / script runner child_process stdout executor-shared.ts approval handler pauses — awaits HTTP signal POST .../approve loop / subgraph runner recursive execution emits per child node Event Emitter emitter/event-emitter.ts Events emitted • node_started • node_output (streaming) • node_completed • node_failed • run_completed / run_failed approval_requested executor suspends awaiting POST /approve resumes on user click Node-runs Projector projector/node-runs-projector.ts Subscribes to emitter node_started → createNodeRun() node_output → appendNodeOutput() node_completed → updateNodeRun(completed) node_failed → updateNodeRun(failed) node_skipped → updateNodeRun(skipped) aggregates snapshot node_runs DB table workflow-runs.db node_runs table status · output · timing parent_subgraph_node_run_id SSE Relay /api/workflow-events GET /api/workflow-events EventSource stream data: { type, runId, nodeId, output, status } one event per emitter call Run Detail Panel run-detail-panel.tsx + use-workflow-events.ts Node status list completed running pending failed Expandable output Click node row to expand Shows full text output Tool call details (command) stdout/stderr (bash/script) Approval prompt (approval) Iteration results (loop) Approval node interaction 1. approval node fires → node badge shows "waiting" 2. Panel shows Approve / Reject buttons 3. User clicks → POST /api/workflow-runs/:id/approve 4. Engine resumes from paused approval node use-workflow-events.ts (SSE hook) EventSource → /api/workflow-events • filters by runId dispatches to Zustand store → triggers React re-render appends output chunks to node output buffer in real-time emit events subscribe writes rows fan-out to SSE relay EventSource chunks approval_requested → shows Approve/Reject UI POST /approve → resumes

Event pipeline

  • • DAG executor emits per-node lifecycle events
  • • node_output events carry streaming text chunks
  • • Projector writes each event to node_runs DB
  • • SSE relay fans events to all open EventSources

Run detail panel

  • • Node list with status badges (running/done/failed)
  • • Click any row to expand full output body
  • • Output streams in real-time as chunks arrive
  • • Timing and error details shown per node

Approval node gate

  • • approval node fires approval_requested event
  • • Engine suspends — remaining nodes do not run
  • • Panel shows Approve / Reject buttons
  • • POST /approve resumes execution from that node

Hermes Switch UI • workflow output flow • emitter → projector → SSE → run detail panel