Skip to content

fix(mockups): collapse tools-page primary region on filter + a11y/label polish#244

Merged
BigSimmo merged 1 commit into
mainfrom
claude/tools-collapse-on-filter
Jul 3, 2026
Merged

fix(mockups): collapse tools-page primary region on filter + a11y/label polish#244
BigSimmo merged 1 commit into
mainfrom
claude/tools-collapse-on-filter

Conversation

@BigSimmo

@BigSimmo BigSimmo commented Jul 3, 2026

Copy link
Copy Markdown
Owner

What & why

Follow-up polish on the tools-page mockups (#215). Addresses the one genuine UX defect plus minor a11y/consistency items found in a design-critique pass.

#1 Collapse-on-filter (the functional fix)

Previously, search/filters only drove the bottom "All tools" list while the primary region (Start here / workflow lanes / launcher overview) stayed static — so a no-match query showed "No tools match" beneath a still-populated grid, and tools were duplicated 2–3× per screen.

Now, when a search or non-all filter is active the static primary region hides and only the filtered results show:

  • Command center — "Start here" + phone preview + Recent work hide; filtered "All tools" (count + empty state) remains.
  • Workflow board — lanes + side rail hide; filtered results below.
  • Split-pane — the "Launcher overview" swaps to live "Results" (with Showing N of 7 + empty state); redundant bottom list + recents hide. Nav stays put.

Implemented via a new isFiltering flag on useToolFilter.

Minor polish

  • Added a Resume lane to the workflow board (represents the personal/Saved area).
  • Capped "Start here" grid at md:grid-cols-2 (dropped the cramped 2xl 4-up).
  • Bumped sub-44px tap targets: search submit 40→44, clear 36→40, filter chips 40→44px.
  • Parallel-noun areaLabels: Reference / Assessment / Treatment / Coordination / Saved.
  • Bumped a 10px phone-rail caption to 11px.

Tests

Added tests/ui-tools-collapse.spec.ts (additive) covering all three collapse behaviours + the Resume lane.

Scope / governance

Mockup-only (/mockups/tools-*). Touches no ingestion, answer generation, search/ranking, source rendering, document access, privacy, or clinical-output surfaces — clinical governance preflight N/A.

Verification

typecheck ✓, eslint ✓, prettier --check ✓ locally. The Playwright specs run in CI (ui-smoke / verify:ui).

🤖 Generated with Claude Code

- Collapse-on-filter: hide Start here / workflow lanes / launcher overview when a
  search or non-'all' filter is active, so results never render beneath a
  still-populated grid (adds isFiltering to useToolFilter). Split-pane overview
  swaps to live results + count/empty state.
- Add a Resume lane to the workflow board (represents the personal/Saved area).
- Cap 'Start here' grid at md:grid-cols-2 (drop cramped 2xl 4-up).
- Bump sub-44px touch targets: search submit 40->44, clear 36->40, filter chips 40->44.
- Parallel-noun areaLabels (Assessment/Treatment/Coordination/Saved/Reference).
- Bump 10px phone-rail caption to 11px.
- Add tests/ui-tools-collapse.spec.ts (additive).

Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
@BigSimmo
BigSimmo merged commit 771917d into main Jul 3, 2026
4 checks passed
@BigSimmo
BigSimmo deleted the claude/tools-collapse-on-filter branch July 5, 2026 11:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant