feat(ui): tools & favourites mockups + design-token adoption + clinical UI polish by BigSimmo · Pull Request #225 · BigSimmo/Database

BigSimmo · 2026-07-03T07:51:35Z

Accumulated work on feature/tools-page-mockups since #215.

What's in it

Mockups: tools-page (command-center / split-pane / workflow-board), favourites, and task-directory concepts.
Design-token adoption (see docs/redesign/07-token-adoption-audit.md):
- M1 — removed the dead @theme inline colour bridge (0 consumers repo-wide).
- M2 — routed hand-rolled tone helpers through the semantic --danger/--info/--warning/--success triads (dark-mode + forced-colors safe). Differentials warning → --danger (red) because that tone renders "Must-not-miss" red-flags; amber --warning stays for status === "urgent".
- M3 — added size-only type-scale tokens (--text-4xs … --text-base-minus) and adopted them across the clinical UI.
- L5 / L7 — accent-ring token + rounded-[var(--radius-lg)] → rounded-lg cleanup.
- L6 — tokenized WCAG tap targets onto the -11/-12 spacing scale; 0 arbitrary min-h-[44px]/[48px] remain repo-wide.
- L8 — added the focus-visible ring to the controlBase button family (keyboard a11y) + a recipe reference at docs/redesign/09-ui-primitives-recipes.md.
Design-review polish, plus db / build / search fixes.

Verification

npm run typecheck — clean (baseline HEAD and post-L6-fix, verified in an isolated worktree at the branch tip).

Notes

This bundles work from multiple sessions; the design-token-adoption slice is the part authored and verified here.
The remaining M3 tail (3 one-off text-[17/18/22px]) is being handled separately in claude/type-scale-display-tokens — out of scope for this PR.

🤖 Generated with Claude Code

- differentials detail: give each Compare Basket item its own severity tag (shared likelihoodTag helper) instead of stamping the parent's status on all items; show the real related count instead of length + 8 - differentials stream: replace internal QA-scaffolding copy ("Stream helper / workflow verification only") with clinician-facing "Keep exploring" guidance - services: expand "ATSI" display labels to "Aboriginal and Torres Strait Islander" while keeping "ATSI" as a search keyword in tags; rename the duplicate "Find a service" card to "Search services" - favourites: derive saved-set counts from real items (2/2/1 vs 12/9/7), relabel the ambiguous "Active" stat to "Filters", fix "1 item" pluralization Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

…ar, form Commits the current working-tree state of these four files, which also carries in-progress edits already present on this branch. Design-review changes here: - service detail: use break-words instead of break-all so referral values no longer split mid-word ("service" -> "servic e", "Strait" -> "Stra it") - master search header: use the magnifier submit affordance for every search-mode home; differentials no longer uses the send arrow - sidebar: expand tool labels to full words (Favourites, Differentials, Medications) for consistency with the rest of the nav - form detail: render Verification notes as proper sentences (joinNotes) instead of a bare space-joined run-on Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

… build Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

…d mockups Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

…uum, drop dead indexes Postgres best-practices audit of the live Clinical KB Database found: an unindexed FK on storage_cleanup_jobs.document_id, document_embedding_fields (largest table, 215k+ rows, backs an HNSW index) missing the autovacuum tuning its sibling RAG tables already have, no idle-in-transaction timeout on the authenticator role, and 4 dead/duplicate indexes (~25MB) not referenced by any query or by search_schema_health()'s required_indexes invariant. All changes already applied live via Supabase MCP and verified (search_schema_health() still reports ok:true). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

… clinical UI Consolidates the in-progress design-token / design-review sweep from the working tree of this shared checkout (38 files): - globals.css: add size-only type-scale steps (--text-4xs/3xs/2xs/sm-minus/ base-minus) and remove the dead `@theme inline` colour bridge; per-theme values are consumed directly via var() so .dark overrides cascade. - Migrate hardcoded `text-[Npx]` sizes and ad-hoc values to the new tokens across dashboard, differentials, forms, services, document, and mockup surfaces. - Update ui-smoke / ui-stress / ui-tools specs to match. Excludes tools-page-mockup-page.tsx: its sweep edit was a mid-flight extraction into ./tool-fixtures + ./use-tool-filter (modules not yet committed), left as the owning session's WIP. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

- 07-token-adoption-audit.md: report from the design-token adoption sweep. - 08-design-review-prompt.md: the design-review prompt driving the UI pass. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

Agent-Logs-Url: https://github.com/BigSimmo/Database/sessions/04eecc73-9b51-4991-b626-aae1673f2d8a

