feat: show loading stage name, count, and overall progress

Progress bar now fills to overall completion across all stages.
Label shows e.g. "text model  1/3  23%" and stats panel shows
"text model (1/3)". Label bumped to 8px full amber for readability.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Vlad Doloman
2026-06-26 18:29:45 +03:00
parent 7bda83998e
commit a5e59df624
2 changed files with 16 additions and 6 deletions

View File

@@ -58,10 +58,20 @@
// Progress bar: model loading or prompt processing
if (loading) {
const pct = Math.round((loading.progress ?? 0) * 100);
progressFill.style.width = pct + '%';
progressLabel.textContent = loading.current + ' ' + pct + '%';
svLoadStage.textContent = loading.current;
const stageName = (loading.current ?? '').replace(/_/g, ' ');
const stageIdx = (loading.stages ?? []).indexOf(loading.current);
const totalStages = (loading.stages ?? []).length;
const stagePct = Math.round((loading.progress ?? 0) * 100);
const overallPct = totalStages > 0
? Math.round(((stageIdx + (loading.progress ?? 0)) / totalStages) * 100)
: stagePct;
progressFill.style.width = overallPct + '%';
progressLabel.textContent = stageName
+ (totalStages > 1 ? ' ' + (stageIdx + 1) + '/' + totalStages : '')
+ ' ' + stagePct + '%';
svLoadStage.textContent = totalStages > 1
? stageName + ' (' + (stageIdx + 1) + '/' + totalStages + ')'
: stageName;
} else if (state === 'processing_prompt' && metrics && metrics.prompt_progress != null) {
const pct = Math.round(metrics.prompt_progress * 100);
progressFill.style.width = pct + '%';

View File

@@ -245,8 +245,8 @@ body.state-error #llama { animation: error-flash 1s ease-in-out infinite; }
transition: width 0.4s ease;
}
#progress-label {
font-size: 7px;
color: var(--amber-dim);
font-size: 8px;
color: var(--amber);
}
/* ── Resize handle ───────────────────────────────────────────────────────── */