fix(mobile): prevent header overflow and back-button artifacts

[juliusmarminge]

Why

Long connection-status content can crowd the iOS header, hide its leading content, and turn the direct Settings button into UIKit's overflow menu. Separately, iOS 26.5 morphs the custom leading brand item's rectangle into the next screen's glass back button during navigation.

What Changed

• Render the brand and connection status in the native title slot, separate from toolbar buttons and Back.
• Bound status width using the header's available width and trailing actions, including the iPad sidebar's pane width. Preserve the full accessibility label.
• Preserve the native scroll-edge fade with a non-interactive, empty native label matching the custom title's bounds. Keep Fabric child mounting indices intact.
• Document the title-slot behavior and native rebuild requirements.

Verification

Fresh native Debug build on iPhone 17 Pro, iOS 26.5, using a disposable local environment:

• Three Settings → thread → Back cycles: direct Settings presentation, visible thread actions, and restored branding.
• Native edge-swipe Back and frame-by-frame push/pop inspection: no rectangular back-button morph.
• Accessibility-large text while disconnected: visible, truncated status; no overflow menu; Settings opens directly.
• Status-title tap opens Environments; reconnecting restores the brand.
• Scrolled content retains the blur behind the brand.
• Existing connection-status tests: 8 passed (vp test run apps/mobile/src/features/home/workspace-connection-status.test.ts).
• Mobile typecheck, targeted lint/formatting, and git diff --check passed.

UI Changes

Header-only crops from the simulator recordings:

Before — the leading rectangle morphs into Back:

After — Back remains a separate round control:

Before recording · After push/pop recording

Checklist

• This PR is small and focused
• I explained what changed and why
• I included before/after screenshots for UI changes
• I included videos for animation/interaction changes

Requires a native dev-client rebuild. Refresh CocoaPods after installing the updated patch; a Metro reload alone cannot apply the native change.

---

Note

Medium Risk
Changes core iOS navigation header rendering and ships a native dependency patch; incorrect title/fade behavior would affect every Home/sidebar session and requires a full iOS rebuild to deploy.

Overview
Moves iOS Home and sidebar branding off custom leading toolbar items and into the native headerTitle slot, so the glass back button no longer morphs from the brand rectangle on push/pop (iOS 26.5). Liquid Glass–specific paths (unstable_headerLeftItems, transparent title, BRAND_HEADER_ITEM_IDENTIFIER) are removed from CompactBrandTitle and getConnectionAwareBrandHeaderOptions.

Connection-status headers are width-bounded using available header width minus trailing bar actions (headerWidth, trailingItemCount), with truncation/flexShrink so long labels do not force Settings into UIKit’s overflow menu. Home passes window width; the iPad sidebar passes pane width and refreshes options when width or header items change.

The react-native-screens patch adds an empty native UILabel guide on title/center header subviews (iOS 26) so scroll-edge fade geometry works with Fabric custom title views without drawing over the brand. Internal docs describe the title-slot policy and note that a native dev-client rebuild (CocoaPods refresh) is required for the patch.

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

Note

Fix header overflow and back-button artifacts by moving brand title to headerTitle slot

• Moves brand and connection-status rendering from unstable_headerLeftItems to the headerTitle slot across Home and iPad sidebar headers, avoiding UIKit toolbar-item behavior on iOS 26.5.
• Simplifies brandTitleOffset() to return IPAD_HOME_TITLE_OFFSET on iPad and 0 elsewhere; removes the native-leading-item offset path and deletes renderCompactBrandHeaderItems.
• Adds maxWidth support to WorkspaceConnectionTitle and StatusFadeIn so long labels truncate within available header space; HomeRouteScreen and ThreadNavigationSidebarPane recompute header options on width changes.
• Patches react-native-screens@4.26.2 so iOS 26+ custom title/center subviews contribute geometry for UIKit's scroll-edge fade and support UIBarButtonItem.identifier for transition matching.
• Risk: getCompactBrandHeaderOptions always sets unstable_headerLeftItems to undefined; any caller that previously relied on renderCompactBrandHeaderItems for custom leading items will no longer render them.

^{Macroscope summarized eed8204.}

[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: d1a3bafd-5e9a-41c6-98b3-c12abe4b1239

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

---

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

[github-actions]

Thread transfer impact

✅ Thread transfer remains within every enforced ceiling.

Provider	Metric	Main baseline	This PR	Impact	PR ceiling
Codex	Total thread wire	13.3 KiB	13.3 KiB	−11 B (−0.1%)	15.1 KiB	✅
Codex	Thread snapshot wire	6.9 KiB	6.9 KiB	+2 B (+0.0%)	7.3 KiB	✅
Codex	Live turn WebSocket wire	6.4 KiB	6.4 KiB	−13 B (−0.2%)	7.8 KiB	✅
Codex	Live turn WebSocket decoded	55.6 KiB	55.6 KiB	0 B (0.0%)	66.4 KiB	✅
Codex	Live turn messages	11	11	0 (0.0%)	21	✅
Claude	Total thread wire	13.3 KiB	13.4 KiB	+86 B (+0.6%)	15.1 KiB	✅
Claude	Thread snapshot wire	6.9 KiB	6.9 KiB	+3 B (+0.0%)	7.3 KiB	✅
Claude	Live turn WebSocket wire	6.4 KiB	6.5 KiB	+83 B (+1.3%)	7.8 KiB	✅
Claude	Live turn WebSocket decoded	56.4 KiB	56.4 KiB	+88 B (+0.2%)	66.4 KiB	✅
Claude	Live turn messages	9	11	+2 (+22.2%)	21	✅

Baseline: d22709f · PR result: eed8204 · Source CI: success

Scenario and decoded snapshot size

10 historical turns, 5 command tools per turn, 878.9 KiB retained MCP result per historical turn, and a 1.05 MiB retained result in the measured turn.

• Codex decoded thread snapshot: 109.4 KiB
• Claude decoded thread snapshot: 110.1 KiB

Updated in place by a trusted workflow. PR artifacts are strictly validated and never executed.

[macroscopeapp]

Approvability

Verdict: Not approved

Macroscope's review found this PR not approvable — The PR is a focused mobile header fix, but it replaces existing Home/iPad navigation-header behavior and changes shared iOS 26 native header rendering through a dependency patch. That production runtime surface and required native rebuild make it broader than an auto-approvable UI adjustment.

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

[juliusmarminge]

Additional verification: scroll-edge blur and header fade

Compared native Debug builds of the PR base (d22709f75) and this PR (eed8204a1) on the same iPhone 17 Pro / iOS 26.5 simulator, with the same populated thread list and swipe sequence, in light and dark appearances.

No visible regression observed:

• Content progressively blurs and fades beneath the header; the foreground brand stays crisp and readable.
• The bottom search/filter/compose toolbar retains its blur over the scrolling content.
• Scrolling back to the top restores the clear at-top header state, as before.

These recordings exercise scrolling under the header, not just the push/pop transition. No code changes were needed for this verification pass.

Recordings

Appearance	Before (PR base)	This PR
Light	30-second scroll recording	30-second scroll recording
Dark	30-second scroll recording	30-second scroll recording

Matching scrolled states

Light appearance: before / PR

Before	This PR

Dark appearance: before / PR

Before	This PR