Skip to content

feat(web): adopt shared UI design system for the first document workflow - #32

Merged
PeterGuy326 merged 3 commits into
mainfrom
agent/14-shared-ui-first-flow
Aug 30, 2026
Merged

feat(web): adopt shared UI design system for the first document workflow#32
PeterGuy326 merged 3 commits into
mainfrom
agent/14-shared-ui-first-flow

Conversation

@PeterGuy326

Copy link
Copy Markdown
Contributor

Migrates the first document workflow to the shared C design system (tracking record: #14), consuming the vendored @fullstack-ai-infra/ui package supplied by the doc#27 fix (#30).

What lands

  • Shared design tokens via globals.css (@import '@fullstack-ai-infra/ui/styles.css'), replacing the local dark-first token block.
  • Work pages, landing page, admin surfaces, and editor chrome consume shared components through the local src/components/ui/* wrappers.
  • Responsive workspace navigation (responsive-workspace.tsx + use-compact-workspace) with accessibility labels and i18n keys.
  • Theme bootstrap script, editor legacy fallback, and parsed-content helpers.
  • Playwright e2e baseline: e2e/signin.spec.ts (+ committed snapshots) wired into CI; e2e/workspace.spec.ts behind test:e2e:full.

Landing fixes applied on top of the rebased tree

  • Workspace Sidebar moved behind a 'use client' boundary (work-sidebar.tsx); the async work layout previously imported the design system directly, which made Next evaluate antd (module-scope createContext) under the react-server graph and broke page-data collection.
  • Button asChild usages (landing page, admin doc dialog, sign-in button) replaced with buttonVariants anchors — the shared Button declares no asChild prop.
  • Local Button wrapper widened to pass through standard HTML button attributes (role, aria-*, style, suppressHydrationWarning) that call sites and tests rely on.
  • Star/share component tests re-query the toggled button inside waitFor: the shared Button remounts its element on state change, so pre-click references go stale even though the toggle works (DOM state is correct).

Verification (local, Node 24.11.1)

  • npm run format ✓, npm run lint
  • npm run test-ci ✓ — vitest 55 files / 285 tests, CLI 51/51
  • npm run build:collaboration ✓, npm run check:cli
  • npm run build ✓ — 23/23 pages

Refs #14 (tracking record); supply prerequisite: #27 / #30.

…ocument workflow)

Migrate the work shell, editor chrome, and landing/sign-in surfaces to the
shared design system supplied by #27/#30 (vendored @fullstack-ai-infra/ui 0.2.0).

- Workspace shell: responsive sidebar with compact mode, keyboard/focus
  management, and accessibility labels. The async route layout keeps server
  data fetching; the shared-UI Sidebar renders behind a 'use client' boundary
  (work-sidebar.tsx) so antd's module-scope createContext is never evaluated
  in Next's react-server graph.
- Editor: legacy-fallback and parsed-content helpers; text/AI menus rebuilt on
  shared primitives.
- Landing/sign-in/user pages: shared tokens, theme bootstrap script, responsive
  hero actions.
- Tests: component coverage for the new shell (responsive workspace, auto-growing
  title, dialog store, toast, theme bootstrap, editor fallback/parsed content)
  plus a Playwright end-to-end baseline for the sign-in flow (committed
  snapshots).
- Compatibility shims for the design system's narrower Button contract: Button
  asChild usages become buttonVariants anchors, and the local Button wrapper
  passes through standard HTML button attributes (role, aria-*, style,
  suppressHydrationWarning).
@PeterGuy326
PeterGuy326 requested a review from Bindy-lbb as a code owner August 30, 2026 16:04
@PeterGuy326
PeterGuy326 merged commit c9334d3 into main Aug 30, 2026
2 checks passed
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