fix(layout-v2): settle the panel on open, and ship the rail compact by default - #6497
Open
tsahimatsliah wants to merge 2 commits into
Open
fix(layout-v2): settle the panel on open, and ship the rail compact by default#6497tsahimatsliah wants to merge 2 commits into
tsahimatsliah wants to merge 2 commits into
Conversation
The context panel animates its own width from 0 to 240px, and its children stretch to that animating width, so everything inside is being laid out again on every frame of the transition. List panels survive it because their rows are left-aligned and simply get clipped, but the streak panel is built from a 10-column calendar grid and justify-between hero rows: the dot columns redistribute and the rows slide apart for the length of the animation. Pinning the content to the panel's open width leaves the layout settled and lets overflow-hidden reveal it, which is what the other panels already looked like they were doing. Settings keeps stretching, since that panel legitimately fills the whole sidebar. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
The rail's label-free density is the one we want accounts to land on, so an unset `sidebarCompact` now reads as compact. The flag stays three-valued rather than being flipped: unset means the user never chose and gets the new default, while an explicit `false` still means they picked Comfortable and keeps their labels. All three readers go through one hook, because they have to agree without looking related. The rail sizes itself from the flag, MainLayout pads the page content to match that width, and the appearance settings page renders the selected density. Two of them disagreeing puts the content over the rail or leaves a gap beside it. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Two v2 rail fixes. They share
SidebarDesktopV2.tsx, so they ride together as separate commits rather than as two PRs that would conflict with each other.1. Panel content reflows while the panel opens
The context panel animates its own width from 0 to 240px, and its children stretch to that animating width, so everything inside is laid out again on every frame of the transition.
List panels survive it: their rows are left-aligned, so they simply get clipped and it reads as a reveal. The streak panel does not, because it is built from a
grid-cols-10calendar andjustify-betweenhero rows. The dot columns redistribute and the rows slide apart for the length of the animation, which is the "moves in a weird way" the report describes.The content is now pinned to the panel's open width, so the layout stays settled and
overflow-hiddenreveals it. Settings keeps stretching, since that panel legitimately fills the whole sidebar.2. The rail ships compact by default
An unset
sidebarCompactnow reads as compact, so accounts land on the label-free rail.The flag stays three-valued rather than being inverted: unset means the user never chose and gets the new default, while an explicit
falsestill means they picked Comfortable and keeps their labels. Nobody's existing choice flips.All three readers go through one
useSidebarCompact()hook, because they have to agree without looking related: the rail sizes itself from the flag,MainLayoutpads the page content to match that width, and the appearance settings page renders the selected density. Two of them disagreeing puts the content over the rail or leaves a gap beside it.Follow-ups this creates
Verification
typecheck-strict-changedand eslint cleanNot verified in a browser: the v2 rail needs an authenticated session, so the preview on this PR is the real check. Worth watching the panel open on the streak tab specifically, and confirming an account that previously chose Comfortable still gets labels.
🤖 Generated with Claude Code
Preview domain
https://claude-v2-panel-expand-reflow.preview.app.daily.dev