feat(webui): Fat Gantt Shapes — unified run detail redesign#710
Merged
nextlevelshit merged 37 commits intomainfrom Apr 5, 2026
Merged
feat(webui): Fat Gantt Shapes — unified run detail redesign#710nextlevelshit merged 37 commits intomainfrom
nextlevelshit merged 37 commits intomainfrom
Conversation
…ic tiers Replace 129 hardcoded model references (claude-haiku-4-5, claude-sonnet, claude-opus-4) across all pipeline YAMLs with tier names (cheapest, fastest, strongest). The executor resolves tier names via routing.complexity_map, falling back to DefaultComplexityMap() when no custom map exists. This makes pipelines adapter-agnostic — switching from Claude to Gemini or Codex requires changing only the complexity_map, not every pipeline file. - Add resolveTierModel() to handle tier name resolution in resolveModel() - Support tier names in both step.Model and persona.Model fields - Add 7 routing test cases for tier name passthrough and custom map override - Remove hardcoded complexity_map from wave.yaml (use defaults) - Update all .wave/pipelines/ and internal/defaults/pipelines/ YAML files
- Admin credentials: only return keys that are set, not all 8 keys always - Analytics page: add color-coded legend to status bar chart - Ontology page: make bounded contexts collapsible via <details> elements - Run detail: add filterLogLevel() function for error/warning log filtering
Delete ops-pr-rework.yaml (superseded by ops-pr-fix-review) and update impl-review-loop.yaml to reference the replacement pipeline.
- Create icons.go with adapterIcon() and forgeIcon() template functions - Support adapters: claude-code, gemini, codex, opencode, browser, mock - Support forges: github, gitlab, bitbucket, gitea, codeberg, forgejo - All SVGs use currentColor for theme compatibility, icon-inline class for sizing - Register template functions in embed.go - Add icon-inline CSS with badge spacing - Integrate adapter icons into run list adapter badges - Remove duplicate filterLogLevel() function from run_detail.html
Replace hardcoded adapter-specific model names (Haiku, Sonnet, Opus) with adapter-agnostic tier names (cheapest, fastest, strongest) to match the model tier system.
The quickstart dialogs in pipelines.html and pipeline_detail.html called
collectAdvancedOptions('qs') but the function was never defined, causing a
ReferenceError on submission. Add the function to app.js which collects
model, from_step, dry_run, steps, and exclude values from form elements.
The ListRuns cursor pagination used `id` column which doesn't exist in the pipeline_run table. Changed to `run_id` which is the actual primary key column, fixing 500 errors on paginated run list pages.
The artifact content API endpoint incorrectly applied HTML entity encoding to JSON responses, causing quotes to render as ". JSON API responses should not be HTML-escaped — encoding/json handles proper JSON string escaping.
The PipelineDetailStep.Type field was calling .String() on a string type, causing a compile error. Changed to use the raw string value.
New run detail page prototype implementing the Fat Gantt Shapes design: - I/O hero cards (IN at top, OUT at bottom) always visible - Each step is a fat shape with gantt background positioned on timeline - Step tabs: artifact names + logs as unified tab navigation - Smart JSON rendering with severity-tagged findings - Markdown rendering with Rendered/Raw toggle - Secondary panels: Events, Retro, Changed Files, Metrics - Composition pipeline support with nested shapes - No scroll traps — all content expands to full height Design documented in issue #707. Served at /runs2/{id} alongside the existing /runs/{id} page for A/B comparison.
…t top - Add formatBytes template function (6050B → 5.9KB) - Click step header auto-opens first artifact tab - Move Events/Retro/Diff/Metrics nav to stats bar at top - Neutral Retry/Resume buttons that work on red/green backgrounds - Remove all scroll traps — content expands to full height - Remove redundant progress bar - Remove timeline ruler
- Add v2-specific live timer (v1 timer requires .step-card parent) - Replace v1 connectSSE with lightweight v2 SSE (page reload on complete) - Remove v1 sse.js/log-viewer.js imports that created rogue Events panels - CSS force-hide any v1 event elements that leak through - Add formatBytes template func (6050B → 5.9KB) - Click step header auto-opens first artifact
Panels (Events, Retro, Changed Files, Metrics) now open between the stats bar and the IN card, not at the bottom of the page. Removed duplicate panel HTML that was left at the bottom after the OUT card. Also fixed spinner alignment in OUT card for running pipelines.
- Move gantt bar from bottom to top of each step shape - Rich step config panel: shows persona (linked), dependencies, contract (linked), retry policy, on_failure, input/output artifacts, thread, and the full prompt text from pipeline YAML - Add prompt, sub_pipeline, thread, input_artifacts, retry_policy, on_failure, max_attempts to pipeline detail API - Fix OUT card bottom padding for failed runs
Missing critical info: when the pipeline started, run ID, and branch. Added: formatted start time, dot-separated stats, branch name in code style, and run ID as a small monospace subtitle under the pipeline name.
New runs list page matching the Fat Gantt Shapes design language:
- Compact run cards with left status accent bar
- Pipeline name, status badge, input preview on first line
- Duration, step progress, tokens, adapter/model badges on second line
- Date, duration, branch name right-aligned
- Child runs indented below parent
- Status filter tabs (All/Running/Completed/Failed)
- Cursor-based pagination with Load More
- All links navigate to /runs2/{id} detail pages
… live updates - Rich input display: GitHub/GitLab URLs parsed into "PR #695" / "Issue #42" instead of raw URLs, with forge-agnostic heuristics - Header: run ID inline after title, description with proper spacing - Step details panel positioned between IO and tab bar (not below tabs) - Flattened containers: removed nested borders from tabcontent - Auto-refresh: polling fallback every 5s when SSE unavailable - Running step gantt bar expands over time (animated width) - Humanized JSON keys in smart renderer (snake_case → Title Case) - Removed clip-path shapes on gates/conditionals (visual noise) - Fixed OUT card byte formatting (formatBytes helper) - Title-cased failure class badges - Shortened run IDs with tooltip for full value
The shortRunID in the title was broken (12-char truncation cut names like "impl-issue-2") and redundant with the branch name in stats bar. Removed it. The full run ID remains accessible via the stats bar and v1 link.
…iff, hover states - Pending steps in completed pipelines now show as "skipped" (not "pending") - Step prompt rendered as markdown (headers, code blocks, bold) via marked.js - Changed Files: split-pane layout (file tree left, diff viewer right) - Skipped/pending steps: lighter on hover/focus for readability - Minimal steps (no data from old runs): collapsed with reduced opacity - Tab content now renders BELOW tab bar (was incorrectly above) - Step config panel separate from tab content (both visible simultaneously) - Rich input: forge URL parsing into "PR #695" / "Issue #42" - Humanized JSON keys in smart renderer
Routes swapped: /runs and /runs/{id} now serve the Fat Gantt Shapes v2.
The original v1 pages are still accessible at /runs-v1 and /runs-v1/{id}.
All internal links updated. "v1" button renamed to "Classic".
…elative time - Step I/O: "in: prev step" replaced with actual artifact flow from pipeline definition (e.g., "from: fetch-review/findings, spec/analysis") - Model IDs: friendlyModel helper converts "claude-haiku-4-5" → "Haiku", "claude-sonnet-4-20250514" → "Sonnet", tier names preserved - Relative timestamps: "Apr 4 02:44:38" → "2 days ago" with absolute on hover - Branch name removed from stats bar (was redundant with run ID) - Added frictionless AI factory design principles to issue #707
From QA agent report (20 findings): - Add status-skipped CSS class to statusClass function - Hide raw URL from IN card (only show rich "PR #695" link) - Remove branch name from OUT card (equals run ID, is noise) - Gantt bar 2px → 4px for visibility - Skipped step opacity 0.35 → 0.5 for readability - Secondary tab min-height 28px for click targets - Replace hardcoded #1e293b with var(--color-bg-secondary) in hover states
Major features: - IN card shows rich PR/Issue card with title, state, author from forge API (e.g., "PR #695: Fix pagination — merged by user") - IN card links to Wave webui /prs/{number} instead of raw GitHub URL - Sub-pipeline steps show child run cards with status, duration, tokens - Frictionless factory principle added to issue #707 Fixes: - OUT card bottom padding removed (tab bar sits flush) - Step I/O shows actual artifact flow from pipeline definition - Friendly model names (Haiku, Sonnet, Opus) - Relative timestamps (2 days ago) - Skipped steps at 0.5 opacity with hover to 0.9 - status-skipped CSS class added - Gantt bar 4px for visibility - Secondary tab targets min-height 28px
… IO text - OUT card tab content has neutral bg/border (not green bleeding through) - Gantt bar defaults to 0% width (not 100%) for steps with no timing data - Step IO text: removed "from:" prefix, uses "+" for deps, "/" for artifacts
- LinkedType field distinguishes "pr" vs "issue" for correct routing
(/prs/{n} vs /issues/{n}) — fixes issues linking to /prs/ page
- OUT card mirrors IN card richness: shows PR/Issue title + state badge
- Removed false "merged" badge (was assumed for all completed runs)
- OUT card links to Wave webui pages, not raw GitHub URLs
- Resume button links to v1 resume dialog
… field names - OUT card: title + state + author on separate lines (same typography as IN) - Smart renderer: handles finding/verdict/rationale/action/skip_reason/description fields in addition to summary/title/name — fixes empty resolution cards - Tab active border: neutral white (var(--color-text)) instead of purple
…pages - Removed handleRunsPage (old v1 list handler, 92 lines) - Removed handleRunDetailPage (old v1 detail handler, 252 lines) - Renamed handleRunsV2Page → handleRunsPage - Renamed handleRunDetailV2Page → handleRunDetailPage - Renamed templates: runs_v2.html → runs.html, run_detail_v2.html → run_detail.html - Removed /runs-v1 fallback routes - Removed "Classic" links from v2 templates - Removed v1 template entries from embed.go pageTemplates - Old v1 templates (run_detail.html, runs.html) replaced by Fat Gantt Shapes - Old v1 partials (step_card, dag_svg, resume_dialog, child_run_row, run_row) remain for now as they're embedded but no longer routed to Total: -345 lines of v1 handler code removed.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Complete redesign of the pipeline run detail and runs list pages using the "Fat Gantt Shapes" design — a single unified visualization where each step IS a rich shape containing all important info inline.
Closes #707
Changes
New run detail page (
/runs/{id})New runs list page (
/runs)Bug fixes
id→run_idcolumn)Cleanup
runs.html,run_detail.html)/runs-v1fallback routes removedDesign principles (Frictionless AI Factory)
Test plan