[flamboh]

Note

🤖 Claude Opus 5.5 on behalf of Oliver

Fix for the redesign stack, targets layer 2 (#28840).

The live "Working for" fold and the finished "Worked for" fold are the same bar before and after a turn ends, but they behaved differently. The finished fold and the wake-ups fold had no caret. The live fold showed a caret and toggled even when its few rows already fit, so clicking it only flipped the caret. And if you had the live history open when the turn ended, it snapped shut.

Now all three folds follow one rule:

• One caret. The finished fold and the wake-ups fold use the same right↔down morphing caret as the live bar.
• A toggle only when it does something. The live bar is inert (no caret, no hover, not focusable, no aria-expanded) while its history fits in the collapsed view. Once rows stream past that height, the caret fades in without moving the label. If the fold is open, it stays togglable. The finished fold already hides all its work, so it is togglable whenever it has work to show.
• Same bar. The live and finished fold labels share one control, so they get the same hover, focus ring, and caret.
• The hand-off keeps your choice. A history that is open when the turn ends stays open as the finished fold.
• Opening fades the work in. When you open the finished fold or the wake-ups fold, the rows it reveals fade in once, with the live fold's 200 ms ease-out. Closing stays instant, and reduced motion gets no fade. It is a fade, not a height slide, because opacity runs on the compositor: no layout work, and the rows below don't have to move with it. Rows that mount later while you scroll the open fold don't fade again.

Audit: live bar vs finished fold

	Live "Working for"	Finished "Worked for"	Result
Caret	right↔down morph	right↔down morph	Same (was missing on the finished fold)
When it toggles	once its history overflows	whenever it has work	Same rule
Hover, focus ring	shared control	shared control	Same
Open state at turn end	kept	kept	Same (was snapping shut)
Open motion	200 ms height ease-out	200 ms opacity fade-in	Same timing (was none)
Label typography	13px, weight 500, line height 17.94px, letter spacing normal, oklab(0.633 0 0), label box 17.94px tall	identical on every value	Same, measured on layer 2 and on this branch

The label typography row is measured, not read off the classes: computed styles in a 1000 px wide dark window, on layer 2 and on this branch, with no ancestor opacity, filter, mask or transform on either label. The live label can look larger next to the finished one, but the shared "Wor" glyphs are pixel-identical in both captures. The difference you see is the "g" descender in "Working".

Before / after

Before (layer 2)	After

Replay only, 1000 × 900, light theme, 2×. The slow turn is a local, uncommitted transcript swap (14 echo steps, about 26 seconds).

Live overflow, expand/collapse, then finished fold hover and toggle — before (layer 2):

https://gh-file-drop-api-prod-galwoqjslzlnws6s.oliver-boorstein.workers.dev/f/9478c6417e0f589e/before-toggle.mp4

After:

https://gh-file-drop-api-prod-galwoqjslzlnws6s.oliver-boorstein.workers.dev/f/7b0fedb6e9b8c34d/after-toggle.mp4

Open history across turn completion — before (layer 2):

https://gh-file-drop-api-prod-galwoqjslzlnws6s.oliver-boorstein.workers.dev/f/8a2c8044d8c42238/before-handoff.mp4

After:

https://gh-file-drop-api-prod-galwoqjslzlnws6s.oliver-boorstein.workers.dev/f/5bd0fa9bd97fc7d4/after-handoff.mp4

The after history is opened once overflow enables its toggle; before that, it is inert.

Opening and closing the finished fold. The first open and close run at normal speed, the second is slowed 5×:

https://gh-file-drop-api-prod-galwoqjslzlnws6s.oliver-boorstein.workers.dev/f/65e580b5ae17acf2/finished-fold-fade.mp4

Label typography on this branch, same window and theme:

Live bar	Finished fold

Validation

• New browser test in MessagesTimeline.browser.test.tsx: the live bar is not a toggle with 2 rows, becomes one at 30, and its open state carries into the finished fold. Fails on the layer, passes here. The whole file passes (50 tests).
• Ran a slowed Replay turn on a dev server and checked the live bar was inert until its history passed 212px, then togglable. Also checked the finished fold's caret, and that an open history stays open after the turn ends.
• The browser test that opens a finished fold also checks the fade: only the revealed row fades, and the fade mark is gone once it ends, so a later remount cannot replay it. Fails without the fade, passes here. The whole file passes (51 tests).
• On a Replay dev server: the revealed row went from opacity 0.13 to 0.96 in 139 ms and its mark was cleared at about 200 ms. Closing started no fade, and reduced motion started none. With about 100 rows open, scrolling away and back mounted rows 40 times, remounted the revealed row 3 times, and replayed no fade.
• vp run check:changed against the layer: all pass.

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

Takeover verification

merged current main and the updated redesign base without rebasing at 64d377469a. blacksmith vp run check:changed passes format, lint, knip, 40 affected typechecks, 2,478 tests including 51 timeline browser tests, and compiler coverage. two independent source reviews approved the same head. all 33 check contexts completed without failures or pending checks; no conflicts or unresolved review threads.

chrome replay verification passed finished-fold mouse, space, and enter toggles, reduced motion, and the 800px layout. real providers, native clients, and remote connections were not rerun in this pass.

verified by gpt-6.1-sol through the codex harness in t3 code.

Dismissing prior approval to re-evaluate 64d3774