feat(gui): migrate workspace controls and remove template UI patterns

[MisterWanted]

Summary

• Continue the existing OCX interface migration in the same application; no provider/authentication/backend/release changes. Replace the rejected mint/ink template direction with a neutral workspace and preserve current routes.
• Add official shadcn Base UI primitives (Sheet, Button, Empty, ToggleGroup) with a semantic Tailwind adapter to the existing tokens, no preflight and no global preset. Settings retains EN/NL and theme choices; remove misleading legacy skin choices without deleting their stored values.
• Fix nested Select Escape propagation, dialog focus return, mobile navigation reachability, unknown-versus-zero readings, false empty-success states, provider name clipping, and traffic cell overlap. Add behavioral regressions and durable component ownership.

Head: 174f152960ab06c649797b2d8be943d3d331508d. This is deliberately DRAFT: the full visual redesign, provider detail migration, public landing and deployment acceptance are not complete. The earlier Orbit visual proposal was rejected; this PR does not claim user design approval.

Verification

• GUI isolated suite re-run on committed head 174f152960ab06c649797b2d8be943d3d331508d: 474 pass, 0 fail, 2059 assertions. GitHub CI still required; the local evidence is not a GitHub approval.
• GUI lint, i18n lint and production build passed. Root typecheck and privacy scan passed. Documentation build passed: 156 pages.
• Existing Brave session: desktop 1440, intermediate actual 1023 CSS px, mobile 390; native Tab/Shift+Tab focus wrap, Escape listbox then Sheet, opener focus restore, locale round trip, and no overflow in inspected mobile navigation/traffic. Populated screenshots use explicitly marked synthetic fixtures, NOT live proxy evidence.
• Bounded independent dependency inspection: all 44 added lock entries match npm integrity metadata; eight downloaded archives checked by SHA-512; Bun/npm/OSV returned no known advisories. No added install hooks or suppressions. Maintainer security approval remains required; attestations were not cryptographically verified.
• Premium static audit remains NON-PASS: 19 hits, zero unresolved owners. Eleven authored-Select case-insensitive scanner hits, five action-detection hits (including working anchor-rendered shadcn Buttons), three legacy vertically resizable textareas. No suppressions or functionality removal to force green. DESIGN lint: zero errors, one warning because the established markdown contract is not YAML-token export.
• Exact-head mandatory pre-push: 6814 pass, 2 skip, 0 fail, 33713 assertions across 504 files (218.03s). Typecheck, GUI lint, privacy scan and React Doctor passed; no Doctor issues. Push succeeded without bypass. The first pass found a quote-format assertion; the fix retains the exact Vite host value while accepting either valid quote style. Cross-platform GitHub CI remains separate. No deployment, release or merge performed.

Linear

• Issue: GRO2-1560 (existing OCX redesign/release campaign).

Checklist

• Scope stays focused and avoids unrelated cleanup.
• Docs or release notes were updated when needed.
• Required exact-head CI and maintainer/security approvals.
• Full design acceptance and remaining migration.

[coderabbitai]

Important

Draft PR not reviewed

Draft PRs are not automatically reviewed by default.

• Trigger a manual review

To automatically review draft PRs, update your CodeRabbit configuration:

reviews:
  auto_review:
    drafts: true

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[socket-security]

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	class-variance-authority@​0.7.1
	@​base-ui/​react@​1.8.0
	cn@​0.2.6
	lucide-react@​1.41.0
	@​fontsource-variable/​manrope@​5.3.0
	tailwindcss@​4.3.3
	@​tailwindcss/​vite@​4.3.3
	motion@​13.2.0

View full report

[socket-security]

Warning

Review the following alerts detected in dependencies.

According to your organization's Security Policy, it is recommended to resolve "Warn" alerts. Learn more about Socket for GitHub.

Action	Severity	Alert  (click "▶" to expand/collapse)
Warn		License policy violation: npm @fontsource-variable/manrope under OFL-1.1 License: OFL-1.1 - The applicable license policy does not permit this license (5) (npm metadata) License: OFL-1.1 - The applicable license policy does not permit this license (5) (package/package.json) License: OFL-1.1 - The applicable license policy does not permit this license (5) (package/LICENSE) From: gui/package.json → npm/@fontsource-variable/manrope@5.3.0 ℹ Read more on: This package | This alert | What is a license policy violation? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at support@socket.dev. Suggestion: Find a package that does not violate your license policy or adjust your policy to allow this package's license. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment @SocketSecurity ignore npm/@fontsource-variable/manrope@5.3.0. You can also ignore all packages with @SocketSecurity ignore-all. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.

View full report

[MisterWanted]

Model workspace and interaction polish

This continues the existing draft redesign, not a new release or production cutover.

• Replace provider rail/hover cards with a searchable catalog and persistent model inspector.
• Preserve provider-qualified selection, native/routed visibility semantics, custom-model confirmation, provider bulk scope, and saved collapse preferences.
• Clear removed selections on refresh and restore focus without stealing focus from unrelated controls.
• Refine desktop geometry: single appbar on wide screens, underlined subtabs, aligned metadata, less rounded chrome, and a separated inspector. Mobile remains list-or-detail with an explicit Back action.
• Add exact model-ID copy with scoped success/failure feedback through the existing clipboard hook.
• Apply the requested Kinetics/sv-matrix/Beam references as bounded patterns: decorative center-out matrix and monochrome copy-success boundary feedback, no new dependency or ambient loop. Reduced motion and keyboard activation remain supported.
• Repair a formatting-sensitive CSS assertion without relaxing its layout expectations.

