From 33333338f7be02796155690d3227bdeebd901024 Mon Sep 17 00:00:00 2001
From: anshul23102 <anshul23102@iiitd.ac.in>
Date: Fri, 22 May 2026 16:27:50 +0530
Subject: [PATCH] fix: replace hardcoded localhost URL with BACKEND_URL env var
 in devcard loader (#218)

The server load function for /devcard/[id] was fetching card data from
a hardcoded http://localhost:3000 URL, causing the route to fail silently
in all non-local environments (staging, production, Docker).

Replace the hardcoded URL with the BACKEND_URL environment variable,
falling back to http://localhost:3000 for local development. This matches
the existing pattern used by the /u/[username] route.

Also improve error handling: wrap the fetch in a try/catch to handle
network-level failures with a proper 500 response, distinguish 404 (card
not found) from other backend errors, and re-throw SvelteKit HttpError
objects so they are not swallowed by the catch block.
---
 .../src/routes/devcard/[id]/+page.server.ts   | 27 +++++++++++++------
 1 file changed, 19 insertions(+), 8 deletions(-)

diff --git a/apps/web/src/routes/devcard/[id]/+page.server.ts b/apps/web/src/routes/devcard/[id]/+page.server.ts
index adc98179..952fd31f 100644
--- a/apps/web/src/routes/devcard/[id]/+page.server.ts
+++ b/apps/web/src/routes/devcard/[id]/+page.server.ts
@@ -1,17 +1,28 @@
 import { error } from '@sveltejs/kit';
 import type { PageServerLoad } from './$types';
 
+const API_BASE = process.env.BACKEND_URL || 'http://localhost:3000';
+
 export const load: PageServerLoad = async ({ params, fetch }) => {
 	const { id } = params;
 
-	// Use internal fetch to reach the backend
-	// In production, this would be the actual API URL
-	const res = await fetch(`http://localhost:3000/api/u/card/${id}`);
+	try {
+		const res = await fetch(`${API_BASE}/api/u/card/${id}`);
 
-	if (!res.ok) {
-		throw error(404, 'Card not found');
-	}
+		if (res.status === 404) {
+			throw error(404, 'Card not found');
+		}
 
-	const card = await res.json();
-	return { card };
+		if (!res.ok) {
+			throw error(500, 'Failed to load card');
+		}
+
+		const card = await res.json();
+		return { card };
+	} catch (err) {
+		if (err && typeof err === 'object' && 'status' in err) {
+			throw err;
+		}
+		throw error(500, 'Failed to connect to backend');
+	}
 };