fix(build): pass VITE_PRIVY_APP_ID env var to fix Privy app ID on staging

package.json

@@ -6,7 +6,7 @@
   "scripts": {
     "dev": "vite",
     "dev:functions": "wrangler pages dev build --port 5173 --live-reload",
-    "build": "NODE_OPTIONS='--max-old-space-size=8192' VITE_COMMIT_SHA=$CF_PAGES_COMMIT_SHA VITE_VERSION=$npm_package_version vite build",
+    "build": "NODE_OPTIONS='--max-old-space-size=8192' VITE_PRIVY_APP_ID=$VITE_PRIVY_APP_ID VITE_COMMIT_SHA=$CF_PAGES_COMMIT_SHA VITE_VERSION=$npm_package_version vite build",
     "preview": "vite preview",
     "test": "vitest",
     "test:watch": "eslint . && vitest",

vite.config.js

@@ -1,6 +1,6 @@
 import react from '@vitejs/plugin-react';
 import path from 'path';
-import { defineConfig } from 'vite';
+import { defineConfig, loadEnv } from 'vite';
 import dynamicImport from 'vite-plugin-dynamic-import';
 import svgr from 'vite-plugin-svgr';
 import basicSsl from '@vitejs/plugin-basic-ssl';
@@ -10,40 +10,54 @@ import { fileURLToPath } from 'url';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
-export default defineConfig({
-  plugins: [react(), svgr(), dynamicImport(), basicSsl()],
-  build: {
-    outDir: 'build',
-    commonjsOptions: { transformMixedEsModules: true },
-    rollupOptions: {
-      external: ['/functions/**'],
+export default defineConfig(({ mode }) => {
+  // Load env file based on `mode` in the current working directory.
+  // Set the third parameter to '' to load all env regardless of the `VITE_` prefix.
+  const env = loadEnv(mode, process.cwd(), '');
+
+  return {
+    plugins: [react(), svgr(), dynamicImport(), basicSsl()],
+    build: {
+      outDir: 'build',
+      commonjsOptions: { transformMixedEsModules: true },
+      rollupOptions: {
+        external: ['/functions/**'],
+      },
     },
-  },
-  resolve: {
-    alias: {
-      '@': path.join(__dirname, 'src/apps'),
-      crypto: 'crypto-browserify',
+    resolve: {
+      alias: {
+        '@': path.join(__dirname, 'src/apps'),
+        crypto: 'crypto-browserify',
+      },
     },
-  },
-  test: {
-    globals: true,
-    environment: 'jsdom',
-    setupFiles: './src/test-utils/setupTests.ts',
     define: {
-      global: 'globalThis',
+      // Explicitly expose VITE_PRIVY_APP_ID to the app
+      // Use process.env directly to ensure Cloudflare Pages env vars are picked up
+      // Fallback to loadEnv value if not in process.env
+      'import.meta.env.VITE_PRIVY_APP_ID': JSON.stringify(
+        process.env.VITE_PRIVY_APP_ID || env.VITE_PRIVY_APP_ID
+      ),
+    },
+    test: {
+      globals: true,
+      environment: 'jsdom',
+      setupFiles: './src/test-utils/setupTests.ts',
+      define: {
+        global: 'globalThis',
+      },
+      pool: 'forks',
     },
-    pool: 'forks',
-  },
-  server: {
-    https: true,
-    host: '0.0.0.0',
-    proxy: {
-      '/api/coinbase': {
-        target: 'https://api.cdp.coinbase.com',
-        changeOrigin: true,
-        rewrite: (path) => path.replace(/^\/api\/coinbase/, ''),
-        secure: true,
+    server: {
+      https: true,
+      host: '0.0.0.0',
+      proxy: {
+        '/api/coinbase': {
+          target: 'https://api.cdp.coinbase.com',
+          changeOrigin: true,
+          rewrite: (path) => path.replace(/^\/api\/coinbase/, ''),
+          secure: true,
+        },
       },
     },
-  },
+  };
 });