fix(spaces): quill up the spaces nav, list highlight and search field by adamleithp · Pull Request #3878 · PostHog/code

adamleithp · 2026-07-28T15:05:04Z

Design nits on the spaces layout, following #3864. All behind code-spaces-layout.

What changes

The search field moves over the content pane — out of the < > group in the title bar, into a Slack-style field spanning the content column. It's a button wearing a field's clothes: magnifier, placeholder, ⌘K hint. Opens the same command menu.
The nav icons are quill Buttons, with the data-selected treatment the channel rows already use, so the nav and the list read as one control set in either theme.
The list's highlight is quill's list convention, not its popup one. quill renders every AutocompleteItem with data-highlighted:ring-2 ring-offset-1 — right for a floating listbox, a stray outline on a sidebar row, and loud enough at dark-theme contrast to outshout the selected row beside it. Overridden to the hover fill, matching ProjectSwitcher.
One tooltip provider across the three nav icons. primitives/Tooltip mounts a provider inside every tooltip, and the skip-delay window is provider state — three isolated providers never share it, so every hop between neighbours paid the full warm-up again. They move to quill's Tooltip under a single provider.
The last two sidebar tooltips move to quill too — the create FAB and the "Back to spaces" row still rendered the old dark card. The FAB carried both implementations (quill off the layout, legacy on it); its branches collapse into one quill tooltip that only chooses the text.
The Inbox envelope fills when active, like the bell and the bolt; it was the only icon left at a fixed weight.

Notes

--fill-selected and --fill-hover are per-theme tokens (6%/10% and 4%/7% of foreground), so highlight sits below selected in weight in both light and dark. The light-mode gap is the narrow one — worth an eyeball.

The other call sites of primitives/Tooltip have the same isolated-provider limitation; only these three changed here.

Testing

Typecheck clean; 306 tests pass across canvas + command.

Hover Inbox, then slide across Activity → Command Center — each tooltip appears instantly. Step away and back — full delay again.
Arrow through the spaces list — highlight is a fill, no outline ring; the space you're in stays distinguishable. Check both themes.
Search field stays centred over the content column as the window resizes and the sidebar is dragged wider; click and ⌘K both open the menu; the bar beside it still drags the window.
Flag off — tab strip back, no search field, nav untouched.

🤖 Generated with Claude Code

trunk-io · 2026-07-28T15:05:08Z

😎 Merged directly without going through the merge queue, as the queue was empty and the PR was up to date with the target branch - details.

github-actions · 2026-07-28T15:05:46Z

React Doctor found no issues in the changed files. 🎉

_{Reviewed by React Doctor for commit e04e09c.}

greptile-apps · 2026-07-28T15:08:00Z

_{Reviews (1): Last reviewed commit: "fix(spaces): share one tooltip provider ..." | Re-trigger Greptile}

github-actions

Contained, reversible UI/design polish behind the code-spaces-layout flag (nav icon styling, shared tooltip provider, list highlight override, new search bar component) — no risky territory (no auth, billing, API, data model, CI, or dependency changes), and the diff matches the description with no unresolved reviewer concerns.

Author wrote 3% of the modified lines and has 20 merged PRs in these paths (familiarity MODERATE).
👍 on the PR from greptile-apps[bot].

Gate mechanics and policy version

Gate		Result
prerequisites	✓	all clear
deny-list	✓	no deny categories matched
size	✓	266L, 5F substantive — within ceiling
tier	✓	T1-agent / T1c-medium (266L, 5F, single-area, fix)
stamphog 2.0.0b3		`.stamphog/policy.yml` @ `2a074aa` · reviewed head `0abcf8d`

New commits pushed (delta classified non_trivial_delta) — stamphog approval dismissed; re-review running automatically.

github-actions

Purely cosmetic UI changes (tooltip provider consolidation, list highlight styling, search bar placement) behind a feature flag, with no touch on auth, billing, data models, APIs, deps, or CI — diff matches the description and carries no showstoppers.

Author wrote 2% of the modified lines and has 20 merged PRs in these paths (familiarity MODERATE).
👍 on the PR from greptile-apps[bot].

Gate mechanics and policy version

Gate		Result
prerequisites	✓	all clear
deny-list	✓	no deny categories matched
size	✓	399L, 7F substantive — within ceiling
tier	✓	T1-agent / T1d-complex (399L, 7F, single-area, fix)
stamphog 2.0.0b3		`.stamphog/policy.yml` @ `2a074aa` · reviewed head `5131210`

puemos

Ok to merge but i do think the search can be even better

puemos · 2026-07-28T15:24:28Z

-            <TabShortcutFallback enabled />
+            <>
+              <TabShortcutFallback enabled />
+              <CommandSearchBar onClick={toggleCommandMenu} />


