@thunder-stack/create-thunder-app 0.0.1

package/index.js

@@ -0,0 +1,229 @@
+#!/usr/bin/env node
+
+import fs from 'fs';
+import path from 'path';
+import readline from 'readline';
+import { fileURLToPath } from 'url';
+import { execSync } from 'child_process';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+// Interactive readline interface
+const rl = readline.createInterface({
+  input: process.stdin,
+  output: process.stdout
+});
+
+const question = (query) => new Promise((resolve) => rl.question(query, resolve));
+
+function createLink(target, source) {
+  if (fs.existsSync(target)) {
+    try {
+      const stats = fs.lstatSync(target);
+      if (stats.isSymbolicLink()) {
+        fs.unlinkSync(target);
+      } else if (stats.isDirectory()) {
+        fs.rmdirSync(target);
+      }
+    } catch (err) {
+      // Ignore busy target folders
+    }
+  }
+
+  const type = process.platform === 'win32' ? 'junction' : 'dir';
+  try {
+    fs.symlinkSync(source, target, type);
+    console.log(`Mapped link: ${target} -> ${source}`);
+  } catch (err) {
+    console.error(`Error mapping link ${target}:`, err.message);
+  }
+}
+
+async function main() {
+  console.log('\x1b[33m%s\x1b[0m', '⚡ Welcome to the THUNDER Stack Installer! ⚡');
+  
+  let projectName = process.argv[2]?.trim();
+  let targetDir;
+  let isCurrentDir = false;
+
+  if (projectName === '.') {
+    targetDir = process.cwd();
+    projectName = path.basename(targetDir);
+    isCurrentDir = true;
+  } else if (projectName) {
+    projectName = projectName.toLowerCase();
+    targetDir = path.resolve(process.cwd(), projectName);
+  } else {
+    projectName = await question('Enter your project name (default: my-thunder-app): ');
+    projectName = projectName.trim().toLowerCase() || 'my-thunder-app';
+    targetDir = path.resolve(process.cwd(), projectName);
+  }
+
+  // Sanitize name to be compliant with npm package naming guidelines
+  projectName = projectName.toLowerCase().replace(/[^a-z0-9-_]/g, '-');
+
+  if (isCurrentDir) {
+    const existingFiles = fs.readdirSync(targetDir);
+    const nonIgnoredFiles = existingFiles.filter(file => ![
+      'node_modules',
+      'dist',
+      '.next',
+      '.turbo',
+      '.expo',
+      'create-thunder-app',
+      'package.json'
+    ].includes(file));
+
+    if (nonIgnoredFiles.length > 0) {
+      const overwrite = await question('Current directory is not empty. Proceed anyway? (y/N): ');
+      if (overwrite.toLowerCase().trim() !== 'y') {
+        console.log('Aborted.');
+        rl.close();
+        process.exit(0);
+      }
+    }
+  } else if (fs.existsSync(targetDir)) {
+    const overwrite = await question(`Directory "${projectName}" already exists. Overwrite? (y/N): `);
+    if (overwrite.toLowerCase().trim() !== 'y') {
+      console.log('Aborted.');
+      rl.close();
+      process.exit(0);
+    }
+    console.log(`Cleaning target directory: ${targetDir}`);
+    fs.rmSync(targetDir, { recursive: true, force: true });
+  }
+
+  console.log(`\nCreating a new THUNDER Stack app in: ${targetDir}\n`);
+  if (!isCurrentDir) {
+    fs.mkdirSync(targetDir, { recursive: true });
+  }
+
+  // Locate the source template directory
+  // In development, the template is the monorepo root.
+  // We check if we are inside a monorepo development structure
+  let sourceDir = path.resolve(__dirname, '../..');
+  
+  // Verify if it's the correct source monorepo
+  const rootPackageJsonPath = path.join(sourceDir, 'package.json');
+  let isDevMode = false;
+  if (fs.existsSync(rootPackageJsonPath)) {
+    const pkg = JSON.parse(fs.readFileSync(rootPackageJsonPath, 'utf8'));
+    if (pkg.name === 'thunder-monorepo') {
+      isDevMode = true;
+    }
+  }
+
+  if (!isDevMode) {
+    sourceDir = path.join(__dirname, 'template');
+  }
+
+  const ignoreList = [
+    'node_modules',
+    'dist',
+    '.next',
+    '.open-next',
+    '.turbo',
+    '.expo',
+    'web-build',
+    '.git',
+    'pnpm-lock.yaml',
+    '.env',
+    'create-thunder-app', // Ignore this package directory itself
+  ];
+
+  const safeProjectName = projectName.toLowerCase();
+  const capitalizedProjectName = projectName.charAt(0).toUpperCase() + projectName.slice(1);
+
+  function copyFolderRecursive(src, dest) {
+    if (!fs.existsSync(src)) return;
+    
+    const stats = fs.statSync(src);
+    if (stats.isDirectory()) {
+      const folderName = path.basename(src);
+      if (ignoreList.includes(folderName)) return;
+
+      if (!fs.existsSync(dest)) {
+        fs.mkdirSync(dest, { recursive: true });
+      }
+
+      const files = fs.readdirSync(src);
+      for (const file of files) {
+        copyFolderRecursive(path.join(src, file), path.join(dest, file));
+      }
+    } else {
+      // Copy file and perform replacements if text-based
+      const ext = path.extname(src);
+      const textExtensions = ['.json', '.js', '.ts', '.tsx', '.css', '.html', '.md', '.toml', '.yml', '.yaml', '.example'];
+      
+      if (textExtensions.includes(ext) || path.basename(src).startsWith('.')) {
+        let content = fs.readFileSync(src, 'utf8');
+        
+        // Perform template replacements
+        content = content.replace(/thunder-monorepo/g, `${safeProjectName}-monorepo`);
+        content = content.replace(/@thunder\//g, `@${safeProjectName}/`);
+        content = content.replace(/thunder-api/g, `${safeProjectName}-api`);
+        content = content.replace(/Thunder Mobile App/g, `${capitalizedProjectName} Mobile App`);
+        content = content.replace(/thunder-mobile-app/g, `${safeProjectName}-mobile-app`);
+        content = content.replace(/"scheme": "thunder"/g, `"scheme": "${safeProjectName}"`);
+        content = content.replace(/com\.thunder\.app/g, `com.${safeProjectName}.app`);
+        content = content.replace(/admin@thunderstack\.dev/g, `admin@${safeProjectName}.dev`);
+        
+        fs.writeFileSync(dest, content, 'utf8');
+      } else {
+        // Binary copy
+        fs.copyFileSync(src, dest);
+      }
+    }
+  }
+
+  console.log('Scaffolding files...');
+  copyFolderRecursive(sourceDir, targetDir);
+
+  // Set up directory junctions/symlinks for static assets mapping
+  const assetsSource = path.join(targetDir, 'client/assets');
+  const nextPublic = path.join(targetDir, 'client/next/public');
+  const expoAssets = path.join(targetDir, 'client/expo/assets');
+  
+  console.log('Mapping shared public assets...');
+  createLink(nextPublic, assetsSource);
+  createLink(expoAssets, assetsSource);
+
+  // Copy .env.example to .env
+  const envExamplePath = path.join(targetDir, '.env.example');
+  const envPath = path.join(targetDir, '.env');
+  if (fs.existsSync(envExamplePath)) {
+    fs.copyFileSync(envExamplePath, envPath);
+    console.log('Created .env config file from template.');
+  }
+
+  // Automate dependency installation and asset mapping
+  console.log('\nInstalling dependencies and mapping shared assets... This may take a minute.');
+  try {
+    let installCmd = 'pnpm install';
+    try {
+      execSync('pnpm --version', { stdio: 'ignore' });
+    } catch (e) {
+      installCmd = 'npm install';
+    }
+    
+    console.log(`Running "${installCmd}" in project directory: ${targetDir}`);
+    execSync(installCmd, { cwd: targetDir, stdio: 'inherit' });
+    console.log('\x1b[32m%s\x1b[0m', 'Dependencies installed and assets mapped successfully!');
+  } catch (err) {
+    console.error('\x1b[31m%s\x1b[0m', 'Warning: Failed to install dependencies automatically. You can install them manually using "pnpm install" or "npm install".');
+  }
+
+  console.log('\x1b[32m%s\x1b[0m', '\nProject successfully scaffolded!');
+  console.log('\nTo get started, run:');
+  console.log(`  cd ${projectName}`);
+  console.log('  pnpm dev\n');
+
+  rl.close();
+}
+
+main().catch((err) => {
+  console.error('Error during scaffolding:', err);
+  rl.close();
+  process.exit(1);
+});

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "@thunder-stack/create-thunder-app",
+  "version": "0.0.1",
+  "description": "Scaffold a new THUNDER Stack cross-platform monorepo application",
+  "bin": {
+    "create-thunder-app": "./index.js"
+  },
+  "type": "module",
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "keywords": [
+    "solito",
+    "nextjs",
+    "expo",
+    "hono",
+    "drizzle",
+    "monorepo"
+  ],
+  "scripts": {
+    "prepublishOnly": "node prepublish.js",
+    "postpublish": "node postpublish.js"
+  },
+  "author": "THUNDER Stack",
+  "license": "MIT"
+}