…ckups # Conflicts: # scripts/run-eval-safe.mjs # src/components/ClinicalDashboard.tsx # src/components/DocumentViewer.tsx # src/components/clinical-dashboard/differentials-home.tsx # src/components/clinical-dashboard/global-mockup-search-shell.tsx # src/components/clinical-dashboard/master-search-header.tsx # src/components/differentials/differential-detail-page.tsx # src/components/forms/forms-search-results-page.tsx # tests/ui-tools.spec.ts

… feature/tools-page-mockups # Conflicts: # src/components/ClinicalDashboard.tsx # supabase/migrations/20260703000000_storage_cleanup_fk_index_and_embedding_fields_autovacuum.sql # supabase/schema.sql # tests/supabase-schema.test.ts

… feature/tools-page-mockups # Conflicts: # scripts/run-eval-safe.mjs # src/components/ClinicalDashboard.tsx # src/components/DocumentViewer.tsx # src/components/clinical-dashboard/differentials-home.tsx # src/components/clinical-dashboard/global-mockup-search-shell.tsx # src/components/forms/forms-search-results-page.tsx # tests/ui-tools.spec.ts

Swap the 15 leftover arbitrary min-h-[44px]/[48px] tap targets in ClinicalDashboard, answer-content, and evidence-panels to the -11/-12 spacing scale (output-identical, 11x4px=44, 12x4px=48). Completes L6 from the token-adoption audit; 0 arbitrary tap tokens remain repo-wide. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

- shellChip: min-h-10 -> min-h-11 (40->44px, meets WCAG tap minimum) - add disabled:cursor-not-allowed disabled:opacity-50 to navPill, chatMicroAction, chatComposerIconButton, sidebarItem so they honour the documented disabled state - 09-ui-primitives-recipes.md: mark contract gaps 3 & 4 closed Gap 2 (active-press feedback across more buttons) left as an aesthetic/design-team call. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 8b2cd7f72e

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

…icts) Brings main's 8 commits into the PR #225 branch. Resolved 11 conflicts: - globals.css + 2 chat-UI docs: took main (merged type-scale --text-lg-minus/ --text-2xl-minus tokens; colour-alignment doc notes). - tools-page-mockup-page.tsx: took main's #226 "tool-card title on its own line". - differentials-home.tsx: took main's docked mobile compare bar. - tool-fixtures.ts: took main's "Saved" personal-area label. - tests/ui-tools.spec.ts: took main's added tablet comparison test. - ui-primitives.tsx + docs/redesign/09: kept the branch's L8 disabled-state contract. - differential-presentation-workflow-page.tsx: kept the branch's 2-button mobile bar. - global-mockup-search-shell.tsx: dropped the workflowCopyText prop — main's header refactor removed its receiver, so the header copy-summary button is superseded. Typecheck clean on the merge result. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

- differentials-home: gate the ranked SearchResultsView on an actual search (loading || evidence matches) instead of any typed text, so the hard-coded demo rankings no longer render for arbitrary or no-match queries [P1] - ClinicalDashboard: treat services/forms registry search as ready independently of document-search setup (no more "complete Documents setup" warning over service matches) [P2] - DocumentViewer: restore dashboard-composer-edge on the fixed composer so it clears the desktop sidebar instead of sitting under it [P2] - DocumentViewer: drop sticky top-0 on the inner document header so it no longer competes with the shell's sticky global header on scroll [P2] Left for the owning session: the tools run-mode submit finding (detail panel hidden) — the fix changes intended run-mode layout / submit flow. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: d1131e871f

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Dashboard-tools run mode hides the detail panel on desktop, so submitting the tools search only called selectApplication() with no visible effect. Now, when the panel is hidden on desktop, submit launches the top-matching tool (router.push, or a new tab for external apps) instead — keeping the tested panel-hidden full-width layout intact. Clears the last review-bot finding. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

- differentials-home gate: clear documentMatches when the query is edited so an edited-but-unsubmitted query can't re-render the prior search's rankings via stale evidence matches - DocumentViewer composer: keep floating-composer-edge alongside dashboard-composer-edge so it retains its bottom inset (the dashboard edge only sets horizontal offsets) while still clearing the desktop sidebar Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 80d1399bea

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

chatgpt-codex-connector · 2026-07-03T09:51:05Z

