Skip to content

[F0] Scaffold React/Vite web client with auth wired to the API - #26

Merged
mforce merged 2 commits into
mainfrom
feat/f0-spa-scaffold
Jul 15, 2026
Merged

mforce merged 2 commits into
mainfrom
feat/f0-spa-scaffold

Conversation

@mforce

@mforce mforce commented Jul 15, 2026

Copy link
Copy Markdown
Owner

Closes #20. First frontend for Cluckwork — the scaffold was backend-only.

What

React 19 + Vite 6 + TypeScript SPA in web/, consuming the existing JSON API. Auth is wired to the real API (no mock): login/refresh/logout hit /api/v1/auth.

  • Dev proxy (vite.config.ts): forwards /api/* to the backend (VITE_API_TARGET, default :8080), so the SPA is same-origin — the API needs no CORS for local dev.
  • api/client.ts: typed fetch wrapper, bearer auth, single-flight refresh-and-retry on 401; drops the session and bounces to /login when refresh fails.
  • auth/: localStorage token store, AuthContext, useAuth.
  • routes/: Login (real POST /auth/login), ProtectedRoute guard, AppLayout shell (nav + sign-out), Dashboard, and placeholders for the daily-entry / stock / sales screens ([F1] Daily-entry capture screen (by grade) #21/[F2] Stock-by-grade view #22/[F3] Customers + sales order flow #23).

Verification

npm run build (tsc -b + vite build) passes clean — 50 modules, strict TS, 0 errors.

Follow-up dependency

End-to-end login needs a user to sign in with. There is no seeded user and migrations are not applied on startup. That scope was folded into #5 (startup migrate + seed default farm/house/admin user). Until #5 lands, log in via Swagger / the integration-test seed path.

Contract used

POST /api/v1/auth/login    {email,password}  -> {accessToken,refreshToken,expiresAt}
POST /api/v1/auth/refresh  {refreshToken}    -> {same}
POST /api/v1/auth/logout   {refreshToken}    -> 204

Migrated from Gitea PR #26 (https://gitea.mforcelabs.com/mforce/cluckwork/pulls/26).

mforce added 2 commits July 14, 2026 21:11
The scaffold is backend-only (JSON API + Postgres + Traefik) with no
frontend. MVP is not shippable to a farmer as a bare API, so Phase 1.0
now includes a React/Vite SPA in web/ consuming the JSON API: login,
daily-entry capture, stock view, customers, sales order flow, and
list/history screens.

Adds §6 item 10 and a Sprint UI block in §7.
First frontend: React 19 + Vite 6 + TS SPA in web/, consuming the
existing JSON API. No mock — login/refresh/logout hit /api/v1/auth.

- Vite dev proxy forwards /api to the backend (VITE_API_TARGET, default
  :8080), keeping the SPA same-origin so the API needs no CORS for dev.
- api/client.ts: typed fetch wrapper, bearer auth, single-flight
  refresh-and-retry on 401, drops session to /login when refresh fails.
- auth/: localStorage token store, AuthContext, useAuth.
- routes/: Login (real POST /auth/login), ProtectedRoute guard,
  AppLayout shell with nav + sign-out, Dashboard, placeholders for the
  daily-entry/stock/sales screens (#21/#22/#23).

Verified: npm run build (tsc -b + vite build) passes clean. End-to-end
login needs the seeded admin user from #5 (startup migrate + seed).
@mforce
mforce merged commit 56da41f into main Jul 15, 2026
2 checks passed
@mforce
mforce deleted the feat/f0-spa-scaffold branch July 15, 2026 04: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.

[F0] Scaffold React/Vite SPA + auth + API client shell

1 participant