Files
josh 017c3c38fe
CI / Lint + build + test (push) Successful in 1m43s
Release / detect (push) Successful in 6s
Release / build-live-image (push) Has been skipped
Release / bundle (push) Successful in 52s
feat(ui): 15-point UX overhaul — affordances, feedback, and navigation
Address friction points identified in a full interface audit:
- Re-add status badge to dashboard tiles so run state is visible at a glance
- Add active nav indicator and SSE connection health monitor (live/stale)
- Show manual registration form by default instead of hiding behind <details>
- Add copy-to-clipboard buttons on SSH hold command and quick-register one-liner
- Replace tooltip-only profile descriptions with inline visible text
- Clarify non-destructive toggle with explicit stage impact description
- Replace disabled "Start vetting" button with actionable offline guidance
- Swap browser confirm() dialogs for styled inline confirmations
- Add colored badge to spec diffs summary visible when collapsed
- Add distinct "cancelled" mood for cancelled runs (vs idle)
- Add match count to log search and aria-label for accessibility
- Add styled 404 page rendered inside the app shell

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-23 20:08:07 -04:00

76 lines
2.4 KiB
Plaintext

package templates
import (
"fmt"
"vetting/internal/model"
)
// ActiveStepData is the per-stage payload for the expanded step panel.
// The handler builds one per stage in DefaultStageOrder and hands it to
// ActiveStep so the template stays free of any slicing logic.
type ActiveStepData struct {
RunID int64
Stage model.Stage
SubSteps []model.SubStep
LogReplay string
Open bool
}
// ActiveStep renders one stage's expanded panel: the header summary
// (state badge, stage name, duration), any sub-step rows, a per-step
// search box, and a live log pane scoped to that stage's SSE topic.
// Uses <details open?={ d.Open }> so the server-picked default stage
// opens automatically on page load; app.js takes over after that for
// SSE-driven auto-advance.
templ ActiveStep(d ActiveStepData) {
<details class={ "step", "step-" + string(d.Stage.State) } open?={ d.Open } data-stage={ d.Stage.Name }>
<summary class="step-summary">
<span class={ "stage-dot", "stage-dot-" + string(d.Stage.State) }>{ stageMarker(string(d.Stage.State)) }</span>
<span class="step-name">{ d.Stage.Name }</span>
<span class="step-duration">{ stageDurationFromStage(d.Stage) }</span>
</summary>
<div class="step-body">
if len(d.SubSteps) > 0 {
<ol class="substep-list">
for _, ss := range d.SubSteps {
@SubStepRow(ss)
}
</ol>
}
<div class="log-search-wrap">
<input class="log-search" type="search" placeholder="Search this step" data-step={ d.Stage.Name } aria-label={ "Search " + d.Stage.Name + " logs" }/>
<span class="log-match-count"></span>
</div>
<div
class="log-pane"
id={ fmt.Sprintf("log-%d-%s", d.RunID, d.Stage.Name) }
sse-swap={ fmt.Sprintf("log-%d-%s", d.RunID, d.Stage.Name) }
hx-swap="beforeend show:bottom"
>
@templ.Raw(d.LogReplay)
</div>
</div>
</details>
}
// SubStepsForStage filters a flat []SubStep to just the entries for one
// stage. Used by host_detail when wiring ActiveStepData — keeps the
// filtering logic testable and off the template surface.
func SubStepsForStage(all []model.SubStep, stageName string) []model.SubStep {
out := make([]model.SubStep, 0, len(all))
for _, ss := range all {
if ss.StageName == stageName {
out = append(out, ss)
}
}
return out
}
func stageDurationFromStage(s model.Stage) string {
if d := elapsed(s.StartedAt, s.CompletedAt); d >= 0 {
return fmtElapsed(d, false)
}
return ""
}