fix(downloads): show remaining volume before total

Place the current unfinished download volume ahead of the historical total in the downloads status sidebar. Lock the user-facing metric order with a renderer regression test.
This commit is contained in:
Sucukdeluxe
2026-08-15 01:00:36 +02:00
parent a26fabe990
commit 64c846861b
2 changed files with 2 additions and 1 deletions
@@ -109,8 +109,8 @@ export function DownloadsSidebarStatus({ model }: { model: DownloadsViewModel })
{ label: "Pakete", metric: "packages", numericValue: model.status.packages, value: integerFormatter.format(model.status.packages) }, { label: "Pakete", metric: "packages", numericValue: model.status.packages, value: integerFormatter.format(model.status.packages) },
{ label: "Links", metric: "links", numericValue: model.status.links, value: integerFormatter.format(model.status.links) }, { label: "Links", metric: "links", numericValue: model.status.links, value: integerFormatter.format(model.status.links) },
{ label: "Sitzung", metric: "session", numericValue: model.status.sessionBytes, value: model.status.session }, { label: "Sitzung", metric: "session", numericValue: model.status.sessionBytes, value: model.status.session },
{ label: "Gesamt", metric: "total", numericValue: model.status.totalBytes, value: model.status.total },
{ label: "Verbleibend", metric: "remaining", numericValue: model.status.remainingBytes, value: model.status.remaining }, { label: "Verbleibend", metric: "remaining", numericValue: model.status.remainingBytes, value: model.status.remaining },
{ label: "Gesamt", metric: "total", numericValue: model.status.totalBytes, value: model.status.total },
{ label: "Hoster", metric: "hosters", numericValue: model.status.hosters, value: integerFormatter.format(model.status.hosters) } { label: "Hoster", metric: "hosters", numericValue: model.status.hosters, value: integerFormatter.format(model.status.hosters) }
]; ];
return <section className="downloads-sidebar-status" data-visual-region="downloads-sidebar-status" aria-label="Downloadstatus">{entries.map((entry) => <div key={entry.metric}><span>{entry.label}</span><RollingMetricValue numericValue={entry.numericValue} value={entry.value} /></div>)}<div><span>Geschwindigkeit</span><strong data-status-metric="speed">{speed}</strong></div><div><span>ETA</span><strong data-status-metric="eta">{eta}</strong></div></section>; return <section className="downloads-sidebar-status" data-visual-region="downloads-sidebar-status" aria-label="Downloadstatus">{entries.map((entry) => <div key={entry.metric}><span>{entry.label}</span><RollingMetricValue numericValue={entry.numericValue} value={entry.value} /></div>)}<div><span>Geschwindigkeit</span><strong data-status-metric="speed">{speed}</strong></div><div><span>ETA</span><strong data-status-metric="eta">{eta}</strong></div></section>;
+1
View File
@@ -114,6 +114,7 @@ describe("rollende Downloadkennzahlen", () => {
const html = renderToStaticMarkup(<DownloadsSidebarStatus model={withRuntime(createInput())} />); const html = renderToStaticMarkup(<DownloadsSidebarStatus model={withRuntime(createInput())} />);
expect(html.match(/class="downloads-rolling-value"/g)).toHaveLength(6); expect(html.match(/class="downloads-rolling-value"/g)).toHaveLength(6);
expect(html).toContain("Verbleibend"); expect(html).toContain("Verbleibend");
expect(html.indexOf("Verbleibend")).toBeLessThan(html.indexOf("Gesamt"));
expect(html).toContain('data-status-metric="speed"'); expect(html).toContain('data-status-metric="speed"');
expect(html).toContain('data-status-metric="eta"'); expect(html).toContain('data-status-metric="eta"');
}); });