fix(explorer): scroll the Explore panel vertically on overflow - #423
Merged
Conversation
Contributor
|
✓ Changelog fragment found — thanks! |
The Explorer panel clipped its content: `ExplorerSections` used `overflow-hidden` while Spaces/Folders/Tags each carried percentage height caps (34%+45%+30% = 109%) as non-shrinking flex children, plus an unbounded Pinned/Recent block. When several sections were full the combined height exceeded the panel and the excess was unreachable. Make the whole panel one vertical scroll region: sub-sections grow to their natural height and scroll together, and the virtualized Unfiled list now windows against the shared scroll parent via `scrollMargin` (re-measured with a ResizeObserver as sections above collapse, expand, mount, or unmount) so all content stays reachable and rows stay aligned. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Signed-off-by: xNet Test <test@xnet.dev>
crs48
force-pushed
the
claude/explore-section-vertical-scroll-c43bb1
branch
from
July 9, 2026 02:40
0824d96 to
21d0f71
Compare
Contributor
🖼️ UI changes in this PRNo visual differences detected in the changed UI. |
Contributor
|
Preview removed for PR #423. |
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.
Problem
When the left-nav Explorer panel had a lot of content (many pages, databases, workspaces, folders, tags), it did not scroll vertically — overflowing content was clipped and unreachable.
Root cause:
ExplorerSectionswrapped everything inoverflow-hidden, while the sub-sections each carried percentage height caps as non-shrinking flex children —max-h-[34%](Spaces) +max-h-[45%](Folders) +max-h-[30%](Tags) = 109%, before the unbounded Pinned/Recent block and theflex-1list. When several sections were full, their combined height exceeded the panel and the excess was clipped with no scrollbar.Fix
Make the whole panel one vertical scroll region:
ExplorerSectionsbecomes a singleoverflow-y-autocontainer (relativeso it's the offset parent).max-h-[…%] shrink-0 overflow-y-autocaps and grow to natural height, scrolling together with the Unfiled list.scrollMargin, re-measured with aResizeObserverwhenever the sections above collapse, expand, mount, or unmount (e.g. when a filter hides them).Verification
Drove the real app in the browser preview with 20 workspaces, 20 folders, 20 tags, and 40 pages seeded:
scrollHeight2730 vsclientHeight496 (2234px previously-clipped content now reachable)translateY, no gaps/overlaps, list runs to the last itemscrollMarginre-measure verified — applying a filter unmounts the sections above and the list re-aligns at its new offsetFiles:
apps/webonly (private app — no changeset needed).🤖 Generated with Claude Code