Expo client scaffolding — router, RN Web, theming port, i18n, offline, reference screen #183

New issue

Closed

opened 2026-06-20 15:44:28 +00:00 by james · 0 comments

james commented

2026-06-20 15:44:28 +00:00

Owner

Stand up the Expo Router + React Native Web project in apps/client, port the theme/token system, wire up i18n and offline support, and prove the loop end-to-end with a single screen calling the API via the generated client.

This is the biggest single ticket in #176. It exists to establish the shape; the per-screen ports follow.

Scope

Expo Router project in apps/client, set up for web + Android + (later) Linux Flatpak via the web build.
Theme/token port: translate app/themes/{light,dark}.css (Carol DS tokens, ADR-0023) into a runtime-styled theme object compatible with RN's StyleSheet. Same token names, different syntax. CSS variables on web; JS object on native — same theme contract either way.
i18n: swap next-intl for an RN-compatible runtime (recommend i18next + react-i18next, with expo-localization for the default). Source catalog stays at packages/i18n/messages/*.json. ADR-0025 §6 deferred zod messages remain deferred.
Offline: Expo's PWA + service worker on web; appropriate cache strategy on native. Replace app/sw.ts / app/sw-register.tsx.
Auth wiring: Expo SecureStore on native, cookies on web (same-origin). Bearer-token attachment in the generated client's fetch.
Reference screen: one screen (recommend /skills, since #143 just landed) ported end-to-end against the generated client + hooks, on both the web build and an Android dev build.

Acceptance criteria

apps/client builds with expo export --platform web and produces a static bundle.
The same apps/client runs in expo run:android against a self-hoster's API URL set at runtime.
DS tokens visible in the running app match what / showed pre-migration on both themes.
The reference screen reads, writes, and renders against the live API on web and Android, with TanStack Query hooks and the generated client.
messages/en.json strings load via the new i18n runtime; per-key fallback to English still works.

Out of scope

Porting the other screens (their own ticket).
Decommissioning the Next.js UI (its own ticket).
Linux Flatpak packaging (its own ticket).

Composes with

Repo restructure, Generated typed client, Token-based auth, Port existing screens, ADR-0023, ADR-0025.

Part of

#176

Stand up the **Expo Router + React Native Web** project in `apps/client`, port the theme/token system, wire up i18n and offline support, and prove the loop end-to-end with a single screen calling the API via the generated client. This is the biggest single ticket in #176. It exists to *establish the shape*; the per-screen ports follow. ## Scope - Expo Router project in `apps/client`, set up for web + Android + (later) Linux Flatpak via the web build. - **Theme/token port:** translate `app/themes/{light,dark}.css` (Carol DS tokens, ADR-0023) into a runtime-styled theme object compatible with RN's `StyleSheet`. Same token names, different syntax. CSS variables on web; JS object on native — same theme contract either way. - **i18n:** swap next-intl for an RN-compatible runtime (recommend `i18next` + `react-i18next`, with `expo-localization` for the default). Source catalog stays at `packages/i18n/messages/*.json`. ADR-0025 §6 deferred zod messages remain deferred. - **Offline:** Expo's PWA + service worker on web; appropriate cache strategy on native. Replace `app/sw.ts` / `app/sw-register.tsx`. - **Auth wiring:** Expo `SecureStore` on native, cookies on web (same-origin). Bearer-token attachment in the generated client's fetch. - **Reference screen:** one screen (recommend `/skills`, since #143 just landed) ported end-to-end against the generated client + hooks, on both the web build and an Android dev build. ## Acceptance criteria - [ ] `apps/client` builds with `expo export --platform web` and produces a static bundle. - [ ] The same `apps/client` runs in `expo run:android` against a self-hoster's API URL set at runtime. - [ ] DS tokens visible in the running app match what `/` showed pre-migration on both themes. - [ ] The reference screen reads, writes, and renders against the live API on web and Android, with TanStack Query hooks and the generated client. - [ ] `messages/en.json` strings load via the new i18n runtime; per-key fallback to English still works. ## Out of scope - Porting the other screens (their own ticket). - Decommissioning the Next.js UI (its own ticket). - Linux Flatpak packaging (its own ticket). ## Composes with Repo restructure, Generated typed client, Token-based auth, Port existing screens, ADR-0023, ADR-0025. ## Part of #176

james added the

area:native

area:pwa

feature

labels

2026-06-20 15:45:23 +00:00

james referenced this issue

2026-06-20 17:36:04 +00:00

Apply cursor pagination to remaining flat-list endpoints #191

james referenced this issue from a commit

2026-06-21 02:50:39 +00:00

chore: restructure into pnpm workspaces — apps/api + placeholders (#181)