upgrade Privy to v3 and wagmi to latest for Next.js 15 compatibility (#286)

* upgrade Privy to v3 and wagmi to latest for Next.js 15 compatibility

* build: add vercel-specific build command in web package.json

Author: benjaminshafii

memory/vercel-memory-optimization.md

@@ -0,0 +1,168 @@
+# Vercel Build & Memory Optimization Guide
+
+## Issues Fixed
+
+### 1. Edge Runtime Crypto Module Error ✅
+
+**Problem**: `@privy-io/server-auth` uses Node.js `crypto` module which isn't supported in Edge Runtime
+**Solution**: Changed middleware to use Node.js runtime instead of Edge
+
+```typescript
+// packages/web/src/middleware.ts
+export const config = {
+  runtime: 'nodejs', // Force Node.js runtime
+  matcher: [...]
+}
+```
+
+### 2. Heap Out of Memory ✅
+
+**Problem**: Build exceeding Node.js default memory limits (8GB Vercel limit)
+**Solutions Applied**:
+
+- **Next.js config optimizations** (`next.config.js`):
+
+  ```javascript
+  experimental: {
+    webpackMemoryOptimizations: true,
+    optimizePackageImports: ['lucide-react', '@radix-ui/react-icons'],
+  }
+  ```
+
+- **Build commands with increased memory**:
+
+  ```json
+  "build": "NODE_OPTIONS='--max-old-space-size=4096' pnpm next build"
+  ```
+
+- **Vercel.json configuration**:
+  ```json
+  {
+    "buildCommand": "NODE_OPTIONS='--max-old-space-size=4096' pnpm build:vercel",
+    "installCommand": "cd ../.. && pnpm install --filter=@zero-finance/web --frozen-lockfile --ignore-scripts --shamefully-hoist"
+  }
+  ```
+
+### 3. Monorepo Configuration ✅
+
+**Problem**: Conflicting vercel.json files (root vs packages/web)
+**Solution**:
+
+- ✅ Removed root `vercel.json`
+- ✅ Keep only `packages/web/vercel.json` with proper monorepo settings
+
+## Current Configuration
+
+### Vercel Build Settings
+
+- **Framework**: Next.js (auto-detected)
+- **Root Directory**: `packages/web`
+- **Build Command**: `NODE_OPTIONS='--max-old-space-size=4096' pnpm build:vercel`
+- **Install Command**: `cd ../.. && pnpm install --filter=@zero-finance/web --frozen-lockfile --ignore-scripts --shamefully-hoist`
+- **Memory Allocation**: 4GB for build, 8GB max on Pro tier
+- **Function Timeout**: 60s for API routes
+
+### Memory Limits by Tier
+
+- **Hobby**: 3GB total (2.5GB allocated to build)
+- **Pro**: 8GB total (7GB allocated to build)
+- **Enterprise**: 12GB total (10GB allocated to build)
+
+Current setting uses 4GB which works on all tiers.
+
+## Vercel Dashboard Settings
+
+Set these in your Vercel project settings:
+
+1. **Root Directory**: `packages/web`
+2. **Framework Preset**: Next.js
+3. **Build Command**: Leave as default (uses vercel.json)
+4. **Install Command**: Leave as default (uses vercel.json)
+5. **Node Version**: 22.x (matches .nvmrc)
+
+## Environment Variables Required
+
+Ensure these are set in Vercel:
+
+```bash
+# Privy
+NEXT_PUBLIC_PRIVY_APP_ID=
+PRIVY_APP_SECRET=
+PRIVY_WEBHOOK_SECRET=
+
+# Database
+DATABASE_URL=
+DIRECT_URL=
+
+# PostHog
+NEXT_PUBLIC_POSTHOG_KEY=
+NEXT_PUBLIC_POSTHOG_HOST=
+
+# Other required vars (check ENV_DEPENDENCIES_REPORT.md)
+```
+
+## Build Performance Tips
+
+1. **Use Enhanced Builds (Pro/Enterprise)**:
+   - 8 CPUs vs 4 CPUs
+   - 16GB memory vs 8GB
+   - 58GB disk vs 29GB
+   - Enable in project settings
+
+2. **Optimize Dependencies**:
+
+   ```bash
+   # Check bundle size
+   pnpm --filter @zero-finance/web build -- --experimental-debug-memory-usage
+   ```
+
+3. **Split Large Dependencies**:
+   - Already configured in `next.config.js` for `circomlibjs` and `ffjavascript`
+
+4. **Monitor Build Diagnostics**:
+   - Go to Deployment → Build Diagnostics tab
+   - Check memory/CPU usage graphs
+
+## Troubleshooting
+
+### Build still fails with OOM
+
+1. Upgrade to Pro tier for 8GB → 16GB enhanced builds
+2. Increase memory: `NODE_OPTIONS='--max-old-space-size=6144'`
+3. Check dependency size: `pnpm list --depth=0 --json | jq '.dependencies | length'`
+
+### Typecheck fails but build succeeds
+
+- This is expected when using `ignoreDuringBuilds: true`
+- Run `pnpm typecheck` locally to catch issues
+- Fix types before deploying
+
+### Edge Runtime still causes issues
+
+- Ensure middleware.ts has `export const config = { runtime: 'nodejs' }`
+- API routes with Privy should NOT export `runtime = 'edge'`
+- Check all API routes in `app/api/` for edge runtime exports
+
+## Testing Locally
+
+Before deploying:
+
+```bash
+# Clean install
+pnpm install
+
+# Test build with memory limit
+NODE_OPTIONS='--max-old-space-size=4096' pnpm --filter @zero-finance/web build
+
+# Run typecheck
+pnpm --filter @zero-finance/web typecheck
+
+# Test locally
+pnpm --filter @zero-finance/web dev
+```
+
+## Resources
+
+- [Vercel Memory Optimization Guide](https://vercel.com/guides/troubleshooting-sigkill-out-of-memory-errors)
+- [Next.js Memory Usage Docs](https://nextjs.org/docs/app/guides/memory-usage)
+- [Middleware Runtime Config](https://nextjs.org/docs/app/building-your-application/routing/middleware#runtime)

packages/web/VERCEL_BUILD_FIX.md

@@ -1,17 +1,16 @@
 /** @type {import('next').NextConfig} */
+const path = require('path');
+
 const nextConfig = {
-  // SEO and Performance Optimizations
   poweredByHeader: false,
   compress: true,
 
-  // Image optimization for better Core Web Vitals
   images: {
     formats: ['image/avif', 'image/webp'],
     domains: ['0.finance'],
     minimumCacheTTL: 60,
   },
 
-  // Security headers
   async headers() {
     return [
       {
@@ -58,42 +57,41 @@ const nextConfig = {
   typescript: {
     tsconfigPath: './tsconfig.next.json',
   },
-  // Optimize for Vercel build memory limits
   experimental: {
     webpackMemoryOptimizations: true,
+    optimizePackageImports: ['lucide-react', '@radix-ui/react-icons'],
   },
-  // Reduce build time and memory usage
-  swcMinify: true,
+  outputFileTracingRoot: path.join(__dirname, '../../'),
+  staticPageGenerationTimeout: 180,
   webpack: (config, { webpack, isServer }) => {
-    config.resolve.fallback = {
-      ...config.resolve.fallback,
-      fs: false,
-      net: false,
-      tls: false,
-      crypto: require.resolve('crypto-browserify'),
-      stream: require.resolve('stream-browserify'),
-      path: require.resolve('path-browserify'),
-      os: require.resolve('os-browserify/browser'),
-    };
+    if (!isServer) {
+      config.resolve.fallback = {
+        ...config.resolve.fallback,
+        fs: false,
+        net: false,
+        tls: false,
+        crypto: require.resolve('crypto-browserify'),
+        stream: require.resolve('stream-browserify'),
+        path: require.resolve('path-browserify'),
+        os: require.resolve('os-browserify/browser'),
+        '@react-native-async-storage/async-storage': false,
+      };
+    }
 
-    // Suppress the critical dependency warning from web-worker
     config.plugins.push(
       new webpack.ContextReplacementPlugin(/web-worker/, (data) => {
         delete data.dependencies[0].critical;
         return data;
       }),
     );
 
-    // Memory optimizations for Vercel
     if (!isServer) {
-      // Reduce bundle size and memory usage
       config.optimization = {
         ...config.optimization,
         splitChunks: {
           ...config.optimization.splitChunks,
           cacheGroups: {
             ...config.optimization.splitChunks.cacheGroups,
-            // Split large dependencies into separate chunks
             circomlibjs: {
               test: /[\\/]node_modules[\\/]circomlibjs.*[\\/]/,
               name: 'circomlibjs',
@@ -111,17 +109,19 @@ const nextConfig = {
       };
     }
 
-    // Limit memory usage during webpack compilation
     config.optimization = {
       ...config.optimization,
       minimize: process.env.NODE_ENV === 'production',
-      // Reduce memory footprint during build
       moduleIds: 'deterministic',
     };
 
     return config;
   },
-  serverExternalPackages: ['require-in-the-middle'],
+  serverExternalPackages: [
+    'require-in-the-middle',
+    '@metamask/sdk',
+    '@wagmi/connectors',
+  ],
 };
 
 module.exports = nextConfig;

packages/web/next.config.js

@@ -3,12 +3,12 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "build": "pnpm next build ",
+    "build": "pnpm next build",
     "build:lite": "dotenv -e .env.lite -- next build",
     "build:prod": "BUILD_DIR=build-prod next build",
     "build:remote": "pnpm db:migrate && pnpm next build",
     "build:safe": "pnpm db:migrate:safe && pnpm next build",
-    "build:vercel": "node scripts/build-vercel.js",
+    "build:vercel": "pnpm build:remote",
     "clean": "git clean -xdf .cache .next .turbo node_modules",
     "dev": "pnpm dev:local",
     "dev:lite": "dotenv -e .env.lite -- next dev --turbo --port 3055",
@@ -47,9 +47,9 @@
     "@lifi/types": "^17.9.0",
     "@lottiefiles/react-lottie-player": "^3.6.0",
     "@paper-design/shaders-react": "^0.0.47",
-    "@privy-io/react-auth": "^2.13.0",
+    "@privy-io/react-auth": "^3.0.1",
     "@privy-io/server-auth": "^1.19.3",
-    "@privy-io/wagmi": "^1.0.3",
+    "@privy-io/wagmi": "^2.0.0",
     "@radix-ui/react-accordion": "^1.2.9",
     "@radix-ui/react-alert-dialog": "^1.1.2",
     "@radix-ui/react-avatar": "^1.1.10",
@@ -129,8 +129,8 @@
     "use-stick-to-bottom": "^1.1.1",
     "uuid": "^11.1.0",
     "vaul": "^1.1.2",
-    "viem": "^2.23.6",
-    "wagmi": "^2.14.6",
+    "viem": "^2.37.12",
+    "wagmi": "^2.17.5",
     "zod": "^4.1.11",
     "zustand": "catalog:"
   },