[flamboh]

Note

🤖 Claude Opus 5.5 on behalf of Oliver

Fix for the redesign stack, targets layer 1 (#28839).

Problem

Open a pane below a chat that is scrolled to the end (Ctrl+J for a terminal, or split below). For one frame the chat is already shorter and the composer has moved up, but the timeline has not scrolled yet. The last rows show under the composer and are cut off, then the list catches up a frame later.

The timeline follows its end with LegendList's maintainScrollAtEnd. When the list's viewport resizes, LegendList schedules its scroll to the end in the next animation frame, so the frame where the resize lands paints the old scroll position.

Fix

The timeline now watches its own scroll node with observeResize, which runs before paint. When the viewport resizes while the list is following the end (the same maintainScrollAtEnd setting it passes to LegendList, and LegendList's own at-end threshold), it moves the scroll position to the end right away. LegendList's later scroll then finds nothing to do. The maintainScrollAtEnd value moved into a variable so the prop and the resize handler read the same thing.

This sits on layer 1 because the follow code and the one-frame lag are there already; layer 6 makes it easy to hit because opening a pane below shrinks the chat.

Validation

• New MessagesTimeline.browser.test.tsx case: a timeline at its end shrinks from 1200 to 880 px. A ResizeObserver reads the distance from the end in the resize frame. Before the fix it is 320 px on layers 1, 2 and 6. After the fix it is 0.
• Real app on layer 6 plus this fix, headless Chrome, Replay showcase thread scrolled to the end, then Ctrl+J. Distance from the end in the frame the chat shrinks from 882 to 560 px: 261 px before, 0 px after.
• vp run check:changed origin/maria/redesign/1-primitives-shell: format, lint, knip, typecheck, tests and React Compiler all pass. The full MessagesTimeline and ChatView browser suites pass.

Before / after

Captures pending.

Made with Claude Opus 5.5 in Claude Code (T3 Code).