Fix: Add BACKEND_URL env var for server-side fetching in Next.js

deploy.sh

@@ -189,8 +189,9 @@ if ! $BACKEND_ONLY; then
         fi
         
         # Build new version (with reduced memory for stability)
+        # Set NEXT_PUBLIC_API_URL for client-side API calls
         echo "  Building..."
-        NODE_OPTIONS="--max-old-space-size=2048" npm run build
+        NEXT_PUBLIC_API_URL=https://pounce.ch/api/v1 NODE_OPTIONS="--max-old-space-size=2048" npm run build
         BUILD_EXIT=$?
         
         if [ $BUILD_EXIT -eq 0 ]; then
@@ -216,13 +217,13 @@ if ! $BACKEND_ONLY; then
             lsof -ti:3000 2>/dev/null | xargs -r kill -9 2>/dev/null || true
             sleep 1
             
-            # Start new instance
+            # Start new instance with internal backend URL
             if [ -f ".next/standalone/server.js" ]; then
                 echo "  Starting Next.js (standalone)..."
-                nohup env NODE_ENV=production HOSTNAME=0.0.0.0 PORT=3000 node .next/standalone/server.js > frontend.log 2>&1 &
+                nohup env NODE_ENV=production HOSTNAME=0.0.0.0 PORT=3000 BACKEND_URL=http://127.0.0.1:8000 node .next/standalone/server.js > frontend.log 2>&1 &
             else
                 echo "  Starting Next.js (npm start)..."
-                nohup env NODE_ENV=production npm run start > frontend.log 2>&1 &
+                nohup env NODE_ENV=production BACKEND_URL=http://127.0.0.1:8000 npm run start > frontend.log 2>&1 &
             fi
             sleep 2
             

frontend/src/app/buy/[slug]/page.tsx

@@ -7,22 +7,12 @@ import type { Listing } from './types'
 
 async function fetchListing(slug: string): Promise<Listing | null> {
   try {
-    // Build API URL correctly:
-    // - BACKEND_URL is just the host (e.g. http://127.0.0.1:8000)
-    // - NEXT_PUBLIC_API_URL already includes /api/v1 (e.g. https://pounce.ch/api/v1)
-    // - SITE_URL is just the frontend host (e.g. https://pounce.ch)
-    let apiUrl: string
+    // For server-side: use internal backend URL directly
+    // BACKEND_URL should be http://127.0.0.1:8000 on the server
+    const backendUrl = process.env.BACKEND_URL || 'http://127.0.0.1:8000'
+    const apiUrl = `${backendUrl.replace(/\/$/, '')}/api/v1/listings/${encodeURIComponent(slug)}`
     
-    if (process.env.BACKEND_URL) {
-      // Internal backend URL (no /api/v1 suffix)
-      apiUrl = `${process.env.BACKEND_URL.replace(/\/$/, '')}/api/v1/listings/${encodeURIComponent(slug)}`
-    } else if (process.env.NEXT_PUBLIC_API_URL) {
-      // Already includes /api/v1
-      apiUrl = `${process.env.NEXT_PUBLIC_API_URL.replace(/\/$/, '')}/listings/${encodeURIComponent(slug)}`
-    } else {
-      // Fallback to site URL
-      apiUrl = `${SITE_URL.replace(/\/$/, '')}/api/v1/listings/${encodeURIComponent(slug)}`
-    }
+    console.log(`[fetchListing] Fetching: ${apiUrl}`)
     
     const res = await fetch(apiUrl, {
       next: { revalidate: 60 },
@@ -31,9 +21,12 @@ async function fetchListing(slug: string): Promise<Listing | null> {
       },
     })
     
+    console.log(`[fetchListing] Response: ${res.status} for ${slug}`)
+    
     if (res.status === 404) return null
     if (!res.ok) {
-      console.error(`[fetchListing] Failed to load listing ${slug}: ${res.status} from ${apiUrl}`)
+      const text = await res.text()
+      console.error(`[fetchListing] Failed: ${res.status} - ${text}`)
       return null
     }
     return (await res.json()) as Listing