From a59e5cc2719fee1b56b868161e13a439d90c75e2 Mon Sep 17 00:00:00 2001 From: Sucukdeluxe <259325684+Sucukdeluxe@users.noreply.github.com> Date: Tue, 11 Aug 2026 04:32:30 +0200 Subject: [PATCH] fix: improve upload telemetry readability Increase the lower-sidebar availability and telemetry type scale, and update the header and sidebar speed values through one shared formatter so both surfaces stay synchronized with every live sample. --- renderer/app.js | 12 +++++++++--- renderer/styles.css | 20 ++++++++++++++------ tests/ui-smoke.js | 9 ++++++++- 3 files changed, 31 insertions(+), 10 deletions(-) diff --git a/renderer/app.js b/renderer/app.js index f083e38..7727560 100644 --- a/renderer/app.js +++ b/renderer/app.js @@ -3652,10 +3652,16 @@ function _setRollingUploadMetric(id, value) { }); } -function formatUploadSpeed(kbs) { +function getUploadSpeedText(kbs = lastUploadStats.globalSpeedKbs) { return !kbs || kbs <= 0 ? '0 B/s' : formatSpeed(kbs); } +function updateUploadSpeedDisplays() { + const text = getUploadSpeedText(); + _setUploadTelemetryText('uploadTelemetrySpeed', text); + _setUploadTelemetryText('uploadSpeedValue', text); +} + function syncUploadSpeedSparklineVisibility(view) { const widget = document.getElementById('uploadSpeedSparkline'); if (!widget) return; @@ -3714,7 +3720,7 @@ function drawUploadSpeedSparkline() { function updateUploadSpeedSparkline() { const speedKbs = Math.max(0, Number(lastUploadStats.globalSpeedKbs) || 0); window.SpeedHistory.updateSpeedHistory(uploadSpeedState, speedKbs * 1024); - _setUploadTelemetryText('uploadSpeedValue', formatUploadSpeed(speedKbs)); + updateUploadSpeedDisplays(); drawUploadSpeedSparkline(); } @@ -3740,7 +3746,7 @@ function updateStatusBar() { _setRollingUploadMetric('uploadTelemetryRunning', stats.inProgress); _setRollingUploadMetric('uploadTelemetryCompleted', _sessionDoneCount); _setRollingUploadMetric('uploadTelemetryFailed', _sessionErrorCount); - _setUploadTelemetryText('uploadTelemetrySpeed', formatUploadSpeed(lastUploadStats.globalSpeedKbs || 0)); + updateUploadSpeedDisplays(); _setUploadTelemetryText('uploadTelemetryEta', etaSeconds > 0 ? formatTime(etaSeconds) : '--:--'); updateUploadSidebarSummary(stats); } diff --git a/renderer/styles.css b/renderer/styles.css index 05e2845..9e62930 100644 --- a/renderer/styles.css +++ b/renderer/styles.css @@ -2545,6 +2545,14 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; } margin-top: 0; } +.upload-sidebar-lower .view-sidebar-section-label { + font-size: 11px; +} + +.upload-sidebar-lower .view-sidebar-summary { + font-size: 12px; +} + .upload-telemetry { display: grid; gap: 6px; @@ -2553,34 +2561,34 @@ select.hs-input { max-width: none; width: auto; min-width: 140px; } } .upload-telemetry-row { - min-height: 15px; + min-height: 17px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--text-dim); - font-size: 11px; - line-height: 15px; + font-size: 12px; + line-height: 17px; } .upload-telemetry-value { min-width: 58px; color: var(--text); - font-size: 11px; + font-size: 12px; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; } .upload-rolling-value { - height: 15px; + height: 17px; overflow: hidden; position: relative; } .upload-rolling-value > span { width: 100%; - height: 15px; + height: 17px; display: block; } diff --git a/tests/ui-smoke.js b/tests/ui-smoke.js index ed8a227..c912d66 100644 --- a/tests/ui-smoke.js +++ b/tests/ui-smoke.js @@ -315,6 +315,9 @@ setTimeout(async () => { const uploadSidebarInformation = await wc.executeJavaScript('(() => { const sidebar = document.querySelector("#upload-view > .view-sidebar")?.getBoundingClientRect(); const availability = document.getElementById("uploadAvailability")?.getBoundingClientRect(); const telemetry = document.getElementById("uploadTelemetry")?.getBoundingClientRect(); return Boolean(sidebar && availability && telemetry && availability.bottom <= telemetry.top && telemetry.bottom <= sidebar.bottom + 1 && document.getElementById("uploadSidebarAccountsCount")); })()'); check('Upload sidebar stacks availability above bottom telemetry', uploadSidebarInformation === true); + const lowerSidebarTypography = await wc.executeJavaScript('(() => { const availabilityLabel = document.querySelector("#uploadAvailability .view-sidebar-section-label"); const availabilityText = document.querySelector("#uploadAvailability .view-sidebar-summary"); const telemetryLabel = document.querySelector("#uploadTelemetry .upload-telemetry-label"); const telemetryValue = document.querySelector("#uploadTelemetry .upload-telemetry-value"); return [availabilityLabel, availabilityText, telemetryLabel, telemetryValue].map(element => parseFloat(getComputedStyle(element).fontSize)); })()'); + check('Availability and telemetry use the larger readable type scale', lowerSidebarTypography[0] >= 11 && lowerSidebarTypography[1] >= 12 && lowerSidebarTypography[2] >= 12 && lowerSidebarTypography[3] >= 12); + const telemetryUpdate = await wc.executeJavaScript(\`(() => { queueJobs = [ { id: 'telemetry-running', status: 'uploading', bytesTotal: 4096, bytesUploaded: 1024 }, @@ -334,11 +337,15 @@ setTimeout(async () => { return element?.getAttribute('aria-label') || element?.textContent.trim(); }).join('|'), rolling, - direction: total?.dataset.direction + direction: total?.dataset.direction, + speedPair: [document.getElementById('uploadTelemetrySpeed')?.textContent, document.getElementById('uploadSpeedValue')?.textContent].join('|') }; })()\`); check('Upload telemetry reflects queue and session activity', telemetryUpdate.values === '4|1|2|1|7|2|2 kB/s|00:03'); check('Changing integer telemetry rolls vertically', telemetryUpdate.rolling === 2 && telemetryUpdate.direction === 'up'); + check('Header and sidebar speed update synchronously from the same live sample', telemetryUpdate.speedPair === '2 kB/s|2 kB/s'); + const secondSynchronizedSpeed = await wc.executeJavaScript('lastUploadStats = { ...lastUploadStats, globalSpeedKbs: 1536 }; updateStatusBar(); [document.getElementById("uploadTelemetrySpeed")?.textContent, document.getElementById("uploadSpeedValue")?.textContent].join("|")'); + check('Header and sidebar speed stay synchronized across later samples', secondSynchronizedSpeed === '1.5 MB/s|1.5 MB/s'); await new Promise(resolve => setTimeout(resolve, 360)); await wc.executeJavaScript('queueJobs = []; _sessionDoneCount = 0; _sessionErrorCount = 0; lastUploadStats = { ...lastUploadStats, globalSpeedKbs: 0, activeJobs: 0, state: "idle" }; updateStatusBar();');