Project header display options are hidden on touch mobile sidebars

[hxy91819]

Summary

On a compact touch viewport, the Display options trigger in an individual project header is present in the DOM but hidden and non-interactive. This prevents changing sidebar organization or ordering from that header on mobile; built-in section triggers are unaffected.

Versions and environment

• Reproduced from upstream main at 1f4e9e5472bb594a3eb73002d1732b4e8d5df66b (source build).
• Linux aarch64, Node v24.15.0.
• Chrome headless touch emulation, 393 × 852 CSS pixels.

Steps to reproduce

1. Run bb from the commit above and create or open a project that appears in the sidebar.
2. In a touch browser at 767 CSS pixels wide or narrower, open the sidebar.
3. Set Display options → Organize → By project.
4. Look for the sliders trigger on an individual project header (not the built-in Threads or Pinned section header).

Expected vs actual

Expected: the project-header Display options trigger is visible and tappable, like the project actions and new-thread controls beside it.

Actual: the trigger is rendered inside .bb-sidebar-hover-actions; its computed parent style is opacity: 0 and pointer-events: none, so it cannot be seen or tapped. In the same 393 × 852 probe, both (max-width: 767px) and (pointer: coarse) matched.

Evidence

The project-header wrapper on main sets the hover-open state but lacks the mobile-always marker: ProjectRow.tsx at 1f4e9e547. The existing mobile CSS shows only .bb-sidebar-hover-actions[data-sidebar-hover-actions-mobile="always"].

A minimal verified fix is available in hxy91819/bb@30f71b335: it applies the existing mobile marker to this wrapper and adds a focused regression test.

What I ruled out

• Searched open and closed issues for mobile display options, Sidebar display options, project-header mobile actions, and mobile sidebar pointer-events; no duplicate found.
• This reproduces on upstream main without the separate Recent activity feature. The same missing marker also exists in desktop-v0.42.1.
• The media-query condition itself is not the cause; both conditions matched during the probe.

Suggested priority and effort

Low effort, mobile-only UI defect; users can configure the sidebar from a desktop viewport, and no data is lost.

AGENT GENERATED

[bb-slop-cop]

🚨 SLOP COP 🚨 · new-issue-autopilot

Classified as Bug · Low priority · Low effort; labels: ui, mobile, confirmed-repro.

Reproduction report: REPRODUCED, high root-cause confidence. The project header wrapper lacks the mobile visibility marker required by the compact-touch CSS. Source-extracted browser fixtures reproduced invisible, untappable controls in two clean checkouts; full-app and Safari verification remain unverified.

Fix: #3352 — 34 added lines across two files. Both regression assertions failed before the fix; all 62 selected tests passed afterward, and the browser control received a touch tap. Lint passed with zero errors.

[hxy91819]

Local aggregate verification

This is correctly classified as a mobile UI bug, and it remains part of the local aggregate through hxy91819/bb@fix/mobile-display-options, commit 30f71b335.

The fix is intentionally minimal: it applies the existing coarse-mobile visibility marker to the project-header hover-actions wrapper, so the already-rendered Display options control remains visible and tappable on touch sidebars. It does not introduce a new mobile-only control or change desktop interaction behavior.

I reran the focused verification on that branch:

• pnpm exec turbo run test --filter=@bb/app --only -- --run src/components/sidebar/ProjectRow.interactions.test.tsx — 1 file, 12 tests passed.
• pnpm exec turbo run typecheck --filter=@bb/app — passed.

AGENT GENERATED