package/postpublish.js

@@ -0,0 +1,14 @@
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const templateDir = path.join(__dirname, 'template');
+
+if (fs.existsSync(templateDir)) {
+  console.log('Cleaning up temporary template directory...');
+  fs.rmSync(templateDir, { recursive: true, force: true });
+  console.log('Cleanup complete.');
+}

package/prepublish.js

@@ -0,0 +1,68 @@
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const rootDir = path.resolve(__dirname, '../..');
+const templateDir = path.join(__dirname, 'template');
+
+// Clean target first
+if (fs.existsSync(templateDir)) {
+  fs.rmSync(templateDir, { recursive: true, force: true });
+}
+fs.mkdirSync(templateDir, { recursive: true });
+
+const foldersToCopy = ['client', 'server', 'packages/tsconfig', 'scripts'];
+const filesToCopy = [
+  'package.json',
+  'pnpm-workspace.yaml',
+  'turbo.json',
+  '.gitignore',
+  '.env.example',
+  'THUNDER_STACK.md',
+  'README.md'
+];
+
+function copyRecursive(src, dest) {
+  const lstats = fs.lstatSync(src);
+  if (lstats.isSymbolicLink()) {
+    // Skip symbolic links and junctions (they will be created fresh by the installer)
+    return;
+  }
+  
+  if (lstats.isDirectory()) {
+    fs.mkdirSync(dest, { recursive: true });
+    const files = fs.readdirSync(src);
+    for (const file of files) {
+      if (file !== 'node_modules' && file !== 'dist' && file !== '.next' && file !== '.turbo' && file !== '.expo' && file !== 'web-build') {
+        copyRecursive(path.join(src, file), path.join(dest, file));
+      }
+    }
+  } else {
+    fs.copyFileSync(src, dest);
+  }
+}
+
+console.log('Packaging monorepo template files...');
+
+// Copy folders
+for (const folder of foldersToCopy) {
+  const src = path.join(rootDir, folder);
+  const dest = path.join(templateDir, folder);
+  if (fs.existsSync(src)) {
+    copyRecursive(src, dest);
+  }
+}
+
+// Copy files
+for (const file of filesToCopy) {
+  const src = path.join(rootDir, file);
+  const dest = path.join(templateDir, file);
+  if (fs.existsSync(src)) {
+    fs.copyFileSync(src, dest);
+  }
+}
+
+console.log('Template packaging complete.');

