fix(mobile): keep mode-home composer hero-centred on phones and never let it vanish

[BigSimmo]

Summary

• Follow-up to fix(mobile): restore search composer on phone-width mode-home pages #456. That fix stopped the phone-width composer vanish by raising the mode-home hero media query to 640px, which moved the phone composer into the bottom dock and regressed the hero-centred mode-home landing design. Local A/B against pre-merge main (01f2cee0d) confirmed all four Advisory UI regression failures on the fix(mobile): restore search composer on phone-width mode-home pages #456 run are caused by that change (tools launcher is usable at mobile, mode home routes center the shared search on mobile, document search mode lists matching documents and scope actions, phone bottom search dock hides while scrolling down on search results).
• Restores modeHomeComposerMediaQuery to (min-width: 0px) so mode-home shells (dashboard and standalone) portal the composer into the hero at every width, phones included.
• Replaces the media-match-keyed inline suppression with a portal-outcome-keyed fallback: while a slot id is present, the inline composer stays suppressed only until the portal mounts or the slot-retry budget exhausts. This also closes the residual bug fix(mobile): restore search composer on phone-width mode-home pages #456 left at ≥640px, where a slot that never mounted meant no composer rendered anywhere.
• Adds a @critical composer-presence test (390px and 1280px, /?mode=answer and /services) so composer-vanish regressions block merges via the required Critical UI smoke gate; the full 5-route design spec stays in the advisory suite.
• Records the fix(mobile): restore search composer on phone-width mode-home pages #456 review in docs/branch-review-ledger.md.

Verification

• npm run verify:pr-local

During development, use npm run verify:cheap as the faster iteration gate before the final PR-local preflight.

• npm run verify:ui when UI, routing, styling, browser behavior, reduced-motion, or forced-colors behavior changed
• npm run verify:release before release or handoff confidence claims

For retrieval, ranking, selection, chunking, source/citation rendering, or answer-contract changes, verify:pr-local runs eval:rag:offline automatically. Run the offline command directly during iteration before spending a live eval.

• npm run eval:retrieval:quality (must stay 36/36) when retrieval, ranking, selection, chunking, or scoring behavior changed — not applicable: no retrieval/ranking/scoring change
• npm run eval:rag -- --limit 15 + npm run eval:quality -- --rag-only — not applicable: no answer-generation change
• npm run check:production-readiness — not applicable: no clinical workflow, privacy, env, Supabase, governance, or deployment change
• npm run check:deployment-readiness — not applicable: no deployment startup change

Ran locally (all green):

• Targeted chromium regressions + new @critical test: 6/6 pass (tests/ui-tools.spec.ts, tests/ui-smoke.spec.ts grep run against the repo dev server)
• npm run typecheck, npm run lint, focused prettier --check on changed files
• npm run test (vitest 1441: all pass; tests/architecture-boundaries.test.ts needs --testTimeout above 15s on the slow local machine — passes 4/4 at 60s, matching prior ledger runs)
• npm run check:runtime, npm run check:github-actions, npm run sitemap:check

Not run locally: full verify:ui chromium matrix (multi-hour on this machine under load). Equivalent coverage runs in CI on this PR: required Critical UI smoke plus the full Advisory UI regression suite, which this PR is expected to return to green.

Clinical Governance Preflight

Not applicable — this change touches the search composer placement UI and Playwright tests only; no ingestion, answer generation, search/ranking, source rendering, document access, privacy, production env, or clinical output behavior changed.

Notes

• The four advisory failures this fixes are live on main today (merged with fix(mobile): restore search composer on phone-width mode-home pages #456 while its advisory check was red — the check is non-required by design).
• Separate finding, not addressed here: main CI fails on every push because the RAG_QUERY_HASH_SECRET repo secret is missing; the deployment boot smoke exits 1 and release-browser-matrix never runs. Owner is adding the secret.

🤖 Generated with Claude Code

[supabase]

This pull request has been ignored for the connected project sjrfecxgysukkwxsowpy because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[coderabbitai]

Warning

Review limit reached

@BigSimmo, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 7 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 9c74ca42-4477-4ee7-962b-dfaade622571

📥 Commits

Reviewing files that changed from the base of the PR and between 1489164 and 50fa598.

📒 Files selected for processing (1)

• docs/branch-review-ledger.md

📝 Walkthrough

Walkthrough

The mode-home search composer now matches all viewport widths, retries hero portal attachment, and enables an inline fallback after portal unavailability. A critical Playwright test covers phone and desktop routes, and the review ledger gains a new record.

Changes

Mode-home composer availability

Layer / File(s)	Summary
Portal synchronization and fallback rendering src/components/clinical-dashboard/master-search-header.tsx	The composer media query matches from zero width, portal synchronization tracks fallback eligibility, retries missing slots, and updates inline rendering suppression.
Critical viewport regression coverage tests/ui-tools.spec.ts	A critical test verifies one visible global search input inside answer and services mode-home heroes at phone and desktop widths.

Review ledger update

Layer / File(s)	Summary
Review record update docs/branch-review-ledger.md	The Review Records table gains an entry describing the reviewed PR outcome, follow-up shipment, related checks, and an unrelated main CI issue.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Sequence Diagram(s)

sequenceDiagram
  participant MasterSearchHeader
  participant ModeHomeHeroSlot
  participant InlineSearchComposer
  MasterSearchHeader->>ModeHomeHeroSlot: synchronize portal target
  ModeHomeHeroSlot-->>MasterSearchHeader: provide slot or remain unavailable
  MasterSearchHeader->>MasterSearchHeader: retry target attachment
  MasterSearchHeader->>InlineSearchComposer: suppress while portal is active
  MasterSearchHeader->>InlineSearchComposer: enable after fallback eligibility

Loading

---

Caution

Pre-merge checks failed

Please resolve all errors before merging. Addressing warnings is optional.

• Ignore

❌ Failed checks (1 error)

Check name	Status	Explanation	Resolution
Verification Claims	❌ Error	Second and fourth bullets under "Ran locally (all green):" lack explicit pass/fail results for listed commands; only header "all green" implies success without naming results per command.	Add explicit results for each command like "npm run typecheck: passed" instead of just listing commands under an implied "all green" header.

✅ Passed checks (10 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly matches the main change: keeping the mode-home composer visible and centered on mobile.
Description check	✅ Passed	The description follows the repository template with Summary, Verification, Clinical Governance Preflight, and Notes sections filled in.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Generated And Sensitive Files	✅ Passed	No secrets, credentials, tokens, API keys, private keys, .env files, logs, caches, build artifacts, or sensitive config committed. The three files contain documentation with safe git SHAs, componen...
Risky Git Or Deployment Actions	✅ Passed	Changed files add review notes, UI logic, and tests only; diff scan found no force-push/reset/destructive-clean/deploy-without-confirm guidance.
Supabase Project And Schema Safety	✅ Passed	Diff only touches UI/docs; no Supabase project refs, env examples, migrations, schema, RLS, or policy changes found in the changed files.
Runtime And Package Manager Integrity	✅ Passed	No package/runtime manifests changed; diff only touches docs, a TSX component, and a test, while repo still pins npm@11.17.0 and Node 24 with engine-strict enabled.
Api Route Failure Handling	✅ Passed	PR contains no API routes, server actions, RAG, search, ingestion, or provider integration changes—only UI component state refactoring and test additions. Check is not applicable.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/mode-home-composer-hero-fix

✨ Simplify code

• Create PR with simplified code
• Commit simplified code in branch claude/mode-home-composer-hero-fix

---

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

[coderabbitai]

🧹 Nitpick comments (1)

tests/ui-tools.spec.ts (1)

479-483: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚖️ Poor tradeoff

Fallback branch is not positively exercised by this gate.

The count check (Line 480) confirms one input, but the hero-containment assert (Line 483) only passes when the portal path succeeds. If the inline desktopHomeComposerFallback path ever engages (slot never mounts within the retry budget), this test fails rather than validating that the safety net keeps a composer available. Consider adding a companion assertion/case that exercises the fallback so the new core logic has direct coverage.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@tests/ui-tools.spec.ts` around lines 479 - 483, Extend the test around
visibleGlobalSearchInput and the mode-home hero assertion to explicitly simulate
the portal slot failing to mount or timing out, then verify the
desktopHomeComposerFallback renders exactly one visible search input in its
intended fallback location. Keep the existing portal-path assertions, and add a
companion case that positively confirms the fallback composer remains available
without requiring hero containment.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Nitpick comments:
In `@tests/ui-tools.spec.ts`:
- Around line 479-483: Extend the test around visibleGlobalSearchInput and the
mode-home hero assertion to explicitly simulate the portal slot failing to mount
or timing out, then verify the desktopHomeComposerFallback renders exactly one
visible search input in its intended fallback location. Keep the existing
portal-path assertions, and add a companion case that positively confirms the
fallback composer remains available without requiring hero containment.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 0f1088c5-0879-4e28-afb2-f9ec1405f8a1

📥 Commits

Reviewing files that changed from the base of the PR and between 405b09e and 26bddaf.

📒 Files selected for processing (3)

• docs/branch-review-ledger.md
• src/components/clinical-dashboard/master-search-header.tsx
• tests/ui-tools.spec.ts