From bb8a96d28159402a4308c15551ff68da367c1f40 Mon Sep 17 00:00:00 2001
From: grabowski <berwn@buildfor.life>
Date: Thu, 9 Apr 2026 14:15:36 +0700
Subject: [PATCH] Fix upload size limit: add BODY_SIZE_LIMIT env and error
 handling

- Added BODY_SIZE_LIMIT=52428800 (50MB) to .env.example
- handleError in hooks catches body size exceeded and returns friendly message
- Client-side file size check on image upload input (alerts before submit)
- adapter-node uses BODY_SIZE_LIMIT env var (default was 512KB)

To fix: add BODY_SIZE_LIMIT=52428800 to .env on the server and restart.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .env.example                               |  1 +
 src/hooks.server.ts                        | 16 +++++++++++++++-
 src/routes/(app)/devices/[id]/+page.svelte |  7 +++++++
 3 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/.env.example b/.env.example
index ed25870..5af6bb3 100644
--- a/.env.example
+++ b/.env.example
@@ -1,3 +1,4 @@
 DATABASE_URL=postgresql://bflr:bflr_dev@localhost:5432/buildfor_life_repair
 UPLOAD_DIR=static/uploads
 BASE_URL=http://localhost:5173
+BODY_SIZE_LIMIT=52428800
diff --git a/src/hooks.server.ts b/src/hooks.server.ts
index 857dd76..007503f 100644
--- a/src/hooks.server.ts
+++ b/src/hooks.server.ts
@@ -1,6 +1,20 @@
-import type { Handle } from '@sveltejs/kit';
+import type { Handle, HandleServerError } from '@sveltejs/kit';
 import { validateSession, setSessionCookie, deleteSessionCookie } from '$lib/server/auth/index.js';
 
+export const handleError: HandleServerError = async ({ error }) => {
+	const message = error instanceof Error ? error.message : 'Unknown error';
+
+	// Body size limit exceeded
+	if (message.includes('exceeds limit')) {
+		return {
+			message: 'File too large. Maximum upload size is 50MB.'
+		};
+	}
+
+	console.error('Unhandled error:', error);
+	return { message: 'An unexpected error occurred.' };
+};
+
 export const handle: Handle = async ({ event, resolve }) => {
 	const token = event.cookies.get('session');
 
diff --git a/src/routes/(app)/devices/[id]/+page.svelte b/src/routes/(app)/devices/[id]/+page.svelte
index 2b0a1a6..8a65e48 100644
--- a/src/routes/(app)/devices/[id]/+page.svelte
+++ b/src/routes/(app)/devices/[id]/+page.svelte
@@ -139,6 +139,13 @@
 				{#if showUploadForm}
 					<form method="POST" action="?/uploadImage" enctype="multipart/form-data" use:enhance class="mb-4 flex flex-wrap items-end gap-3">
 						<input type="file" name="image" accept="image/*" required
+							onchange={(e) => {
+								const file = (e.target as HTMLInputElement).files?.[0];
+								if (file && file.size > 50 * 1024 * 1024) {
+									alert('File too large. Maximum size is 50MB.');
+									(e.target as HTMLInputElement).value = '';
+								}
+							}}
 							class="text-sm text-gray-600 dark:text-gray-400" />
 						<input type="text" name="caption" placeholder="Caption (optional)"
 							class="rounded-md border border-gray-300 px-3 py-1.5 text-sm dark:border-gray-600 dark:bg-gray-700 dark:text-white" />