Skip to content

redesign channels: single-column sidebar + full-width title bar#2730

Open
adamleithp wants to merge 3 commits into
mainfrom
bluebird/ui-update
Open

redesign channels: single-column sidebar + full-width title bar#2730
adamleithp wants to merge 3 commits into
mainfrom
bluebird/ui-update

Conversation

@adamleithp

@adamleithp adamleithp commented Jun 17, 2026

Copy link
Copy Markdown
Contributor

Summary

Redesign of the Channels space UI — moves from a two-column layout (app rail + 260px channel pane) to a single self-contained sidebar under a full-width title bar.

2026-06-17 15 53 59

Possible nits you may have

  • that bar at the top is so empty!... yes, but that's room for search/help button...
  • Another window in a window design? Meh, yea for now. It's all just temporary anyways.
  • How do i get back to "Code"? Just hit home at the top or any other main nav items, they're not ported over and just reroute to the other

Layout

  • New ChannelsSidebar: one 220px column owning the left pane — workspace switcher (top), global nav, channel tree, Settings (pinned bottom). No app rail in this space.
  • __root.tsx Channels-space layout reworked into a vertical shell with a full-width title bar carrying the PostHog mark (left-padded to clear the macOS stoplights). Drops the old AppNav + bordered 260px column.
  • Global nav (Home / Global Inbox / Agents / Files) folded into the sidebar as SidebarItem rows via ChannelsNav.

Project switcher

  • ProjectSwitcher gains a compact button trigger variant (project name + chevron) for the Channels header, alongside the existing item variant used in the Code sidebar.
  • Menu width is now per-variant: button pins a fixed w-64 (the full-width trigger would otherwise stretch the menu via --anchor-width and break its layout); item still matches its anchor.

Dashboards / data

  • DashboardsService.list now filters a single listAll() by meta.channelId instead of a per-channel server-side parent query, simplifying the path.
  • Removes now-unused fields from domain-types and the posthog-client.

Test

  • pnpm --filter @posthog/ui typecheck clean.
  • Lint + typecheck pass via pre-commit hooks.

🤖 Generated with Claude Code

@adamleithp adamleithp added the Stamphog This will request an autostamp by stamphog on small changes label Jun 17, 2026
@adamleithp adamleithp enabled auto-merge (squash) June 17, 2026 12:50
@greptile-apps

greptile-apps Bot commented Jun 17, 2026

Copy link
Copy Markdown
Contributor

Comments Outside Diff (1)

  1. packages/ui/src/styles/globals.css, line 1879-1881 (link)

    P2 Global hover rule affects all outline buttons

    This rule targets every .quill-button--variant-outline element app-wide, not just the ProjectSwitcher trigger. Any existing outline button that had a different hover treatment (or intentionally no hover background) will silently pick up var(--color-fill-hover) after this change. The side-effect is invisible in the PR diff but could produce visual regressions across unrelated surfaces.

    Prompt To Fix With AI
    This is a comment left during a code review.
    Path: packages/ui/src/styles/globals.css
    Line: 1879-1881
    
    Comment:
    **Global hover rule affects all outline buttons**
    
    This rule targets every `.quill-button--variant-outline` element app-wide, not just the `ProjectSwitcher` trigger. Any existing outline button that had a different hover treatment (or intentionally no hover background) will silently pick up `var(--color-fill-hover)` after this change. The side-effect is invisible in the PR diff but could produce visual regressions across unrelated surfaces.
    
    How can I resolve this? If you propose a fix, please make it concise.

    Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!

Prompt To Fix All With AI
Fix the following 1 code review issue. Work through them one at a time, proposing concise fixes.

---

### Issue 1 of 1
packages/ui/src/styles/globals.css:1879-1881
**Global hover rule affects all outline buttons**

This rule targets every `.quill-button--variant-outline` element app-wide, not just the `ProjectSwitcher` trigger. Any existing outline button that had a different hover treatment (or intentionally no hover background) will silently pick up `var(--color-fill-hover)` after this change. The side-effect is invisible in the PR diff but could produce visual regressions across unrelated surfaces.

Reviews (1): Last reviewed commit: "fix(channels): pin project switcher menu..." | Re-trigger Greptile

@adamleithp adamleithp changed the title fix(channels): pin project switcher menu width in button variant redesign channels: single-column sidebar + full-width title bar Jun 17, 2026
adamleithp and others added 2 commits June 17, 2026 14:14
The button-variant trigger spans the full sidebar width, so binding the
dropdown to --anchor-width stretched the menu and broke its layout. Pin a
fixed width for the button variant; the item variant still matches its anchor.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@adamleithp adamleithp force-pushed the bluebird/ui-update branch from 2d8ca4d to cfbd30a Compare June 17, 2026 13:15
@stamphog

stamphog Bot commented Jun 17, 2026

Copy link
Copy Markdown

Review agent failed — check the workflow run and re-apply the label to retry.

@github-actions

github-actions Bot commented Jun 17, 2026

Copy link
Copy Markdown

React Doctor found no issues in the changed files. 🎉

Reviewed by React Doctor for commit 3754929.

@stamphog stamphog Bot removed the Stamphog This will request an autostamp by stamphog on small changes label Jun 17, 2026
@adamleithp adamleithp requested a review from raquelmsmith June 17, 2026 14:11

@stamphog stamphog Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is a pure UI redesign with no logic, security, or data model changes, but at 711 lines it exceeds the auto-approval size ceiling and has zero reviews — request a teammate review before merging.

@adamleithp adamleithp removed the request for review from raquelmsmith June 17, 2026 14:24
Bring back the Starred sidebar group removed in the channels redesign:
starred channels list under a star-icon label, the rest under "Channels".

Wrap each channel header row in a single quill ButtonGroup so the "# name"
toggle joins with the hover actions (new task + options menu). Lift the
options-menu open state so the actions stay visible while the menu is open,
and reserve the name's trailing padding on hover or while open.

Also: drop a stray "xxx" prefix in SectionBody, swap ScrollArea for a plain
overflow div in WebsiteDashboard, and use rounded-sm on genui cards/tables.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@adamleithp adamleithp requested a review from raquelmsmith June 17, 2026 14:55
@raquelmsmith

Copy link
Copy Markdown
Member

This looks great. Two things: https://www.loom.com/share/95b33022b38c469480ccbfc2a9836289

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants