5e9a9c2790
Port the standalone lab dashboard (lab.lthn.io) into the core CLI as pkg/lab/ with collectors, handlers, and HTML templates. The dashboard monitors machines, Docker containers, Forgejo, HuggingFace models, training runs, and InfluxDB metrics with SSE live updates. New command: core lab serve --bind :8080 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
113 lines
3.6 KiB
HTML
113 lines
3.6 KiB
HTML
{{template "head" "Runs"}}
|
|
{{template "nav" "runs"}}
|
|
|
|
<style>
|
|
.run-section{margin-bottom:2.5rem}
|
|
.run-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}
|
|
.run-header h2{font-size:1.125rem;font-weight:700;color:var(--text);margin:0}
|
|
.run-header .model-badge{font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;padding:.2rem .6rem;border-radius:4px;background:rgba(124,111,240,.15);color:var(--accent)}
|
|
.run-header .run-id{font-size:.75rem;color:var(--muted);font-family:"SF Mono",Consolas,monospace}
|
|
.chart-container{margin-bottom:1.25rem}
|
|
.chart-container h3{font-size:.8125rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.625rem}
|
|
.chart-card{border:1px solid var(--border);border-radius:8px;padding:1rem;background:var(--surface);overflow-x:auto}
|
|
.run-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem;margin-bottom:1.25rem}
|
|
.run-stat{padding:.75rem 1rem;border:1px solid var(--border);border-radius:8px;background:var(--surface)}
|
|
.run-stat .label{font-size:.6875rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem}
|
|
.run-stat .value{font-size:1.5rem;font-weight:700;line-height:1.2}
|
|
.run-stat .sub{font-size:.75rem;color:var(--muted);margin-top:.125rem}
|
|
</style>
|
|
|
|
<h2 class="section-title">Training Runs</h2>
|
|
|
|
{{$b := .Benchmarks}}
|
|
|
|
{{if not $b.Runs}}
|
|
<div class="card empty">
|
|
<p>No benchmark data available. InfluxDB data refreshes every 60 seconds.</p>
|
|
</div>
|
|
{{else}}
|
|
|
|
{{range $b.Runs}}
|
|
{{$rid := .RunID}}
|
|
{{$mdl := .Model}}
|
|
|
|
<div class="run-section" id="{{$rid}}">
|
|
<div class="run-header">
|
|
<h2>{{$mdl}}</h2>
|
|
<span class="model-badge">{{.Type}}</span>
|
|
<span class="run-id">{{$rid}}</span>
|
|
</div>
|
|
|
|
{{/* Summary stats */}}
|
|
<div class="run-summary">
|
|
{{if hasKey $b.Loss $rid}}
|
|
{{$loss := getLoss $b.Loss $rid}}
|
|
<div class="run-stat">
|
|
<div class="label">Loss Points</div>
|
|
<div class="value">{{len $loss}}</div>
|
|
<div class="sub">val + train</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{if hasContentKey $b.Content $rid}}
|
|
{{$content := getContent $b.Content $rid}}
|
|
<div class="run-stat">
|
|
<div class="label">Content Scores</div>
|
|
<div class="value">{{len $content}}</div>
|
|
<div class="sub">dimension scores</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{if hasCapKey $b.Capability $rid}}
|
|
{{$cap := getCap $b.Capability $rid}}
|
|
<div class="run-stat">
|
|
<div class="label">Capability Tests</div>
|
|
<div class="value">{{len $cap}}</div>
|
|
<div class="sub">benchmark points</div>
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
|
|
{{/* Training Loss Chart */}}
|
|
{{if hasKey $b.Loss $rid}}
|
|
<div class="chart-container">
|
|
<h3>Training Loss Curve</h3>
|
|
<div class="chart-card">
|
|
{{lossChart (getLoss $b.Loss $rid)}}
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{/* Content Score Chart */}}
|
|
{{if hasContentKey $b.Content $rid}}
|
|
<div class="chart-container">
|
|
<h3>Content Scores by Dimension</h3>
|
|
<div class="chart-card">
|
|
{{contentChart (getContent $b.Content $rid)}}
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{/* Capability Chart */}}
|
|
{{if hasCapKey $b.Capability $rid}}
|
|
<div class="chart-container">
|
|
<h3>Capability Benchmark</h3>
|
|
<div class="chart-card">
|
|
{{capabilityChart (getCap $b.Capability $rid)}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="chart-container">
|
|
<h3>Category Breakdown</h3>
|
|
<div class="chart-card">
|
|
{{categoryBreakdown (getCap $b.Capability $rid) (getCapJudge $b.CapabilityJudge $rid)}}
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
</div>
|
|
{{end}}
|
|
|
|
{{end}}
|
|
|
|
{{template "footer"}}
|