Execution Overlay: Full Design Mockup

ExecutionDiagram component — diagram with execution overlay + detail panel

ExecutionDiagram — Failed Exchange View
Exchange abc-123-def-456 FAILED sample-app / content-based-routing 247ms
from:jms:orders
ENDPOINT
2ms
log:incoming
LOG
5ms
CHOICE
WHEN: header.type == 'A'
bean:validate
FAILED
120ms
!
to:http:api
TO
OTHERWISE
to:direct:alt
DIRECT
100%
bean:validate FAILED processor-5 · 120ms
Info
Headers
Input
Output
Error
Config
Timeline
Exception
javax.validation.ValidationException
Message
Order quantity must be positive: received -3
Root Cause
java.lang.IllegalArgumentException: quantity must be > 0
Stack Trace
at com.example.OrderValidator.validate(OrderValidator.java:42)
at com.example.OrderRoute.process(OrderRoute.java:18)
at org.apache.camel.processor.DelegateSyncProcessor.process(...)
at org.apache.camel.processor.Pipeline.process(Pipeline.java:184)
... 8 more

Design Decisions Shown

Executed (OK)
Green left border, duration badge bottom-right
Failed
Red border, red tint background, red ! badge top-right
Not Executed
Dimmed to 35% opacity — full topology visible
Selected
Amber ring (existing), detail panel updates below