refactor(components): extract upload-desktop-layout store into a hook (maturity X3)

[BigSimmo]

Summary

Maturity X3, continued — another small, self-contained ClinicalDashboard.tsx extraction.

You asked me to do the safe next step. rag.ts (the largest remaining monolith) is not safe
right now — the RAG/eval lane is actively merging (a feat(rag) PR landed minutes before this),
and touching the repo's most-protected file mid-series would conflict and re-enter the merge race.
So this is a clean, low-coupling extraction on a non-RAG UI surface instead.

The upload view's desktop-layout media-query store — uploadDesktopMediaQuery +
subscribeToUploadDesktopLayout + getUploadDesktopLayoutSnapshot, consumed via
useSyncExternalStore — becomes a named hook:

• src/components/clinical-dashboard/use-upload-desktop-layout.ts → useUploadDesktopLayout()

The container now calls useUploadDesktopLayout() instead of inlining the store plumbing.
Behaviour is identical, including the () => false getServerSnapshot that prevents an SSR
hydration mismatch (preserved exactly). ClinicalDashboard.tsx 4,160 → 4,140 lines; the
maintainability budget is ratcheted to 4,140. Off the RAG-ranking lane — no src/lib/rag/**,
retrieval, ranking, or eval files touched.

Verification

• npm run typecheck — 0 errors
• npm run lint — 0 warnings (the now-unused useSyncExternalStore import is removed)
• npm run test — 3,102 passing. The only failure is the pre-existing container-only
  pdf-extraction-budget flake (Python OCR stack absent in this VM).
• npm run check:maintainability-budgets — ratcheted to 4,140, passes
• npm run check:knip — no dead code / orphaned exports (the hook export is consumed)
• UI verification not run: presentation-preserving store→hook extraction with no layout, token, or routing change; the media-query behaviour is unchanged and guarded by the audit-navigation-auth-regressions test.

The audit-navigation-auth-regressions guard that pinned the media-query subscription now
follows the code: it asserts the container wires useUploadDesktopLayout() and the hook
module carries subscribeToUploadDesktopLayout, so the viewport-driven region/tabpanel a11y
role stays guarded.

Risk and rollout

• Risk: low — a single verbatim store→hook extraction; no behaviour, props, or render change
  (the getServerSnapshot is preserved, so SSR/hydration is unchanged).
• Rollback: revert the single commit.
• Provider or production effects: None.

Clinical Governance Preflight

This is a pure presentational refactor (a media-query store extracted verbatim into a hook). It
changes no clinical, privacy, source-governance, or document-access behaviour. The checklist is
completed because the new file path (.../use-upload-desktop-layout.ts) matches the policy
classifier's upload path pattern, which requires the full preflight even though no
document-upload or clinical surface is touched.

• 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

Notes

• Part of the repository-maturity backlog X3. rag.ts remains the largest open decomposition
  target, deferred until the RAG lane is confirmed quiet.

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features

  • Upload and indexing views now automatically switch to a two-region desktop layout on screens 1024px wide and larger.
  • Layout updates respond dynamically when the browser window is resized.

• Bug Fixes

  • Improved consistency for the upload layout during initial page loading, including server-rendered pages, reducing potential display mismatches.

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

📝 Walkthrough

Walkthrough

ClinicalDashboard now uses an extracted useUploadDesktopLayout hook for media-query-based upload layout selection. The hook supports SSR and viewport changes. Related source assertions and the dashboard maintainability budget are updated.

Changes

Upload layout extraction

Layer / File(s)	Summary
Responsive layout hook and dashboard integration src/components/clinical-dashboard/use-upload-desktop-layout.ts, src/components/ClinicalDashboard.tsx	The new hook manages the 1024px media-query subscription, client snapshot, and server fallback; ClinicalDashboard calls it instead of local subscription helpers.
Validation and budget alignment tests/audit-navigation-auth-regressions.test.ts, scripts/check-maintainability-budgets.mjs	Source assertions target the extracted hook, and the dashboard line-count ceiling changes from 4160 to 4140.

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

Possibly related PRs

• BigSimmo/Database#924: Introduces the maintainability budget checker that this change updates.
• BigSimmo/Database#1036: Also modifies ClinicalDashboard.tsx.

Suggested reviewers: cursoragent, copilot

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
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.
Title check	✅ Passed	The title clearly describes the main change: extracting the upload desktop layout store into a hook.
Description check	✅ Passed	The description mostly matches the template, with summary, verification, risk, governance, and notes filled in.

✨ 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/maturity-x3-dashboard-contracts

---

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

[coderabbitai]

🧹 Nitpick comments (1)

tests/audit-navigation-auth-regressions.test.ts (1)

177-182: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Assert the hook wiring, not just the helper name.

Lines 180-182 pass even if subscribeToUploadDesktopLayout remains unused. Match the actual useSyncExternalStore(...) call, including the server snapshot, so this guard detects a disconnected subscription or SSR regression.

Suggested assertion

-    expect(source("src/components/clinical-dashboard/use-upload-desktop-layout.ts")).toContain(
-      "subscribeToUploadDesktopLayout",
-    );
+    const uploadDesktopHookSource = source("src/components/clinical-dashboard/use-upload-desktop-layout.ts");
+    expect(uploadDesktopHookSource).toMatch(
+      /useSyncExternalStore\(\s*subscribeToUploadDesktopLayout,\s*getUploadDesktopLayoutSnapshot,\s*\(\)\s*=>\s*false/,
+    );

🤖 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/audit-navigation-auth-regressions.test.ts` around lines 177 - 182,
Strengthen the assertions around useUploadDesktopLayout() and
subscribeToUploadDesktopLayout so they verify the hook actually wires the
subscription through useSyncExternalStore(...), including its server snapshot
argument. Ensure the test fails when the helper is merely declared or unused and
preserves coverage for disconnected subscriptions and SSR behavior.

🤖 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/audit-navigation-auth-regressions.test.ts`:
- Around line 177-182: Strengthen the assertions around useUploadDesktopLayout()
and subscribeToUploadDesktopLayout so they verify the hook actually wires the
subscription through useSyncExternalStore(...), including its server snapshot
argument. Ensure the test fails when the helper is merely declared or unused and
preserves coverage for disconnected subscriptions and SSR behavior.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: b738c832-a9bd-4922-b45f-3c25bd3ab308

📥 Commits

Reviewing files that changed from the base of the PR and between 7c438f6 and dcc3422.

📒 Files selected for processing (4)

• scripts/check-maintainability-budgets.mjs
• src/components/ClinicalDashboard.tsx
• src/components/clinical-dashboard/use-upload-desktop-layout.ts
• tests/audit-navigation-auth-regressions.test.ts