Not sure why but this is not in the middle

i think we can make it shorter and also position in the absolute center

The nav's three icons each mounted their own tooltip provider, because that is what primitives/Tooltip does — and the skip-delay window is provider state, so three isolated providers never share it. Every hop between neighbouring icons paid the full warm-up again. They move to quill's Tooltip under a single provider, so once one tooltip is up its neighbour appears immediately. The shortcut hint that the old primitive took as a prop is a quill Kbd in the content now. The Inbox envelope was also the only icon left at a fixed weight, so it alone stayed outlined while it was the active view. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

The create button and the back row still used primitives/Tooltip, so they rendered the old dark card next to the nav's quill ones. The FAB carried both: quill off the layout, the legacy one on it. Its two branches collapse into a single quill tooltip that only chooses the text, with the create shortcut as a Kbd rather than the old primitive's prop. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

#me can't be starred, and the greyed-out star standing in for the control read as one you were being denied rather than one that doesn't apply. The well itself stays — it is a reserved span inside the button, not the star — so the row is still the same height on every space and nothing below it shifts when you switch. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

New commits pushed (delta classified non_linear_history) — stamphog approval dismissed; re-review running automatically.

github-actions

Contained, feature-flagged UI/design polish (tooltips, list highlight styling, search bar placement) entirely within packages/ui — no data models, APIs, auth, billing, dependencies, or CI touched. The one unresolved review comment is a cosmetic centering nit, not a correctness or safety concern, and the reviewer already approved with that as a minor suggestion.

Author wrote 2% of the modified lines and has 20 merged PRs in these paths (familiarity MODERATE).
👍 on the PR from greptile-apps[bot].

Gate mechanics and policy version

Gate		Result
prerequisites	✓	all clear
deny-list	✓	no deny categories matched
size	✓	440L, 7F substantive, 445L/8F incl. docs/generated/snapshots — within ceiling
tier	✓	T1-agent / T1d-complex (445L, 8F, single-area, fix)
stamphog 2.0.0b3		`.stamphog/policy.yml` @ `36353aa` · reviewed head `e04e09c`

adamleithp · 2026-07-28T18:08:22Z

/trunk merge

adamleithp added the Stamphog This will request an autostamp by stamphog on small changes label Jul 28, 2026

github-actions Bot previously approved these changes Jul 28, 2026

View reviewed changes

puemos self-requested a review July 28, 2026 15:23

puemos approved these changes Jul 28, 2026

View reviewed changes

puemos added the Create Release This will trigger a new release label Jul 28, 2026

adamleithp and others added 6 commits July 28, 2026 18:54

search center top

03bb254

quill buttons, better selected state for space list

127724a

spacing around search and width reduction

e04e09c

adamleithp force-pushed the code-spaces-layout-nits branch from d5b303a to e04e09c Compare July 28, 2026 17:58

github-actions Bot approved these changes Jul 28, 2026

View reviewed changes

adamleithp enabled auto-merge (squash) July 28, 2026 18:01

trunk-io Bot merged commit b416166 into main Jul 28, 2026
32 checks passed

trunk-io Bot deleted the code-spaces-layout-nits branch July 28, 2026 18:08

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

fix(spaces): quill up the spaces nav, list highlight and search field - #3878

fix(spaces): quill up the spaces nav, list highlight and search field#3878
trunk-io[bot] merged 6 commits into
mainfrom
code-spaces-layout-nits

adamleithp commented Jul 28, 2026 •

edited

Loading

Uh oh!

trunk-io Bot commented Jul 28, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Jul 28, 2026 •

edited

Loading

Uh oh!

greptile-apps Bot commented Jul 28, 2026

Uh oh!

github-actions Bot left a comment

Uh oh!

github-actions Bot left a comment

Uh oh!

puemos left a comment

Uh oh!

puemos Jul 28, 2026

Uh oh!

github-actions Bot left a comment

Uh oh!

adamleithp commented Jul 28, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

adamleithp commented Jul 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What changes

Notes

Testing

Uh oh!

trunk-io Bot commented Jul 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented Jul 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

greptile-apps Bot commented Jul 28, 2026

Uh oh!

github-actions Bot left a comment

Choose a reason for hiding this comment

Uh oh!

github-actions Bot left a comment

Choose a reason for hiding this comment

Uh oh!

puemos left a comment

Choose a reason for hiding this comment

Uh oh!

puemos Jul 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot left a comment

Choose a reason for hiding this comment

Uh oh!

adamleithp commented Jul 28, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

adamleithp commented Jul 28, 2026 •

edited

Loading

trunk-io Bot commented Jul 28, 2026 •

edited

Loading

github-actions Bot commented Jul 28, 2026 •

edited

Loading