ui: scroll/collapse fixes

frdel committed Feb 4, 2026 at 11:41 UTC 9ee98c48237ea93a243849b4ba9e52b42b73e426
2 files changed +27 -5
webui/js/messages.js
+25 -4
@@ -79,6 +79,7 @@ export function setMessages(messages) {
79 smooth: !massRender,
80 toleranceRem: 4,
81 reapplyDelayMs: 1000,
82 + applyStabilization: true,
83 });
84
85 const results = [];
@@ -303,7 +304,7 @@ function drawProcessStep({
304
305 //expand all
306 if (detailMode === "expanded") {
306 - step.classList.add("expanded");
307 + toggleStepCollapse(step, true);
308 // expand current step and schedule collapse of previous
309 } else if (
310 detailMode === "current" &&
@@ -323,7 +324,7 @@ function drawProcessStep({
324 );
325 scheduleStepCollapse(expandedStep, delay);
326 });
326 - step.classList.add("expanded");
327 + toggleStepCollapse(step, true);
328 }
329
330 // create step header
@@ -443,6 +444,26 @@ function drawProcessStep({
444 };
445 }
446
447 +function toggleStepCollapse(step, expanded) {
448 + if (!step) return;
449 +
450 + let nextExpanded = expanded;
451 + if (nextExpanded === undefined || nextExpanded === null) {
452 + nextExpanded = !step.classList.contains("expanded");
453 + }
454 + nextExpanded = Boolean(nextExpanded);
455 +
456 + // scroll to top when collapsing
457 + if (!nextExpanded) {
458 + setTimeout(() => {
459 + const scroller = step.querySelector(".process-step-detail-scroll");
460 + if (scroller) scroller.scrollTop = 0;
461 + }, 100);
462 + }
463 +
464 + step.classList.toggle("expanded", nextExpanded);
465 +}
466 +
467 function drawStandaloneMessage({
468 id,
469 heading,
@@ -1797,7 +1818,7 @@ function scheduleStepCollapse(
1818 }
1819
1820 console.log(`Collapse step: ${stepElement.id}`);
1800 - stepElement.classList.remove("expanded");
1821 + toggleStepCollapse(stepElement, false);
1822 }, delayMs);
1823
1824 // Store the timeout ID
@@ -1824,7 +1845,7 @@ function setupProcessStepHandlers(stepElement, stepHeader) {
1845 e.stopPropagation();
1846 cancelStepCollapse(stepElement);
1847 stepElement.dataset.clicked = "true";
1827 - stepElement.classList.toggle("expanded");
1848 + toggleStepCollapse(stepElement);
1849 });
1850 }
1851 }
webui/js/scroller.js
+2 -1
@@ -6,6 +6,7 @@ export class Scroller {
6 toleranceRem = 2,
7 reapplyDelayMs = 0,
8 reapplyToleranceRatio = 0,
9 + applyStabilization = false,
10 } = {},
11 ) {
12 this.element = element;
@@ -21,7 +22,7 @@ export class Scroller {
22 this._resizeObserver = null;
23 this._lastClientHeight = null;
24
24 - this._initScrollStabilization();
25 + if (applyStabilization) this._initScrollStabilization();
26 }
27
28 _initScrollStabilization() {