create-du-app 0.1.3 → 0.1.5

package/README.md

@@ -19,10 +19,13 @@ You'll be asked:
 2. **Select the groups** → press **`Space`** to tick Mobile / Frontend / Backend, then **`Enter`**
 3. **Pick one technology** per group → **↑ / ↓** then **`Enter`**
 
-Then:
+Then bootstrap it — one command installs deps, builds `@repo/shared`, and
+verifies every app can import it:
 
 ```bash
-cd my-shop && pnpm install
+cd my-shop
+pnpm bootstrap
+pnpm dev
 ```
 
 Done. 🎉
@@ -44,16 +47,13 @@ npx create-du-app --name my-shop --mobile expo --fe nextjs --be nestjs
 
 ## Install globally (optional)
 
-Scaffold often? Install once and use the shorter `create-app` command:
+Scaffold often? Install once so you don't re-download it each time:
 
 ```bash
 npm install -g create-du-app     # or: pnpm add -g create-du-app
-create-app                       # same as npx create-du-app
+create-du-app                    # same as npx create-du-app
 ```
 
-> The **package** is `create-du-app`; the installed **command** is `create-app`
-> (same pattern as `create-next-app`).
-
 ## Available stacks
 
 | Group    | Technologies                  | Output folder  |
@@ -62,7 +62,9 @@ create-app                       # same as npx create-du-app
 | Frontend | Next.js · ReactJS             | `apps/web`     |
 | Backend  | Node.js · NestJS · PHP        | `apps/backend` |
 
-`packages/shared` (shared types + api client) is added automatically when you pick **≥ 2** JS/TS stacks.
+`packages/shared` (`@repo/shared` — shared data contracts, built with tsup) is added
+automatically when you pick **≥ 2** JS/TS stacks, and every JS/TS app is wired to it
+as a `workspace:*` dependency.
 
 ---
 
@@ -76,6 +78,10 @@ Working on the CLI source or the templates? See the
 | `src/index.js`    | Entry point. Parses flags, runs interactive or non-interactive, then generates. |
 | `src/registry.js` | **Data declaration** of groups, technologies, `templatePath`, and `lang`. Edit this to add/remove a stack. |
 | `src/prompts.js`  | Interactive prompts (`@clack/prompts`). |
-| `src/generate.js` | Copies templates, renames `_package.json` → `package.json`, emits the root `package.json` + `pnpm-workspace.yaml`, substitutes `{{PROJECT_NAME}}`. |
+| `src/generate.js` | Copies templates, renames `_package.json` → `package.json`, substitutes `{{PROJECT_NAME}}`, emits the root config (`package.json`, `pnpm-workspace.yaml`, `turbo.json`, `tsconfig.base.json`, `.gitignore`, `.npmrc`, `scripts/bootstrap.mjs`), and wires JS/TS apps to `@repo/shared`. |
+| `scripts/validate-templates.mjs` | Validates every registered template (gates `prepack`/publish). Run with `pnpm validate`. |
+
+Before publishing, `prepack` runs template validation automatically. Run the full
+check (validate + generate smoke test) from the repo root with `pnpm test`.
 
 Release a new version: `pnpm release` (see [scripts/release.mjs](scripts/release.mjs)).

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "create-du-app",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "description": "CLI generator: pick templates (Mobile/FE/BE) and scaffold a product monorepo",
   "type": "module",
   "bin": {
-    "create-app": "src/index.js"
+    "create-du-app": "src/index.js"
   },
   "files": [
     "src",
@@ -12,14 +12,15 @@
   ],
   "scripts": {
     "start": "node src/index.js",
+    "validate": "node scripts/validate-templates.mjs",
     "release": "node scripts/release.mjs",
-    "prepack": "node scripts/bundle-templates.mjs",
+    "prepack": "node scripts/validate-templates.mjs && node scripts/bundle-templates.mjs",
     "postpack": "node scripts/bundle-templates.mjs --clean"
   },
   "engines": {
-    "node": ">=18"
+    "node": ">=20"
   },
