1. findCommonParent: replaced with correct lowest common ancestor
algorithm using ancestor set intersection (previous version only
walked from node 'a', not a true LCA)
2. Bounding box: compute totalWidth/totalHeight from actual positioned
node coordinates instead of rootNode.getWidth/Height. The rootNode
dimensions don't account for handler sections in separate ELK roots.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Handler section nodes were positioned relative to rootNode, but they
live under separate handlerRoot ELK graphs. Using getElkRoot() to find
each node's actual root ensures correct absolute coordinates.
This combined with the POLYLINE edge routing should eliminate the
Y-offset misalignment between main flow nodes.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Backend:
- Set POLYLINE edge routing on ELK root — eliminates curved/bent edges
between horizontally aligned nodes
- Collect edges from handler section roots (not just main root) so
internal handler edges are included in the layout output
- Use correct root reference for coordinate calculation per edge
Frontend:
- Render ALL edge points as line segments (polylines), not cubic bezier.
ELK bend points are waypoints, not bezier control points — the cubic
bezier interpretation caused false curves.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Handler section ELK roots were missing INCLUDE_CHILDREN, causing
edges between a handler compound and its children to fail with
UnsupportedGraphException (cross-hierarchy edge resolution).
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Edges connecting main flow nodes to handler section nodes (ON_EXCEPTION,
ON_COMPLETION) now span different ELK root graphs. ELK throws
UnsupportedGraphException when an edge connects nodes in different
layout hierarchies. Skip these cross-root edges — the frontend doesn't
render them anyway (handler sections are separated visually).
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
ON_EXCEPTION, ON_COMPLETION, and ERROR_HANDLER compounds were included
in the same root ELK graph as the main flow. ELK's layered algorithm
offset the main flow nodes vertically to accommodate the handler
compounds, causing bent arrows between the ENDPOINT and first processor.
Now handler sections get their own independent ELK root graphs. The
frontend already separates and repositions them, so they just need
correct internal layout — not positioning relative to the main flow.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Make headers tab and timeline tab scrollable when content overflows
- Replace custom <pre> code block with design system CodeBlock component
for body tabs (Input/Output) to match existing styleguide
- Add LINEAR_SEGMENTS node placement strategy to ELK layout to fix
Y-offset misalignment between nodes in left-to-right diagrams
(e.g., ENDPOINT at different Y level than subsequent processors)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add ON_COMPLETION to backend COMPOUND_TYPES and frontend rendering.
Completion handlers render as teal-tinted sections between the main
flow and error handlers, structurally parallel to onException.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
ELK renderer:
- Add EIP_WHEN, EIP_OTHERWISE, DO_CATCH, DO_FINALLY to COMPOUND_TYPES
so branch body processors nest inside their containers
- Rewrite node creation and result extraction as recursive methods
to support compound-inside-compound (CHOICE → WHEN → processors)
- Use fixed NODE_WIDTH=160 for leaf nodes instead of variable width
Frontend:
- Fix mousewheel crash: capture getBoundingClientRect() before
setState updater (React nulls currentTarget after handler returns)
- Anchor fitToView to top-left instead of centering
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
New interactive route diagram component with SVG rendering using
server-computed ELK layout coordinates. TIBCO BW5-inspired top-bar
card node style with zoom/pan, hover toolbars, config badges, and
error handler sections below the main flow.
Backend: add direction query parameter (LR/TB) to diagram render
endpoints, defaulting to left-to-right layout.
Frontend: 14-file ProcessDiagram component in ui/src/components/
with DiagramNode, CompoundNode, DiagramEdge, ConfigBadge, NodeToolbar,
ErrorSection, ZoomControls, and supporting hooks. Dev test page at
/dev/diagram for validation.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
ON_EXCEPTION and ERROR_HANDLER nodes are now treated as compound containers
in the ELK diagram renderer, nesting their children. The frontend
diagram-mapping builds separate FlowSegments for each error handler,
displayed as distinct sections in the RouteFlow component.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
NODE_SPACING 40→60 gives edges more vertical room between nodes.
FIXED_H reverted to 40 to match backend NODE_HEIGHT.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>