package/template/.env.example

@@ -0,0 +1,13 @@
+# Database Connection URL (e.g. Neon PostgreSQL)
+DATABASE_URL="postgres://username:password@hostname.neon.tech/dbname?sslmode=require"
+
+# Better Auth Configuration
+BETTER_AUTH_SECRET="your_better_auth_secret_here"
+BETTER_AUTH_URL="http://localhost:8787"
+
+# Public API URL (used by Next.js / Mobile clients to reach the Hono server)
+NEXT_PUBLIC_API_URL="http://localhost:8787"
+
+# OAuth Credentials (Google)
+GOOGLE_CLIENT_ID="your_google_client_id.apps.googleusercontent.com"
+GOOGLE_CLIENT_SECRET="your_google_client_secret"

package/template/README.md

@@ -0,0 +1 @@
+# THUNDER Stack

package/template/THUNDER_STACK.md

@@ -0,0 +1,120 @@
+# ⚡ THUNDER Stack Architecture & Development Guide ⚡
+
+Welcome to the **THUNDER Stack**—a premium, type-safe, production-ready monorepo template built for scaffolding cross-platform applications with a shared codebase.
+
+This document acts as a comprehensive reference guide explaining how the stack is structured, what technologies are utilized, and how to write clean cross-platform client code using **Solito**.
+
+---
+
+## 📂 Project Architecture
+
+```
+thunder-monorepo/
+├── client/              # Frontend Applications
+│   ├── expo/            # Mobile client (React Native / Expo iOS & Android)
+│   ├── next/            # Web client (Next.js App Router)
+│   └── shared/          # Shared views, components, and state logic (@thunder/app)
+│
+├── server/              # Backend Services
+│   ├── db/              # Database library & queries module (@thunder/db)
+│   └── hono/            # API Gateway server (@thunder/api)
+│
+└── packages/            # Shared Dev Configs
+    └── tsconfig/        # Centralized TypeScript definitions (@thunder/tsconfig)
+```
+
+---
+
+## 🛠️ Tech Stack Tab Breakdown
+
+Use the sections below to understand the backend, frontend, and cross-platform mechanisms:
+
+### Tab 1: Backend Layer (Hono & Drizzle Database)
+* **API Gateway (`server/hono`):**
+  * Built using **Hono**, a light and fast web framework designed for Edge environments like Cloudflare Workers.
+  * Router mappings are located in `server/hono/src/index.ts`.
+  * Middleware manages CORS rules, routes mounting, and RBAC authentication checking.
+* **Database Client (`server/db`):**
+  * Handled via **Drizzle ORM** (relational queries and SQL migrations).
+  * The PostgreSQL connection client connects to **Neon Database** (serverless Postgres) using HTTP connections via `@neondatabase/serverless` for fast, lightweight queries suited for Cloudflare Workers.
+* **Schema Definition (`server/db/src/schema`):**
+  * **[auth.ts](file:///e:/College/Repos/paripoorna.me/server/db/src/schema/auth.ts)**: Declares Better Auth tables (`user`, `session`, `account`, `verification`) and Drizzle relationships.
+  * **[rbac.ts](file:///e:/College/Repos/paripoorna.me/server/db/src/schema/rbac.ts)**: Declares tables for Role-Based Access Control (`role`, `permission`, `rolePermission`, `userRole`).
+* **Authentication Engine:**
+  * Driven by **Better Auth** mounted directly on Hono endpoint `/api/auth/*`. Session validation is handled using secure HTTP-only cookies.
+
+---
+
+### Tab 2: Frontend Layer (Solito, Next.js, and Expo)
+* **Shared App Package (`client/shared`):**
+  * This is where **99% of your user interface is written**.
+  * Contains folders for `components`, `utils` (API client/auth), and `features` (reusable screens like Auth, Dashboard, User/Role Management).
+  * Expo and Next.js are thin wrapper shells that simply mount screens from this shared folder.
+* **Next.js Web Wrapper (`client/next`):**
+  * Employs Next.js App Router.
+  * Root layout is set in `client/next/app/layout.tsx`.
+  * The main landing page in `client/next/app/page.tsx` just mounts the `<HomeScreen />` component from `@thunder/app`.
+* **Expo Mobile Wrapper (`client/expo`):**
+  * Configured as an Expo Go compatible React Native application.
+  * Mounts `<HomeScreen />` from `@thunder/app` inside a `SafeAreaProvider` layout wrapper.
+
+---
+
+### Tab 3: Solito Cross-Platform Coding Guide
+**Solito** bridges the gap between Next.js and React Native. It allows you to share views between web and native platforms seamlessly. However, writing code that behaves perfectly on both requires adherence to the following constraints:
+
+#### 1. Avoid DOM-Specific or Native-Specific Modules
+* **Web UI Elements:** Never use standard DOM elements like `<div>`, `<span>`, `<p>`, or `<a>` in your shared code. They will crash on iOS and Android. Instead, use React Native's `<View>`, `<Text>`, and `<TouchableOpacity>`.
+* **Web Globals:** Avoid direct access to browser objects like `window`, `document`, or `localStorage` in top-level code. If you must use them, wrap them in checks like `Platform.OS === 'web'` or run them inside `useEffect()`.
+
+#### 2. Cross-Platform Styling (NativeWind)
+* Styling uses **NativeWind (v4)**, allowing Tailwind CSS classes to be translated into React Native StyleSheet objects.
+* Always use shared layout values:
+  * Flex layouts: Use `flex-row`, `flex-wrap`, `items-center`, `justify-between`.
+  * Spacing & Sizing: Use standard utility names (e.g. `p-6`, `gap-4`, `w-full`).
+  * Web-specific grid layouts can be achieved with responsive modifiers: e.g. `className="w-full md:w-64"`.
+
+#### 3. Navigation between screens
+* Never import `next/router` or use React Navigation hooks directly in the shared feature screens.
+* Always import and use **`solito/navigation`**:
+  ```typescript
+  import { useRouter } from "solito/navigation";
+  
+  const router = useRouter();
+  router.push("/management/users");
+  ```
+  Solito automatically translates `router.push` to `next/navigation` on Web and React Navigation actions on Mobile.
+
+#### 4. Package Transpilation in Next.js
+* Web applications require package transpilation for Native-only libraries (e.g. `react-native-web`, `moti`, `react-native-reanimated`).
+* If you install any external library containing React Native components, ensure you add it to `transpilePackages` inside [next.config.js](file:///e:/College/Repos/paripoorna.me/client/next/next.config.js).
+
+#### 5. Layout & Element Debugging
+* Always test animations using **Moti** (built on Reanimated), as standard CSS transitions do not compile on iOS/Android.
+* Keep standard layout sizes predictable. When using lists, implement native scrolling wrappers like `<ScrollView>` and set standard sizing cards to auto-adjust using responsive flex properties.
+
+---
+
+### Tab 4: Monorepo CLI Scripts & Commands
+Manage your local environment, code checks, and serverless builds using the following root scripts:
+
+#### 1. Clean & Installation
+* **`pnpm clean`**: Deletes all temporary build files (`.turbo`, `.next`, `.expo`, `dist`, `web-build`) and `node_modules` recursively across the monorepo.
+* **`pnpm clean:install`**: Cleans the repository and reinstalls all dependencies fresh.
+
+#### 2. Development & Checks
+* **`pnpm dev`**: Starts all development servers (Next.js, Expo, Hono) simultaneously with hot-reloading.
+* **`pnpm build`**: Prepares production builds for all client wrappers.
+* **`pnpm typecheck`**: Runs compiler diagnostics to catch TypeScript issues globally.
+* **`pnpm lint`**: Enforces unified workspace lint configurations.
+* **`pnpm test`**: Runs unit test suites using Jest/Vitest.
+
+#### 3. Database & Seeding
+* **`pnpm db:generate`**: Inspects Drizzle schemas and creates SQL migration scripts.
+* **`pnpm db:migrate`**: Applies migrations to your cloud PostgreSQL instance.
+* **`pnpm db:seed`**: Populates default Roles, Permissions, and test dummy users in the database.
+
+#### 4. Prettier Formatting
+* **`pnpm format`**: Standardizes style alignments on all source files.
+* **`pnpm format:check`**: Verifies formatting health without rewriting source contents.
+

package/template/client/assets/logo.svg

@@ -0,0 +1,36 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="100%" height="100%">
+  <!-- Dark Sleek Background Canvas -->
+  <rect width="512" height="512" rx="96" fill="#0F172A"/>
+  
+  <!-- Subtle inner gradient glow -->
+  <defs>
+    <linearGradient id="thunderGlow" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#38BDF8"/>
+      <stop offset="100%" stop-color="#8B5CF6"/>
+    </linearGradient>
+    <linearGradient id="boltGrad" x1="0%" y1="0%" x2="50%" y2="100%">
+      <stop offset="0%" stop-color="#FEE2E2"/>
+      <stop offset="30%" stop-color="#FDE047"/>
+      <stop offset="100%" stop-color="#EAB308"/>
+    </linearGradient>
+  </defs>
+
+  <!-- Geometric Accent Lines mirroring the Monorepo/Unified structure -->
+  <path d="M64 160 H448 M64 352 H448" stroke="#1E293B" stroke-width="8" stroke-dasharray="16 12"/>
+  <path d="M160 64 V448 M352 64 V448" stroke="#1E293B" stroke-width="8" stroke-dasharray="16 12"/>
+
+  <!-- The THUNDER Bolt (Scaled and shifted slightly upward to avoid text overlap) -->
+  <path d="M288 48 L128 272 H256 L224 464 L384 240 H256 Z" 
+        fill="url(#boltGrad)" 
+        transform="translate(256, 230) scale(0.8) translate(-256, -256)"
+        filter="drop-shadow(0px 8px 24px rgba(234, 179, 8, 0.4))"/>
+        
+  <!-- Subtle branding text integrated cleanly at the bottom -->
+  <text x="256" y="475" 
+        font-family="system-ui, -apple-system, sans-serif" 
+        font-size="28" 
+        font-weight="900" 
+        fill="#64748B" 
+        letter-spacing="6" 
+        text-anchor="middle">THUNDER</text>
+</svg>

package/template/client/expo/App.test.tsx

@@ -0,0 +1,20 @@
+import React from "react";
+import { render } from "@testing-library/react-native";
+import App from "./App";
+
+// Mock the shared screen layout to isolate wrapper testing
+jest.mock("@thunder/app", () => {
+  const { View, Text } = require("react-native");
+  return {
+    HomeScreen: () => (
+      <View>
+        <Text>Thunder Test</Text>
+      </View>
+    ),
+  };
+});
+
+test("renders the Expo App wrapper with the shared home screen", () => {
+  const { getByText } = render(<App />);
+  expect(getByText("Thunder Test")).toBeTruthy();
+});

package/template/client/expo/App.tsx

@@ -0,0 +1,16 @@
+import "./global.css";
+import React from "react";
+import { StatusBar } from "expo-status-bar";
+import { SafeAreaProvider, SafeAreaView } from "react-native-safe-area-context";
+import { HomeScreen } from "@thunder/app";
+
+export default function App() {
+  return (
+    <SafeAreaProvider>
+      <SafeAreaView className="flex-1 bg-slate-950">
+        <StatusBar style="light" />
+        <HomeScreen />
+      </SafeAreaView>
+    </SafeAreaProvider>
+  );
+}

package/template/client/expo/app.json

@@ -0,0 +1,30 @@
+{
+  "expo": {
+    "name": "Thunder Mobile App",
+    "slug": "thunder-mobile-app",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/logo.png",
+    "userInterfaceStyle": "dark",
+    "scheme": "thunder",
+    "splash": {
+      "image": "./assets/logo.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#090d16"
+    },
+    "ios": {
+      "supportsTablet": true,
+      "bundleIdentifier": "com.thunder.app"
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/logo.png",
+        "backgroundColor": "#090d16"
+      },
+      "package": "com.thunder.app"
+    },
+    "web": {
+      "favicon": "./assets/logo.svg"
+    }
+  }
+}

package/template/client/expo/babel.config.js

@@ -0,0 +1,12 @@
+module.exports = function (api) {
+  api.cache(true);
+  return {
+    presets: [
+      ["babel-preset-expo", { jsxImportSource: "nativewind" }],
+      "nativewind/babel",
+    ],
+    plugins: [
+      "react-native-reanimated/plugin",
+    ],
+  };
+};

package/template/client/expo/global.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/template/client/expo/jest.config.js

@@ -0,0 +1,7 @@
+module.exports = {
+  preset: "jest-expo",
+  transformIgnorePatterns: [
+    "node_modules/(?!((jest-)?react-native|@react-native(-community)?)|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|react-native-svg|solito)",
+  ],
+  setupFilesAfterEnv: ["@testing-library/react-native/extend-expect"],
+};

package/template/client/expo/metro.config.js

@@ -0,0 +1,21 @@
+const { getDefaultConfig } = require("expo/metro-config");
+const path = require("path");
+
+const projectRoot = __dirname;
+const workspaceRoot = path.resolve(projectRoot, "../..");
+
+const config = getDefaultConfig(projectRoot);
+
+// 1. Watch all files in the monorepo workspace (including client/shared)
+config.watchFolders = [workspaceRoot];
+
+// 2. Let Metro locate dependencies (inside root node_modules and local node_modules)
+config.resolver.nodeModulesPaths = [
+  path.resolve(projectRoot, "node_modules"),
+  path.resolve(workspaceRoot, "node_modules"),
+];
+
+// 3. Disable hierarchical lookup to prevent duplicate React instances
+config.resolver.disableHierarchicalLookup = true;
+
+module.exports = config;

package/template/client/expo/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "expo-mobile-app",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "start": "expo start",
+    "android": "expo start --android",
+    "ios": "expo start --ios",
+    "web": "expo start --web",
+    "test": "jest"
+  },
+  "dependencies": {
+    "@thunder/app": "workspace:*",
+    "expo": "~51.0.39",
+    "expo-status-bar": "~1.12.1",
+    "moti": "^0.28.1",
+    "nativewind": "^4.2.6",
+    "react": "18.2.0",
+    "react-native": "0.74.1",
+    "react-native-reanimated": "~3.10.1",
+    "react-native-safe-area-context": "4.10.1",
+    "react-native-screens": "3.31.1"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.29.7",
+    "@testing-library/react-native": "^13.3.3",
+    "@types/jest": "^29.5.14",
+    "jest": "^29.7.0",
+    "jest-expo": "~51.0.4",
+    "react-test-renderer": "18.2.0",
+    "typescript": "^5.9.3"
+  }
+}

package/template/client/expo/tsconfig.json

@@ -0,0 +1,6 @@
+{
+  "extends": "expo/tsconfig.base",
+  "compilerOptions": {
+    "strict": true
+  }
+}