feat: Add React Native mobile app with comprehensive setup

.gitignore

@@ -30,9 +30,9 @@ next-env.d.ts
 # expo
 .expo/
 expo-env.d.ts
-apps/expo/.gitignore
-apps/expo/ios
-apps/expo/android
+apps/mobile/.gitignore
+apps/mobile/ios
+apps/mobile/android
 
 # production
 build

api/chat/src/trpc.ts

@@ -12,7 +12,7 @@ import { initTRPC, TRPCError } from "@trpc/server";
 import superjson from "superjson";
 import { ZodError } from "zod";
 
-import { auth } from "@vendor/clerk/server";
+import { auth, verifyToken } from "@vendor/clerk/server";
 import { db } from "@db/chat/client";
 
 /**
@@ -55,6 +55,34 @@ export const createTRPCContext = async (opts: {
     userId: clerkSession?.userId ?? null,
   };
 
+  if (!session.userId) {
+    const authorization = opts.headers.get("authorization") ?? "";
+    const token = authorization.replace(/^Bearer\s+/i, "").trim();
+
+    if (token.length > 0) {
+      try {
+        const clerkSecretKey = process.env.CLERK_SECRET_KEY;
+
+        if (!clerkSecretKey) {
+          console.warn("Missing CLERK_SECRET_KEY env var; cannot verify token.");
+        } else {
+          const verification = await verifyToken(token, {
+            secretKey: clerkSecretKey,
+          });
+
+          if ("data" in verification && verification.data) {
+            const payload = verification.data as { sub?: string };
+            if (payload.sub) {
+              session.userId = payload.sub;
+            }
+          }
+        }
+      } catch (error) {
+        console.warn("Failed to verify Clerk token", error);
+      }
+    }
+  }
+
   if (session.userId) {
     console.info(`>>> tRPC Request from ${source} by ${session.userId}`);
   } else {

apps/mobile/.expo-shared/assets.json

@@ -0,0 +1,4 @@
+{
+  "12bb71342c6255bbf50437ec8f4441c083f47cdb74bd89160c15e4f43e52a1cb": true,
+  "40b842e832070c58deac6aa9e08fa459302ee3f9da492c7e77d93d2fbf4a56fd": true
+}

apps/mobile/.gitignore

@@ -0,0 +1,6 @@
+
+# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb
+# The following patterns were generated by expo-cli
+
+expo-env.d.ts
+# @end expo-cli

apps/mobile/.prettierignore

@@ -0,0 +1 @@
+nativewind-env.d.ts

apps/mobile/app.config.ts

@@ -0,0 +1,51 @@
+import type { ConfigContext, ExpoConfig } from "expo/config";
+
+export default ({ config }: ConfigContext): ExpoConfig => ({
+  ...config,
+  name: "Lightfast Chat",
+  slug: "lightfast-chat",
+  scheme: "lightfast-chat",
+  version: "0.1.0",
+  orientation: "portrait",
+  icon: "./assets/icon.png",
+  userInterfaceStyle: "dark",
+  updates: {
+    fallbackToCacheTimeout: 0,
+  },
+  newArchEnabled: true,
+  assetBundlePatterns: ["**/*"],
+  ios: {
+    bundleIdentifier: "com.lightfast.chat",
+    supportsTablet: true,
+    icon: "./assets/icon.png",
+  },
+  android: {
+    package: "com.lightfast.chat",
+    adaptiveIcon: {
+      foregroundImage: "./assets/adaptive-icon.png",
+      backgroundColor: "#1a1a1a",
+    },
+    edgeToEdgeEnabled: true,
+  },
+  // extra: {
+  //   eas: {
+  //     projectId: "your-eas-project-id",
+  //   },
+  // },
+  experiments: {
+    tsconfigPaths: true,
+    typedRoutes: true,
+  },
+  plugins: [
+    "expo-router",
+    "expo-secure-store",
+    "expo-web-browser",
+    [
+      "expo-splash-screen",
+      {
+        backgroundColor: "#1a1a1a",
+        image: "./assets/icon.png",
+      },
+    ],
+  ],
+});

apps/mobile/babel.config.js

@@ -0,0 +1,23 @@
+/** @type {import("@babel/core").ConfigFunction} */
+module.exports = (api) => {
+  api.cache(true);
+  return {
+    presets: [
+      ["babel-preset-expo", { jsxImportSource: "nativewind" }],
+      "nativewind/babel",
+    ],
+    plugins: [
+      [
+        "module-resolver",
+        {
+          extensions: [".ts", ".tsx", ".js", ".jsx", ".json"],
+          root: ["./src"],
+          alias: {
+            "@": "./src",
+          },
+        },
+      ],
+      "react-native-reanimated/plugin",
+    ],
+  };
+};

apps/mobile/eas.json

@@ -0,0 +1,33 @@
+{
+  "cli": {
+    "version": ">= 4.1.2",
+    "appVersionSource": "remote"
+  },
+  "build": {
+    "base": {
+      "node": "22.12.0",
+      "pnpm": "9.15.4",
+      "ios": {
+        "resourceClass": "m-medium"
+      }
+    },
+    "development": {
+      "extends": "base",
+      "developmentClient": true,
+      "distribution": "internal"
+    },
+    "preview": {
+      "extends": "base",
+      "distribution": "internal",
+      "ios": {
+        "simulator": true
+      }
+    },
+    "production": {
+      "extends": "base"
+    }
+  },
+  "submit": {
+    "production": {}
+  }
+}

