fix(web): dialogs and palettes no longer render under the composer slash menu

[shaneeilia-bridgit]

What Changed

Raised the modal overlay layer (dialog, alert dialog, command palette, sheet — backdrops and viewports) from z-50 to z-[80]. Six class strings across five files in apps/web/src/components/ui/; no logic changes.

Why

The composer's / and $ menus portal to document.body at z-[70] (added in #4365 so they win over page content). Modal overlays sat at z-50, so opening one while a slash menu was up — for example clicking New thread or Add project in the sidebar — drew the modal underneath the menu.

Moving the modal layer to 80 slots it above the composer drawer (70) and below toasts (100) and popups/menus/selects (130), so the only relationship that changes is the broken one. Lowering the drawer instead would have re-exposed the page-content stacking bug that 70 was picked to fix.

Reproduced and verified in the web app; the desktop app wraps the same UI.

UI Changes

Slash menu open, then sidebar → New project:

Before	After

Checklist

• This PR is small and focused
• I explained what changed and why
• I included before/after screenshots for any UI changes
• I included a video for animation/interaction changes (not applicable — static stacking fix)

Verified with tsgo --noEmit, vp lint + vp fmt --check on the changed files, and vp test run apps/web/src/components/ui/command.test.tsx.

Implemented by Claude Fable 5 running in Claude Code.

🤖 Generated with Claude Code

---

Note

Low Risk
Tailwind z-index-only changes in shared UI primitives; no auth, data, or runtime logic.

Overview
Fixes modals and palettes rendering under the composer / and $ menus when both are open (e.g. slash menu up, then New thread / Add project from the sidebar).

Modal overlay stacking is bumped from z-50 to z-[80] on shared dialog backdrops (dialog-styles.ts) and on viewports/backdrops for dialog, alert-dialog, command palette, and sheet — six class strings, no behavior changes. That puts overlays above the composer menu layer at z-[70] while staying below toasts (100) and popover-style UI (130).

^{Reviewed by Cursor Bugbot for commit 0545018. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Raise z-index of dialogs, sheets, and command palettes from z-50 to z-[80]

Updates the z-index utility class across the dialog, alert dialog, command palette, and sheet viewports and backdrops so they stack above the composer slash menu. Changes span dialog.tsx, alert-dialog.tsx, command.tsx, sheet.tsx, and dialog-styles.ts.

^{Macroscope summarized 0545018.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 3a2ce744-8280-4dc9-a67c-0766f77bb059

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[macroscopeapp]

Approvability

Verdict: Approved at 0545018

Macroscope's review found this PR approvable — This is a focused six-line stacking-order correction across existing dialog, palette, alert-dialog, and sheet primitives. It places these overlays above the composer menu while preserving the surrounding UI layer hierarchy, with no new logic or broader runtime surface.

^{You can add or adjust custom eligibility rules. Learn more.}