-  "packageManager": "pnpm@9.0.0",
+  "packageManager": "pnpm@9.12.0",
   "dependencies": {
     "@clack/prompts": "^0.7.0",
     "fs-extra": "^11.2.0"

package/src/generate.js

@@ -81,7 +81,19 @@ async function copyTemplate(srcDir, destDir, projectName) {
 // ---------------------------------------------------------------------------
 
 // Build the project's root package.json (pnpm: NO "workspaces" field).
-function buildRootPackageJson(projectName, hasShared) {
+function buildRootPackageJson(projectName, hasShared, createdAppDirs = []) {
+  // Per-app convenience scripts (life-master style): build @repo/shared first
+  // (if it exists), then run that app's dev server. Keyed by the app folder
+  // name, filtered to the app's package (e.g. `pnpm mobile` -> runs apps/mobile).
+  const sharedPrefix = hasShared
+    ? `turbo run build --filter=${SHARED_PACKAGE_NAME} && `
+    : '';
+  const appScripts = {};
+  for (const dir of createdAppDirs) {
+    const app = dir.split('/').pop(); // 'apps/mobile' -> 'mobile'
+    appScripts[app] = `${sharedPrefix}turbo run dev --filter=${projectName}-${app}`;
+  }
+
   return {
     name: projectName,
     version: '0.1.0',
@@ -98,6 +110,7 @@ function buildRootPackageJson(projectName, hasShared) {
       ...(hasShared
         ? { 'shared:build': `turbo run build --filter=${SHARED_PACKAGE_NAME}` }
         : {}),
+      ...appScripts,
     },
     devDependencies: {
       turbo: '^2.3.3',
@@ -333,7 +346,7 @@ export async function generate(plan, repoRoot, cwd = process.cwd()) {
   // 3) Generate the root config files dynamically.
   await fse.writeJson(
     path.join(projectRoot, 'package.json'),
-    buildRootPackageJson(projectName, hasShared),
+    buildRootPackageJson(projectName, hasShared, createdAppDirs),
     { spaces: 2 },
   );
   logs.push('✓ package.json');

package/src/index.js

@@ -2,8 +2,8 @@
 // index.js — entry point. Parse args + run prompts (TTY) or generate directly (flags).
 //
 // Usage:
-//   create-app                                 interactive (requires a real terminal)
-//   create-app --name my-shop --be nestjs      non-interactive (runs anywhere)
+//   create-du-app                                 interactive (requires a real terminal)
+//   create-du-app --name my-shop --be nestjs      non-interactive (runs anywhere)
 //   node src/index.js
 //
 // Flags:
@@ -56,11 +56,11 @@ async function readVersion() {
 
 function printHelp() {
   console.log(`
-create-app — scaffold a product monorepo from company templates
+create-du-app — scaffold a product monorepo from company templates
 
 Usage:
-  create-app                                interactive (requires a real terminal)
-  create-app --name my-shop --be nestjs     non-interactive (runs anywhere)
+  create-du-app                                interactive (requires a real terminal)
+  create-du-app --name my-shop --be nestjs     non-interactive (runs anywhere)
   node src/index.js                         equivalent (when not linked)
 
 Options:
@@ -73,7 +73,7 @@ Options:
   -y, --yes               generate without prompting (needs --name + >=1 group)
 
 Example:
-  create-app --name my-shop --mobile expo --fe nextjs --be nestjs
+  create-du-app --name my-shop --mobile expo --fe nextjs --be nestjs
 
 Add/remove templates: edit packages/cli/src/registry.js
 `);
@@ -93,7 +93,7 @@ function parseArgs(argv) {
       case '--fe': out.fe = argv[++i]; break;
       case '--be': out.be = argv[++i]; break;
       default:
-        throw new Error(`Invalid argument: ${a}. See: create-app --help`);
+        throw new Error(`Invalid argument: ${a}. See: create-du-app --help`);
     }
   }
   return out;
@@ -155,7 +155,7 @@ async function main() {
     throw new Error(
       'This terminal does not support interactive mode (stdin is not a TTY).\n' +
       '  → Run it in Terminal.app/iTerm, OR use flags:\n' +
-      '    create-app --name my-shop --mobile expo --fe nextjs --be nestjs',
+      '    create-du-app --name my-shop --mobile expo --fe nextjs --be nestjs',
     );
   } else {
     plan = await runPrompts();
@@ -168,7 +168,13 @@ async function main() {
   console.log('');
 
   const rel = path.relative(process.cwd(), projectRoot) || projectRoot;
-  const msg = `Done! Next:\n\n  cd ${rel} && pnpm install\n`;
+  // `pnpm bootstrap` is the one-command setup: it installs deps, builds
+  // @repo/shared, and verifies each app resolves it. Then `pnpm dev`.
+  const msg =
+    `Done! Next:\n\n` +
+    `  cd ${rel}\n` +
+    `  pnpm bootstrap   # install deps + build @repo/shared + verify\n` +
+    `  pnpm dev         # start the dev servers\n`;
   // outro() (clack) only looks good in a TTY; print plainly in non-interactive mode.
   if (process.stdout.isTTY && !hasSelectionFlags(args)) outro(msg);
   else console.log(msg);

package/src/prompts.js

@@ -24,7 +24,7 @@ function ensureNotCancelled(value) {
 }
 
 export async function runPrompts() {
-  intro('create-app — scaffold a product monorepo from company templates');
+  intro('create-du-app — scaffold a product monorepo from company templates');
 
   // 1) Project name
   const projectName = ensureNotCancelled(

package/templates/mobile/expo/.env.example

@@ -0,0 +1,5 @@
+# Copy to .env and fill in. Expo inlines any EXPO_PUBLIC_* var at build time.
+# NEVER commit the real .env — only this example.
+
+# Base URL of your API (include trailing slash).
+EXPO_PUBLIC_BASE_URL=https://api.example.com/

package/templates/mobile/expo/.eslintrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+  root: true,
+  extends: '@react-native',
+  rules: {
+    semi: 0,
+  },
+};

package/templates/mobile/expo/.prettierrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+  arrowParens: 'avoid',
+  bracketSameLine: true,
+  bracketSpacing: true,
+  singleQuote: true,
+  trailingComma: 'all',
+};

package/templates/mobile/expo/.svgrrc.js

@@ -0,0 +1,9 @@
+module.exports = {
+    replaceAttrValues: {
+        '{currentColor}': '{props.color || "#0D1F2D"}',
+        '{292929}': '{props.color || "#292929"}',
+        '{D4D4FF}': '{props.color || "#D4D4FF"}',
+        '{7C7C7C}': '{props.color || "#7C7C7C"}',
+        '{D97706}': '{props.color || "#D97706"}',
+    },
+}

package/templates/mobile/expo/README.md

@@ -1,11 +1,74 @@
-# Placeholder: Expo (mobile/expo)
+# {{PROJECT_NAME}} — Mobile (Expo)
 
-This is a **placeholder** for the **Expo** template.
+An Expo + React Native starter built from the company's production core. The
+reusable infrastructure (`src/core`) is ported as-is; only product-specific
+features (audio/player, real-estate, IAP, maps, blur) were removed. Build your
+features under `src/modules/`.
 
-Drop the standard Expo source here. Conventions:
+## Architecture
 
-- Name the template's `package.json` as **`_package.json`** (the CLI renames it on generate).
-- Name `.gitignore` as **`_gitignore`**, `.npmrc` as **`_npmrc`** if present.
-- Wherever you need the project name, write `{{PROJECT_NAME}}` — the CLI replaces it with the real name.
+```
+src/
+├── app/        composition: providers, navigation, global stores (auth/loading/common), i18n
+├── core/       reusable infrastructure (see below)
+├── modules/    your features (home/profile examples included)
+└── assets/     i18n, svgs (sync-generated barrel), images, lotties
+```
 
-`lang: js` → this app counts toward the condition for creating `packages/shared`.
+### `src/core` — the reusable kit
+| Area | Where |
+|------|-------|
+| API | `services/api.service.ts` (axios + auth header + device-id + 401 session handling), `api/example.api.ts` (React Query pattern) |
+| Data | `utils/query-client.util.ts`, `utils/query-persister.util.ts` (AsyncStorage offline cache) |
+| Theme | `theme/` — context + `Colors` design tokens (`useTheme`, `useThemedStyles`) |
+| UI kit | `components/ui/*` — button, text-field/area, checkbox, radio, toggle, modal, bottom-sheet, header, tabs, otp-input, search-box, skeleton, app-image, image-slider… |
+| Forms | `components/forms/*` — react-hook-form bindings over the DS fields |
+| Hooks | `hook/*` — useDebounce, useTimeout, useNetworkStatus, useEndReached, useAppNavigation… |
+| Utils | `utils/*` — storage, translator (i18n), validate/schema (yup), date/number format, enum, toast, size/typography… |
+
+### Shared contracts
+The core imports domain contracts (`ApiEndpoints`, `ExternalUrls`, enums) from
+**`@repo/shared`** — generate this app alongside another JS/TS stack so that
+package exists; the CLI wires `"@repo/shared": "workspace:*"` automatically.
+
+## Getting started
+
+> [!TIP]
+> Every native dependency in this starter ships inside **Expo Go**, so you can
+> run it by scanning the QR code — **no dev build / Xcode / Android Studio
+> needed**. (See [Expo Go compatibility](#expo-go-compatibility) for how.)
+
+```bash
+pnpm bootstrap                                  # install + build @repo/shared
+pnpm --filter {{PROJECT_NAME}}-mobile typecheck # verify
+pnpm --filter {{PROJECT_NAME}}-mobile start     # expo start — scan QR in Expo Go
+```
+
+Press `i` (iOS simulator) / `a` (Android emulator) in the Metro terminal, or scan
+the QR with the **Expo Go** app on a physical device.
+
+Add an icon: drop `name.svg` in `src/assets/svgs/` then `pnpm --filter {{PROJECT_NAME}}-mobile sync-svgs`.
+
+## Expo Go compatibility
+
+This starter deliberately uses only libraries bundled in Expo Go, so the standard
+QR-code workflow works out of the box. Where the original production app used a
+bare-RN native module, the Expo equivalent is used instead:
+
+| Need | Library used |
+|------|--------------|
+| Images (cache, prefetch) | `expo-image` |
+| Pick / capture photos | `expo-image-picker` |
+| Date / time picker | `@react-native-community/datetimepicker` |
+| Gradients | `expo-linear-gradient` |
+| Device locale | `expo-localization` |
+| Device id | `expo-application` (+ `expo-crypto` fallback) |
+| Offline query cache | `@react-native-async-storage/async-storage` |
+| Env vars | `process.env.EXPO_PUBLIC_*` (set in `.env`) |
+| Keyboard avoidance | React Native `KeyboardAvoidingView` |
+
+> Need a bare-RN native module later (e.g. MMKV, a custom SDK)? Run
+> `npx expo prebuild` + `expo run:ios` / `run:android` to switch to a development
+> build. Until then, plain `expo start` + Expo Go is all you need.
+
+> Before shipping: set `name`, `slug`, `scheme`, and the iOS/Android bundle ids in `app.json`.

package/templates/mobile/expo/_gitignore

@@ -0,0 +1,20 @@
+# Native build artifacts (regenerated by `expo prebuild`)
+/ios
+/android
+.expo/
+web-build/
+
+# Dependencies
+node_modules/
+
+# Metro
+.metro-health-check*
+
+# Env (keep .env.example)
+.env
+.env.*
+!.env.example
+
+# Logs / OS
+*.log
+.DS_Store

package/templates/mobile/expo/_package.json

@@ -2,5 +2,64 @@
   "name": "{{PROJECT_NAME}}-mobile",
   "version": "0.1.0",
   "private": true,
-  "description": "Placeholder Expo app for {{PROJECT_NAME}}"
+  "main": "index.js",
+  "scripts": {
+    "dev": "expo start",
+    "start": "expo start",
+    "android": "expo run:android",
+    "ios": "expo run:ios",
+    "prebuild": "expo prebuild",
+    "lint": "eslint . --ext .ts,.tsx",
+    "typecheck": "tsc --noEmit",
+    "sync-svgs": "node src/scripts/sync-svgs.js",
+    "sync-images": "node src/scripts/sync-images.js"
+  },
+  "dependencies": {
+    "@hookform/error-message": "2.0.0",
+    "@react-native-async-storage/async-storage": "2.2.0",
+    "@react-native-community/netinfo": "12.0.1",
+    "@react-navigation/bottom-tabs": "^7.12.0",
+    "@react-navigation/native": "^7.0.13",
+    "@react-native-community/datetimepicker": "9.1.0",
+    "@react-navigation/native-stack": "^7.1.14",
+    "@tanstack/react-query": "^5.101.0",
+    "@tanstack/react-query-persist-client": "^5.101.0",
+    "axios": "^1.7.9",
+    "expo": "~56.0.6",
+    "expo-application": "~56.0.3",
+    "expo-crypto": "~56.0.4",
+    "expo-image": "~56.0.11",
+    "expo-image-picker": "~56.0.18",
+    "expo-linear-gradient": "~56.0.4",
+    "expo-localization": "~56.0.6",
+    "i18next": "^21.5.4",
+    "lodash": "^4.17.21",
+    "lottie-react-native": "~7.3.4",
+    "qs": "^6.10.1",
+    "react": "19.2.3",
+    "react-hook-form": "^7.53.2",
+    "react-i18next": "^11.14.3",
+    "react-native": "0.85.3",
+    "react-native-gesture-handler": "~2.31.1",
+    "react-native-reanimated": "4.3.1",
+    "react-native-safe-area-context": "~5.7.0",
+    "react-native-screens": "4.25.2",
+    "react-native-svg": "15.15.4",
+    "react-native-toast-message": "^2.2.1",
+    "react-native-worklets": "0.8.3",
+    "yup": "^0.32.11",
+    "zustand": "^5.0.7"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.25.2",
+    "@react-native/eslint-config": "0.85.3",
+    "@types/lodash": "^4.14.176",
+    "@types/qs": "^6.9.7",
+    "@types/react": "^19.1.1",
+    "babel-plugin-module-resolver": "^4.1.0",
+    "eslint": "^8.19.0",
+    "prettier": "2.8.8",
+    "react-native-svg-transformer": "^1.5.0",
+    "typescript": "~5.8.3"
+  }
 }

package/templates/mobile/expo/app.json

@@ -0,0 +1,26 @@
+{
+  "expo": {
+    "name": "{{PROJECT_NAME}}",
+    "slug": "{{PROJECT_NAME}}",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "userInterfaceStyle": "automatic",
+    "newArchEnabled": true,
+    "scheme": "myapp",
+    "ios": {
+      "supportsTablet": true,
+      "bundleIdentifier": "com.company.myapp",
+      "infoPlist": {
+        "NSPhotoLibraryUsageDescription": "Allow $(PRODUCT_NAME) to access your photos.",
+        "NSCameraUsageDescription": "Allow $(PRODUCT_NAME) to use the camera."
+      }
+    },
+    "android": {
+      "package": "com.company.myapp",
+      "permissions": [
+        "android.permission.CAMERA",
+        "android.permission.READ_MEDIA_IMAGES"
+      ]
+    }
+  }
+}

package/templates/mobile/expo/babel.config.js

@@ -0,0 +1,21 @@
+module.exports = function (api) {
+  api.cache(true);
+  return {
+    presets: ['babel-preset-expo'],
+    plugins: [
+      [
+        'module-resolver',
+        {
+          root: ['.'],
+          extensions: ['.ios.js', '.android.js', '.js', '.ts', '.tsx', '.json', '.svg'],
+          alias: {
+            '@src': './src',
+            '@modules': './src/modules',
+          },
+        },
+      ],
+      // Must be last.
+      'react-native-reanimated/plugin',
+    ],
+  };
+};

package/templates/mobile/expo/index.js

@@ -0,0 +1,7 @@
+// Must be the very first import (react-native-gesture-handler requirement).
+import 'react-native-gesture-handler';
+import { registerRootComponent } from 'expo';
+import AppProvider from './src/app/app-provider';
+
+// Expo registers the root component under the fixed native module name "main".
+registerRootComponent(AppProvider);

package/templates/mobile/expo/metro.config.js

@@ -0,0 +1,31 @@
+const path = require('path');
+const { getDefaultConfig } = require('expo/metro-config');
+const { wrapWithReanimatedMetroConfig } = require('react-native-reanimated/metro-config');
+
+// --- Monorepo paths ---
+const projectRoot = __dirname;
+const monorepoRoot = path.resolve(projectRoot, '../..');
+
+/**
+ * Metro configuration (Expo + monorepo-aware, with SVG support)
+ * https://docs.expo.dev/guides/monorepos/
+ *
+ * @type {import('expo/metro-config').MetroConfig}
+ */
+const config = getDefaultConfig(projectRoot);
+
+// Watch the whole monorepo so edits in packages/* trigger reloads.
+config.watchFolders = [monorepoRoot];
+
+// Resolve from the app first, then the hoisted monorepo root node_modules.
+config.resolver.nodeModulesPaths = [
+  path.resolve(projectRoot, 'node_modules'),
+  path.resolve(monorepoRoot, 'node_modules'),
+];
+
+// SVG-as-component support (react-native-svg-transformer).
+config.transformer.babelTransformerPath = require.resolve('react-native-svg-transformer/expo');
+config.resolver.assetExts = config.resolver.assetExts.filter(ext => ext !== 'svg');
+config.resolver.sourceExts = [...config.resolver.sourceExts, 'svg'];
+
+module.exports = wrapWithReanimatedMetroConfig(config);

package/templates/mobile/expo/src/app/App.tsx

@@ -0,0 +1,24 @@
+import React, { useEffect } from 'react';
+import { StatusBar } from 'react-native';
+import { useTheme } from '@src/core/theme';
+import { RootNavigator } from './navigation';
+import { useAuthStore } from './stores';
+import { bootstrapLanguage } from './config/translation';
+
+// Root UI component. Restores the persisted session + language, then mounts navigation.
+export function App() {
+  const { resolved } = useTheme();
+  const hydrate = useAuthStore(s => s.hydrate);
+
+  useEffect(() => {
+    void bootstrapLanguage();
+    void hydrate();
+  }, [hydrate]);
+
+  return (
+    <>
+      <StatusBar barStyle={resolved === 'dark' ? 'light-content' : 'dark-content'} />
+      <RootNavigator />
+    </>
+  );
+}

package/templates/mobile/expo/src/app/app-provider.tsx

@@ -0,0 +1,40 @@
+import React from 'react';
+import { GestureHandlerRootView } from 'react-native-gesture-handler';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
+import { I18nextProvider } from 'react-i18next';
+import { onlineManager } from '@tanstack/react-query';
+import { PersistQueryClientProvider } from '@tanstack/react-query-persist-client';
+import NetInfo from '@react-native-community/netinfo';
+import Toast from 'react-native-toast-message';
+import { queryClient, queryPersister, toastConfig } from '@src/core/utils';
+import { ThemeProvider } from '@src/core/theme';
+import { i18n } from './config/translation';
+import { App } from './App';
+
+// Pause/resume React Query based on connectivity (offline-first).
+onlineManager.setEventListener(setOnline =>
+  NetInfo.addEventListener(state => setOnline(Boolean(state.isConnected))),
+);
+
+// The provider tree. Order: gesture root → persisted query cache → i18n →
+// safe-area → theme → app UI. <Toast> is mounted last so it overlays all.
+// Keyboard handling uses React Native's built-in KeyboardAvoidingView (in
+// ScreenContainer) so the app runs in Expo Go without a custom dev build.
+export default function AppProvider() {
+  return (
+    <GestureHandlerRootView style={{ flex: 1 }}>
+      <PersistQueryClientProvider
+        client={queryClient}
+        persistOptions={{ persister: queryPersister }}>
+        <I18nextProvider i18n={i18n}>
+          <SafeAreaProvider>
+            <ThemeProvider>
+              <App />
+              <Toast config={toastConfig} />
+            </ThemeProvider>
+          </SafeAreaProvider>
+        </I18nextProvider>
+      </PersistQueryClientProvider>
+    </GestureHandlerRootView>
+  );
+}

package/templates/mobile/expo/src/app/config/translation.ts

@@ -0,0 +1,30 @@
+import { getLocales } from 'expo-localization';
+import { Translator } from '@src/core/utils';
+import en from '@src/assets/i18n/en.json';
+import fr from '@src/assets/i18n/fr.json';
+
+const resources = {
+  en: { translation: en },
+  fr: { translation: fr },
+};
+
+const fallbackLng = 'en';
+// expo-localization reads the OS preferred-languages list (ships in Expo Go).
+const deviceLanguage = getLocales()[0]?.languageCode ?? fallbackLng;
+
+// Initialize i18next once and expose the instance. The provider mounts it in
+// app-provider.tsx; the active language can be changed via Translator.changeLanguages.
+export const i18n = Translator.setup({
+  resources,
+  lng: deviceLanguage in resources ? deviceLanguage : fallbackLng,
+  fallbackLng,
+  interpolation: { escapeValue: false },
+  // RN's JS engine lacks full Intl.PluralRules — use i18next's v3 plural format
+  // so it doesn't warn and fall back at runtime.
+  compatibilityJSON: 'v3',
+});
+
+// Hook persisted-language restore here if you store a user preference.
+export async function bootstrapLanguage(): Promise<void> {
+  // no-op for the starter; wire AppStorageUtil + Translator.changeLanguages here.
+}

package/templates/mobile/expo/src/app/index.ts

@@ -0,0 +1 @@
+export * from './stores';

package/templates/mobile/expo/src/app/navigation/app-route-type.ts

@@ -0,0 +1,27 @@
+// Central screen registry + typed param list. Add a screen here and every
+// navigation call to it (via NavigationUtil / useNavigation) is type-checked.
+export enum Screen {
+  Home = 'Home',
+  Profile = 'Profile',
+  // Auth / feature screens the core references (e.g. session-expired reset).
+  // Wire real screens for these as you build the app.
+  SignIn = 'SignIn',
+  OtpVerification = 'OtpVerification',
+  PlayerFull = 'PlayerFull',
+  LibraryMain = 'LibraryMain',
+}
+
+export type NavigatorParamList = {
+  [Screen.Home]: undefined;
+  [Screen.Profile]: undefined;
+  [Screen.SignIn]: undefined;
+  [Screen.OtpVerification]: undefined;
+  [Screen.PlayerFull]: undefined;
+  [Screen.LibraryMain]: undefined;
+};
+
+declare global {
+  namespace ReactNavigation {
+    interface RootParamList extends NavigatorParamList {}
+  }
+}