Validation on the final content:

• Pushed exact head: 27cffd5daa0d0ff173d26ce08235c541f7c06007.

• Mandatory pre-push: 6814 passed, 2 existing skips, 0 failed, 33719 assertions,
  504 files, 249.19s. Typecheck, GUI lint, privacy scan and changed-scope React Doctor passed.

• One GitHub snapshot after push: required CI and Socket PR Alerts still running;
  Socket Project Report succeeded. No CI-green or deployment claim.

• GUI: 492 passed, 0 failed; 2267 assertions across 97 files.

• GUI lint/i18n/TypeScript+Vite build passed. Docs: 156 pages built.

• Bounded read-only behavior reviews found no remaining actionable selection/header/clipboard regression after the removed-selection fix. This is not maintainer approval.

• Visual fixtures verified the initial catalog slice and the 1920×1080 polish geometry. The browser connection disappeared before the final reference pass could be captured; final-head light/dark/mobile/motion visual acceptance is still open. Fixture catalog values are not live provider/model evidence.

The draft remains pending full visual acceptance, remaining screen/landing migration, exact-head required CI and maintainer/security approval. No merge or deployment claim.

[MisterWanted]

Library component adoption — 7 September

Continues this PR on the existing redesign branch. Component migration in
76bdcb8db, follow-up validation fixes in fcee9c21e and 92ac1e311.
Quality/component composition follow-up: edbf5655f.

• Imported 12 actual shadcn Base UI registry component files into the existing
  shared primitive layer. Models/inspector now use Button, InputGroup, Select,
  Badge, Switch, Accordion, Field, Alert, Empty, Separator and Spinner; global
  navigation uses the existing shared Button as well.
• Spinners represent real pending catalog-load/provider-refresh/custom-save
  work. Reduced motion disables rotation and the new transitions. Touch switches
  expose a 44px target. Existing semantic monochrome tokens and no-preflight
  boundary are retained; no new blue/purple palette.
• Selection, visibility mutations, focus/search clear, provider filter,
  disclosure independence and success/error pending states have regression tests.
  Added real DOM identity tests for stable FieldError message keys.
• The only added dependency is exact lucide-react@1.41.0, no transitive
  additions or install scripts. Registry tarball integrity matches the lock;
  Bun/npm/OSV checks returned no advisory findings. This evidence is not a
  maintainer security approval. Upstream license notices ship in GUI output.
• Addressed the 25 CodeFactor annotations from 92ac1e311: extracted focused
  controlled model/provider/settings/modal components with state and API ownership
  retained in the page; eight duplicate CSS selectors consolidated with equivalent
  final declarations; eleven test-fixture any annotations replaced by wire shapes;
  complex test dispatchers split without changing their 259 assertion expressions.
  Local complexity <=15 passes on the extracted components; remote CodeFactor
  status remains SHA-scoped and is recorded below rather than assumed green.
• Full-gate investigation found an SSE test timer surviving cancellation and
  unsolicited localhost GET / discovery probes inflating catch-all fixture
  counters. Timer ownership and explicit protocol fixture routing are fixed;
  deterministic GET / rejection regressions preserve legitimate duplicate-POST
  detection and all deadline assertions. No production provider/auth changes.

GUI: 499 tests passed, 0 failed, 2338 assertions; GUI build, docs build, privacy
and changed-scope React Doctor verified. Targeted protocol fixtures: 68 passed,
0 failed, 373 assertions. Full exact-head push-gate outcome is recorded below.

Browser evidence: real existing Brave with intercepted synthetic fixtures,
1920x1080 desktop and 390x844 mobile; no horizontal overflow, reduced-motion
switch behavior, opened provider dropdown/accordion and native Enter/Escape
focus return. These are NOT production model availability or deployment proofs.

Durable handoff:
/home/joep/Overleg/chefgroep/2026-09-07-ocx-library-components-handoff.md

PR remains draft. Remaining gates: exact-head maintainer/security review,
terminal required CI, remaining-screen visual acceptance and the existing
release/canary path. No merge or deployment claimed.

Final push evidence

GitHub head confirmed: edbf5655fc1456f4f4d7476ad63652d0c538b3ce, base main,
draft OPEN. Normal pre-push succeeded without bypass: 6814 pass, 2 existing
skips, 0 fail, 33723 assertions, 504 files, 229.85s. Typecheck, GUI lint,
privacy and changed-scope React Doctor (including new tracked components) passed.

One exact-head GitHub snapshot: Socket Project Report success, CodeRabbit success;
CodeFactor, Socket PR Alerts and required Actions checks queued/in progress.
PR image publish skipped. No terminal all-green CI or maintainer approval claim.
Fresh post-extraction desktop/mobile fixture screenshots are in the handoff.
Owned preview tab/server stopped; worktree clean.