# Workflow Visualization And Replay

## Recommendation

Restore workflow graphing, time-travel, and replay as a run-detail capability under `Releases`, with a secondary entry point from `Evidence > Verify & Replay`.

- Canonical mount: `/releases/runs/:runId`
- Suggested user-facing title in the run view: `Run Graph & Replay`
- Secondary entry point: `/evidence/verify-replay`

This capability should help operators understand what happened in a release run, why a run failed or slowed, and how evidence or replay confirms the outcome.

## Shipped Outcome

- The canonical runtime workspace now ships under `/releases/runs/:runId/{summary|graph|timeline|critical-path|replay|evidence}`.
- `Releases > Activity` and release detail flows deep-link into the mounted run workspace instead of the dead prototype route family.
- `Evidence > Verify & Replay` can open the same run context, and replay controls can return operators into the canonical run workspace.
- Legacy `workflow-visualization/:runId/*` URLs now redirect into the canonical run workspace.
- Workflow editor preview reuse is bounded to graph preview mode and does not load runtime replay semantics.
- Verification evidence is captured in `docs/features/checked/web/workflow-visualization-replay-ui.md`.

## Why This Is The Right Shape

- The abandoned visualizer models runtime concepts such as graph state, auto-refresh, step detail, critical path, and time travel.
- Those concepts belong to a run-detail experience, not to a standalone sidebar product.
- Evidence replay already exists as a live route, so the missing piece is a better run-context shell and shared graph vocabulary.
- Workflow authoring still benefits from a graph preview, but runtime analysis must remain primary.

## Operator Modes

### 1. Release Operator Mode
- Used from `Releases > Runs`.
- Focus: graph, timeline, failure diagnosis, and replay.

### 2. Evidence Verification Mode
- Used from `Evidence > Verify & Replay`.
- Focus: deterministic replay, drift comparison, and proof verification.

### 3. Authoring Preview Mode
- Used from workflow editor.
- Focus: DAG preview only, without runtime telemetry or replay state.

## Recommended IA

### Release run detail tabs
- `Summary`
- `Graph`
- `Timeline`
- `Critical Path`
- `Replay`
- `Evidence`

### Supporting surfaces
- step detail drawer from graph and timeline
- replay toolbar in `Replay`
- evidence rail in `Evidence`

## Page Anatomy

### Graph tab
- run status header with current stage and outcome
- DAG visualization with node status, duration, retries, and blockers
- filters:
  - failed only
  - critical path only
  - environment
  - job type
- step detail drawer on selection

### Timeline tab
- chronological execution lane view
- time-travel controls in the toolbar
- jump from timeline event to graph node

### Critical Path tab
- optimized read of the longest or blocking path
- compare actual versus expected duration

### Replay tab
- replay status
- replay inputs and pinned hashes
- drift comparison and output match
- link to evidence export or proof replay details

### Evidence tab
- attached evidence bundles
- gate decisions
- relevant witnesses and proofs
- export shortcuts

## Route Contract

Keep the current `releases/runs` route family and deepen it with stable tabs.

### Canonical routes
- `/releases/runs/:runId`
- `/releases/runs/:runId/summary`
- `/releases/runs/:runId/graph`
- `/releases/runs/:runId/timeline`
- `/releases/runs/:runId/critical-path`
- `/releases/runs/:runId/replay`
- `/releases/runs/:runId/evidence`
- `/evidence/verify-replay?runId=:runId`
- `/administration/workflows/:workflowId?view=preview`

### Query-param state
- `step=<stepId>` to open the step drawer
- `returnTo=<encoded route>` when entering from evidence or approvals

### Alias rules
- any legacy `workflow-visualization/*` route should redirect into the run-detail tab family

## What To Merge

### Merge into runtime run detail
- `WorkflowVisualizerComponent`
- `TimeTravelControlsComponent`
- `StepDetailPanelComponent`

### Reuse in authoring preview
- graph-only subset of `WorkflowVisualizerComponent`

### Integrate with existing evidence replay
- `ReplayControlsComponent`
- proof replay surfaces where they overlap with deterministic verification

## Single Actions And Supporting Surfaces

### Step detail
- right drawer by default
- add a full route only if failed-step diagnostics need durable shareable URLs beyond `step=<id>`

### Time-travel controls
- toolbar actions in `Timeline` or `Replay`
- never a separate page

### Critical-path focus
- its own tab or a persistent graph mode
- not a sidebar product

### Replay verify
- primary home in `Replay`
- secondary entry point from `Evidence > Verify & Replay`

## Cross-Product Entry Points

- `Releases > Approvals`
  - deep-link into run detail when an approval is waiting on a blocked step
- `Evidence > Verify & Replay`
  - open the same replay context with run id preselected
- `Decisioning Studio`
  - open run evidence or gate proof when policy blocks a promotion
- `Administration > Workflows`
  - show authoring-time preview without runtime state

## UI Standards For Implementation

- Treat graph, timeline, critical path, replay, and evidence as one coherent run-detail experience.
- Preserve stable tab and step deep links.
- Keep replay evidence visible and comparable to the original run outcome.
- Avoid mixing authoring preview with live telemetry.
- Reuse graph components between runtime and authoring only where the semantics stay clear.

## Non-Goals

- Do not create a standalone `Workflow Visualization` sidebar item.
- Do not split graph and replay into different owner shells.
- Do not make workflow editor the primary home of runtime troubleshooting.

## Source Inputs

- `docs/modules/release-orchestrator/ui/overview.md`
- `docs/modules/release-orchestrator/workflow/evidence-based-release-gates.md`
- `docs/modules/ui/architecture-rework.md`
- `src/Web/StellaOps.Web/src/app/routes/releases.routes.ts`
- `src/Web/StellaOps.Web/src/app/routes/evidence.routes.ts`
- `src/Web/StellaOps.Web/src/app/features/workflow-visualization/workflow-visualization.routes.ts`
- `src/Web/StellaOps.Web/src/app/features/workflow-visualization/components/workflow-visualizer/workflow-visualizer.component.ts`