apps/mobile/eslint.config.mjs

@@ -0,0 +1,11 @@
+import baseConfig from "@repo/eslint-config/base";
+import reactConfig from "@repo/eslint-config/react";
+
+/** @type {import('typescript-eslint').Config} */
+export default [
+  {
+    ignores: [".expo/**", "expo-plugins/**"],
+  },
+  ...baseConfig,
+  ...reactConfig,
+];

apps/mobile/index.ts

@@ -0,0 +1 @@
+import "expo-router/entry";

apps/mobile/metro.config.js

@@ -0,0 +1,29 @@
+// Learn more: https://docs.expo.dev/guides/monorepos/
+const { getDefaultConfig } = require("expo/metro-config");
+const { FileStore } = require("metro-cache");
+const { withNativeWind } = require("nativewind/metro");
+
+const path = require("node:path");
+
+const config = withTurborepoManagedCache(
+  withNativeWind(getDefaultConfig(__dirname), {
+    input: "./src/styles.css",
+    configPath: "./tailwind.config.ts",
+  }),
+);
+module.exports = config;
+
+/**
+ * Move the Metro cache to the `.cache/metro` folder.
+ * If you have any environment variables, you can configure Turborepo to invalidate it when needed.
+ *
+ * @see https://turborepo.com/docs/reference/configuration#env
+ * @param {import('expo/metro-config').MetroConfig} config
+ * @returns {import('expo/metro-config').MetroConfig}
+ */
+function withTurborepoManagedCache(config) {
+  config.cacheStores = [
+    new FileStore({ root: path.join(__dirname, ".cache/metro") }),
+  ];
+  return config;
+}

apps/mobile/nativewind-env.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="nativewind/types" />
+
+// NOTE: This file should not be edited and should be committed with your source code. It is generated by NativeWind.

apps/mobile/package.json

@@ -0,0 +1,71 @@
+{
+  "name": "@lightfast/mobile",
+  "version": "0.1.0",
+  "private": true,
+  "main": "index.ts",
+  "scripts": {
+    "clean": "git clean -xdf .cache .expo .turbo android ios node_modules",
+    "dev": "expo start",
+    "dev:android": "expo start --android",
+    "dev:ios": "expo start --ios",
+    "android": "expo run:android",
+    "ios": "expo run:ios",
+    "format": "prettier --check . --ignore-path ../../.gitignore --ignore-path .prettierignore",
+    "lint": "eslint",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@ai-sdk/openai": "^0.0.70",
+    "@ai-sdk/react": "catalog:",
+    "@clerk/clerk-expo": "^2.15.0",
+    "@expo/metro-config": "^0.20.14",
+    "@legendapp/list": "^2.0.2",
+    "@repo/chat-ai-types": "workspace:*",
+    "@stardazed/streams-text-encoding": "^1.0.2",
+    "@tanstack/react-query": "catalog:",
+    "@trpc/client": "catalog:",
+    "@trpc/server": "catalog:",
+    "@trpc/tanstack-react-query": "catalog:",
+    "@ungap/structured-clone": "^1.3.0",
+    "expo": "53.0.9",
+    "expo-auth-session": "~6.2.1",
+    "expo-constants": "17.1.6",
+    "expo-dev-client": "5.1.8",
+    "expo-linking": "7.1.5",
+    "expo-router": "5.0.7",
+    "expo-secure-store": "14.2.3",
+    "expo-splash-screen": "0.30.8",
+    "expo-status-bar": "2.2.3",
+    "expo-system-ui": "~5.0.7",
+    "expo-web-browser": "14.1.6",
+    "lucide-react-native": "^0.544.0",
+    "nativewind": "~4.1.23",
+    "react": "catalog:react19",
+    "react-dom": "catalog:react19",
+    "react-native": "0.79.2",
+    "react-native-gesture-handler": "~2.25.0",
+    "react-native-reanimated": "~3.18.0",
+    "react-native-safe-area-context": "~5.4.1",
+    "react-native-screens": "~4.11.1",
+    "react-native-svg": "^15.13.0",
+    "superjson": "2.2.2",
+    "zod": "catalog:"
+  },
+  "devDependencies": {
+    "@api/chat": "workspace:*",
+    "@babel/core": "^7.27.4",
+    "@babel/preset-env": "^7.27.2",
+    "@babel/runtime": "^7.27.4",
+    "@repo/eslint-config": "workspace:*",
+    "@repo/prettier-config": "workspace:*",
+    "@repo/typescript-config": "workspace:*",
+    "babel-plugin-module-resolver": "^5.0.0",
+    "@types/babel__core": "^7.20.5",
+    "@types/react": "catalog:react19",
+    "eslint": "catalog:",
+    "prettier": "catalog:",
+    "tailwindcss": "^3.4.17",
+    "typescript": "catalog:"
+  },
+  "prettier": "@repo/prettier-config"
+}

apps/mobile/src/app/(auth)/_layout.tsx

@@ -0,0 +1,18 @@
+import { Redirect, Stack } from "expo-router";
+import { View } from "react-native";
+
+import { useAuth } from "@clerk/clerk-expo";
+
+export default function AuthLayout() {
+	const { isLoaded, isSignedIn } = useAuth();
+
+	if (!isLoaded) {
+		return <View className="flex-1 bg-background" />;
+	}
+
+	if (isSignedIn) {
+		return <Redirect href="/" />;
+	}
+
+	return <Stack screenOptions={{ headerShown: false }} />;
+}