fix(command-center): make new-task tile scrollable in tiled layouts#2995
Open
sufi-ph wants to merge 3 commits into
Open
fix(command-center): make new-task tile scrollable in tiled layouts#2995sufi-ph wants to merge 3 commits into
sufi-ph wants to merge 3 commits into
Conversation
The new-task TaskInput vertically centers its editor with the repo/branch selectors floated above and suggestions floated below. Inside a Command Center tile (overflow-hidden), that absolutely-positioned content overflowed the clipped tile bounds and could not be scrolled into view in the 2x2, 3x2, and 3x3 layouts — only the editor's own internal scroll worked, so the execute button, suggestions, and branch/repo selectors were unreachable without zooming out or switching to a 1x1/1x2 view. Add a `compact` prop to TaskInput that stacks the selectors, editor, and suggestions in normal document flow inside a vertically scrollable column, and wire it from the Command Center tile. Generated-By: PostHog Code Task-Id: 10321b86-ed5b-4ade-9732-1fa4afa11f02
|
React Doctor found no issues in the changed files. 🎉 Reviewed by React Doctor for commit |
Contributor
|
Reviews (1): Last reviewed commit: "fix(command-center): make new-task tile ..." | Re-trigger Greptile |
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
The decorative DotPatternBackground is absolutely positioned at the bottom of its container. In compact mode the container is a scroll container, so the pattern would stay pinned to the visible edge instead of tracking the scrolled content. It's purely cosmetic, so skip it in compact tiles rather than fight the scroll container. Generated-By: PostHog Code Task-Id: 10321b86-ed5b-4ade-9732-1fa4afa11f02
Contributor
|
Reviews (2): Last reviewed commit: "Merge branch 'main' into posthog-code/fi..." | Re-trigger Greptile |
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
In the Command Center, the new-task input vertically centers its editor with the repo/branch selectors floated above it and suggestions floated below. Inside a tile (which clips its content with
overflow-hidden), that absolutely-positioned content overflowed the tile bounds and couldn't be scrolled into view in the 2x2, 3x2, and 3x3 layouts. Only the editor's own internal scroll worked, so the execute button, suggestions, and branch/repo selectors were unreachable without zooming out or switching to a 1x1/1x2 view.Closes #2994
Changes
compactprop toTaskInput. When set, the repo/branch selectors, editor, and suggestions stack in normal document flow inside a vertically scrollable column instead of being absolutely centered/floated. The editor also uses the smallerdefaultmax-height so it doesn't dominate a small tile.compactfrom the Command Center tile (CommandCenterPanel). The full-page new-task screen is unchanged.How did you test this?
pnpm --filter @posthog/ui typecheckandbiome checkpass on the changed files. Not yet verified visually in the running app.Automatic notifications
Created with PostHog from a Slack thread