Redesign Plugins gallery with chip filters and a two-column catalog (CL-7291)

[pratikbuilds]

Summary

• combine native plugins and MCP presets into one searchable catalog while keeping Plugins and Skills as the only tabs
• add status and category filter chips with query-aware counts and a responsive two-column layout
• keep identity, connection status, and actions together, with a neutral Manage action before destructive disconnect confirmation

Verification

• bun run check
• bun install --frozen-lockfile
• Plugins gallery browser walkthrough assertions passed for tab semantics, filter/search intersection, and two-column-to-one-column responsiveness
• The broader walkthrough continued past the Plugins page but later timed out waiting for an unrelated Myra reply

Closes #544

Fixes CL-7291

[TheGreatAxios]

Solid consolidation of the two catalogs and the filter/search intersection is well tested. One real bug found via code inspection below; a couple of things worth tightening before this comes out of draft.

Must fix (before ready for review)

• Duplicate aria-label="Filter plugins" on the Plugins tab. plugins-page.tsx passes label: "Filter plugins" to StageSearch (the top-bar magnifier — button[aria-label="Filter plugins"] / input[aria-label="Filter plugins"]), and PluginFilterBar in plugins-gallery.tsx renders role="group" aria-label="Filter plugins" for the new chip row. Both are live on the same page at once, so two functionally different controls (the per-page search magnifier vs. the category/status chip group) share one accessible name — ambiguous for screen readers and for anything that queries by that label (the new walkthrough step's own button[aria-label="Filter plugins"] / input[aria-label="Filter plugins"] selectors only work because they happen to land on the magnifier's button/input, not the chip group's div). Give the chip group its own name, e.g. aria-label="Filter by category" or similar.

Consider

• The chip row (PluginFilterBar) is hand-rolled with new CSS (.plugins-filter-bar, .plugins-filter-chip, pill radius, aria-pressed toggle buttons) rather than an existing react-ui primitive. Tokens are used correctly throughout, but worth a quick check against react-ui for a chip/segmented-filter component before this ships, per the "consume it from react-ui instead of reimplementing" rule in DESIGN.md's header.
• Dropping the old five-way category taxonomy (Communication, Sales & customer, etc.) down to three (Work/Developer/Research) leaves several native plugins (huggingface, vercel, render, browserbase, openrouter, zoom, slack, hubspot) with no category, so they only ever show under "All" and never under any category chip. That may be intentional scope for this pass, but worth confirming it's not silently hiding filterable items users expect to find by category.
• Single commit mixes tests and implementation together; AGENTS.md's convention is tests-first, then implementation, as separate commits — minor, but worth splitting before merge since the repo's commit-hygiene rule is explicit about this.
• The two-column grid's bottom-border CSS (:has(...:last-child:nth-child(even))) only strips the trailing border when the last row is a full pair; an odd total leaves a single-item last row with a bottom border that the paired rows above it don't have. Cosmetic, but visible in an odd-length catalog (this one has an odd total today).

Verified

• All CI checks pass (build-test, db-suites, e2e, isolation, lint, structural, typecheck).
• pluginCatalogCategory covers all 11 current MCP preset slugs plus the native ids it maps (confirmed against packages/connections/src/mcp-presets.ts).
• Catch clause in useMcpPresetCatalog's preset-load failure now reports through reportError (packages/plugins-ui/src/mcp-preset-cards.tsx), consistent with the error-sink rule.
• Manage/Disconnect and Connect verb usage matches DESIGN.md's Copy rule (one honest verb per state, accessible name carried via visible text + sr-only span rather than a stale aria-label).

Flagging as before-ready-for-review since this is still a draft.

[pratikbuilds]

Manual UI testing is complete and the updated Plugins gallery looks good. Screenshot from the tested build below.

The gallery uses the shared FilterChip component and Tailwind utilities for its responsive layout, borders, and action groups. Plugins and Skills remain the only tabs; category/status filters compose with the page search.

Verification

• bun run build and bun run check passed on this source tree before commit.
• Fresh bun test from packages/plugins-ui: 35 passed, 0 failed.
• The Plugins browser walkthrough step passed: tab semantics, unique search label, chip/search filtering, odd/even final-row borders, two desktop columns, and one narrow column.
• The broader walkthrough still reports the same pre-existing Myra reply and routine target-picker failures.

Fresh guy:code-review of the scoped branch diff and commit history found no new actionable issues. GitHub currently reports a separate bun.lock merge conflict with main; this PR remains draft.

[pratikbuilds]