Fix frontend a11y/layout audit findings: toggle-group + duplicate padding

[BigSimmo]

Summary

Two self-contained frontend P2s from the repo audit. UI-only: no ingestion, answer-generation, retrieval, source-rendering, privacy, or clinical-output surface is touched.

• differentials-home.tsx — orphaned ARIA-tabs pattern → toggle group. The result-type filters used role="tab"/role="tablist" + aria-selected but had no tabpanel, aria-controls, or roving tabindex, so screen readers announced "tab" for controls that don't switch panels and keyboard tab-navigation was broken. They filter a single results list (activeFilter), so they are single-select filters, not tabs. Converted to a proper toggle group (role="group" + aria-pressed), matching the repo's existing toggle-group convention. No test asserted the old roles.
• global-search-shell.tsx — conflicting duplicate padding. The reserves-floating-composer / non-answer / non-compact branch set both sm:pb-[calc(9rem+safe-area)] and sm:pb-8 in one className, so the effective bottom padding depended on Tailwind's class ordering. Kept the calc reserve (matching the answer branch) and dropped the erroneous sm:pb-8.
• tests/ui-tools.spec.ts now queries the differential result-type filters via getByRole("button") to match the toggle-group conversion. The genuine "Overview" tab locator is untouched.

Verification

Offline checks run in this environment:

• npm run lint — clean on the changed files
• npm run typecheck — clean
• npm run test — 53 differentials unit tests pass
• prettier --check — clean on all three files

UI verification not run: the Chromium npm run verify:ui gate is not runnable in this offline environment; browser a11y/layout is exercised by the CI Production UI / Advisory UI regression gates, which passed on this head (run 29582837454).

Risk and rollout

• Risk: low — UI-only accessibility/layout change; no API, data, migration, or clinical-logic path is touched. The toggle-group conversion strictly improves assistive-tech semantics and the padding change removes one conflicting Tailwind class.
• Rollback: revert the squash-merge commit; the change is purely presentational with no schema, migration, or persisted-state impact, so the revert is immediate and side-effect-free.

Clinical Governance Preflight

UI-only change. The policy classifies it as clinical-risk because the file paths contain "clinical" (clinical-dashboard/) and "search" (global-search-shell), not because clinical behavior changed. Every required item holds unchanged:

• Source-backed claims still require linked source verification before clinical use
• No patient-identifiable document workflow was introduced or expanded without explicit governance approval
• Supabase target remains Clinical KB Database (sjrfecxgysukkwxsowpy)
• Service-role keys and private document access remain server-only
• Demo/synthetic content remains clearly separated from real clinical sources
• Source metadata, review status, and outdated/unknown-source behavior remain conservative
• Deployment classification/TGA SaMD impact was checked when clinical decision-support behavior changed

🤖 Generated with Claude Code

https://claude.ai/code/session_019UQUcNriJUVSGRhWz794RQ

Summary by CodeRabbit

• Accessibility

  • Updated differential result controls to use single-select toggle semantics, improving compatibility with assistive technologies.
  • Refined accessible labels and state indicators for result filters.

• Bug Fixes

  • Adjusted responsive bottom spacing in search views to prevent excessive padding on smaller screens.

• Tests

  • Updated narrow-viewport checks to reflect the revised result control behavior and dynamic labels.

[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]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: a9140464-9554-43ed-84ae-17c7478afe54

📥 Commits

Reviewing files that changed from the base of the PR and between 5d195d7 and 746f788.

📒 Files selected for processing (3)

• src/components/clinical-dashboard/differentials-home.tsx
• src/components/clinical-dashboard/global-search-shell.tsx
• tests/ui-tools.spec.ts

---

📝 Walkthrough

Walkthrough

Changes

Differentials UI updates

Layer / File(s)	Summary
Differential filter toggle semantics src/components/clinical-dashboard/differentials-home.tsx, tests/ui-tools.spec.ts	The result filters now use toggle-group semantics with aria-pressed, and narrow-viewport tests query button labels and dimensions.
Search-shell bottom spacing src/components/clinical-dashboard/global-search-shell.tsx	The non-answer, non-compact layout branch removes the extra sm:pb-8 class.

Estimated code review effort: 2 (Simple) | ~10 minutes

Possibly related PRs

• BigSimmo/Database#494: Updates differential tab UI tests and tab-header rendering expectations.

Suggested reviewers: claude

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly summarizes the main UI accessibility and layout fixes in the changeset.
Description check	✅ Passed	The description covers Summary, Verification, Risk and rollout, Clinical Governance Preflight, and Notes, with only minor template-format gaps.
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.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/frontend-a11y-fixes

---

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

[github-actions]

CI triage

CI failed on this PR. Automated classification of the 2 failed job(s):

• UI regression — possible known flake: UI/Playwright job; check tests/flake-ledger.json (tests/ui-smoke.spec.ts, tests/ui-smoke.spec.ts, tests/ui-tools.spec.ts, tests/ui-tools.spec.ts) and re-run before bisecting.
• PR required — possible known flake: UI/Playwright job; check tests/flake-ledger.json (tests/ui-smoke.spec.ts, tests/ui-smoke.spec.ts, tests/ui-tools.spec.ts, tests/ui-tools.spec.ts) and re-run before bisecting.

Heuristic only — a main-side or flake label is a starting point, not a verdict.

[chatgpt-codex-connector]

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.
To continue using code reviews, add credits to your account and enable them for code reviews in your settings.