+                  onQueryChange={(nextQuery) => {
+                    setQuery(nextQuery);
+                    // Clear stale evidence so an edited (but unsubmitted) query
+                    // doesn't keep rendering the previous search's rankings.
+                    setDocumentMatches([]);


Clear stale differential matches from the active composer

Fresh evidence in this revision is that stale evidence is cleared only through the DifferentialsHome callback, but the visible/portaled composer is owned by MasterSearchHeader and still receives onQueryChange={setQuery}. After a successful differential search, editing that composer on the differential home page leaves the old documentMatches populated, so hasEvidenceMatches remains true and SearchResultsView can render the previous query's rankings under the new unsubmitted text; clear matches in the header query path or key matches to the submitted query.

Useful? React with 👍 / 👎.

chatgpt-codex-connector · 2026-07-03T09:51:05Z

+    if (!firstMatch) return;
+    // Dashboard-tools run mode hides the detail panel on desktop, so selecting a
+    // match has no visible effect — launch the top match directly instead.
+    if (isDashboardTools && !showDetailPanel && desktopViewport) {


Move tools run-mode launch handling to the dashboard submit path

Fresh evidence in this revision is that the new launch behavior is added to submitFooterSearch, but that handler is only attached to the standalone launcher form in the non-dashboard branch; the dashboard-tools view renders the isDashboardTools branch and uses the shared MasterSearchHeader submit path instead. In /?mode=tools&...&run=1 on desktop, where the detail panel is hidden, pressing Enter still only runs executeSearch for tools and shows the filter notice rather than launching the top match, so this branch never fixes the run-mode submit interaction.

Useful? React with 👍 / 👎.

BigSimmo and others added 24 commits July 3, 2026 01:56

feat(search): give services mode its own search/result kind

f5cb693

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

fix(build): avoid Node 24 WasmHash worker crash in webpack production…

e0435a8

… build Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

chore: add llms.txt AI-crawler manifest

d327732

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

feat(mockups): add tools-page command-center/split-pane/workflow-boar…

2cf4764

…d mockups Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

docs(redesign): add token-adoption audit and design-review prompt

46b433b

- 07-token-adoption-audit.md: report from the design-token adoption sweep. - 08-design-review-prompt.md: the design-review prompt driving the UI pass. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

feat(mockups): add favourites and task-directory concepts

6bbf3f2

fix(review): address tools mockup PR comments

dae41bb

fix(review): address remaining tools mockup feedback

55e0345

fix(review): address services and schema comments

ca0c1d5

Changes before error encountered

21bfca1

Agent-Logs-Url: https://github.com/BigSimmo/Database/sessions/04eecc73-9b51-4991-b626-aae1673f2d8a

merge: begin resolving conflicts with origin/main

a90245b

fix(merge): resolve conflict markers left in merge commit

7498351

style: apply prettier formatting

952c2e7

fix: restore ui smoke mode contracts

2ca4685

fix(review): address latest PR 215 comments

5b62320

BigSimmo enabled auto-merge (squash) July 3, 2026 08:01

chatgpt-codex-connector Bot reviewed Jul 3, 2026

View reviewed changes

BigSimmo disabled auto-merge July 3, 2026 08:20

BigSimmo enabled auto-merge (squash) July 3, 2026 08:39

Merge branch 'main' into feature/tools-page-mockups

613c10e

BigSimmo and others added 2 commits July 3, 2026 17:13

Merge branch 'main' into feature/tools-page-mockups

72c4a6c

chatgpt-codex-connector Bot reviewed Jul 3, 2026

View reviewed changes

Comment thread src/components/DocumentViewer.tsx Outdated

Comment thread src/components/clinical-dashboard/differentials-home.tsx

BigSimmo and others added 3 commits July 3, 2026 17:26

Merge branch 'main' into feature/tools-page-mockups

80d1399

BigSimmo merged commit 8bd0d4e into main Jul 3, 2026
4 checks passed

chatgpt-codex-connector Bot reviewed Jul 3, 2026

View reviewed changes

BigSimmo deleted the feature/tools-page-mockups branch July 5, 2026 11:45

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(ui): tools & favourites mockups + design-token adoption + clinical UI polish#225

feat(ui): tools & favourites mockups + design-token adoption + clinical UI polish#225
BigSimmo merged 31 commits into
mainfrom
feature/tools-page-mockups

BigSimmo commented Jul 3, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

chatgpt-codex-connector Bot left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

chatgpt-codex-connector Bot left a comment

Uh oh!

chatgpt-codex-connector Bot Jul 3, 2026

Uh oh!

chatgpt-codex-connector Bot Jul 3, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

BigSimmo commented Jul 3, 2026

What's in it

Verification

Notes

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

Uh oh!

Uh oh!

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector Bot Jul 3, 2026

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector Bot Jul 3, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants