From 5b73e89217db75020fa4358be8cc21a47b9e27c6 Mon Sep 17 00:00:00 2001
From: Sanju Sivalingam <spikeysanju98@gmail.com>
Date: Tue, 17 Feb 2026 21:16:58 +0530
Subject: [PATCH] =?UTF-8?q?fix:=20add=20valibot=20schemas=20to=20query()?=
 =?UTF-8?q?=20functions=20=E2=80=94=20fixes=20bad=20request=20on=20detail?=
 =?UTF-8?q?=20page?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/lib/api/devices.remote.ts             | 44 ++++++++++---------
 .../dashboard/devices/[deviceId]/+page.svelte | 10 ++---
 2 files changed, 29 insertions(+), 25 deletions(-)

diff --git a/web/src/lib/api/devices.remote.ts b/web/src/lib/api/devices.remote.ts
index 7514e7a..e46adc6 100644
--- a/web/src/lib/api/devices.remote.ts
+++ b/web/src/lib/api/devices.remote.ts
@@ -1,3 +1,4 @@
+import * as v from 'valibot';
 import { query, getRequestEvent } from '$app/server';
 import { db } from '$lib/server/db';
 import { device, agentSession, agentStep } from '$lib/server/db/schema';
@@ -59,7 +60,7 @@ export const listDevices = query(async () => {
 	});
 });
 
-export const getDevice = query(async (deviceId: string) => {
+export const getDevice = query(v.string(), async (deviceId) => {
 	const { locals } = getRequestEvent();
 	if (!locals.user) return null;
 
@@ -88,7 +89,7 @@ export const getDevice = query(async (deviceId: string) => {
 	};
 });
 
-export const getDeviceStats = query(async (deviceId: string) => {
+export const getDeviceStats = query(v.string(), async (deviceId) => {
 	const { locals } = getRequestEvent();
 	if (!locals.user) return null;
 
@@ -116,7 +117,7 @@ export const getDeviceStats = query(async (deviceId: string) => {
 	}
 });
 
-export const listDeviceSessions = query(async (deviceId: string) => {
+export const listDeviceSessions = query(v.string(), async (deviceId) => {
 	const { locals } = getRequestEvent();
 	if (!locals.user) return [];
 
@@ -130,24 +131,27 @@ export const listDeviceSessions = query(async (deviceId: string) => {
 	return sessions;
 });
 
-export const listSessionSteps = query(async ({ deviceId, sessionId }: { deviceId: string; sessionId: string }) => {
-	const { locals } = getRequestEvent();
-	if (!locals.user) return [];
+export const listSessionSteps = query(
+	v.object({ deviceId: v.string(), sessionId: v.string() }),
+	async ({ deviceId, sessionId }) => {
+		const { locals } = getRequestEvent();
+		if (!locals.user) return [];
 
-	// Verify session belongs to user
-	const sess = await db
-		.select()
-		.from(agentSession)
-		.where(and(eq(agentSession.id, sessionId), eq(agentSession.userId, locals.user.id)))
-		.limit(1);
+		// Verify session belongs to user
+		const sess = await db
+			.select()
+			.from(agentSession)
+			.where(and(eq(agentSession.id, sessionId), eq(agentSession.userId, locals.user.id)))
+			.limit(1);
 
-	if (sess.length === 0) return [];
+		if (sess.length === 0) return [];
 
-	const steps = await db
-		.select()
-		.from(agentStep)
-		.where(eq(agentStep.sessionId, sessionId))
-		.orderBy(agentStep.stepNumber);
+		const steps = await db
+			.select()
+			.from(agentStep)
+			.where(eq(agentStep.sessionId, sessionId))
+			.orderBy(agentStep.stepNumber);
 
-	return steps;
-});
+		return steps;
+	}
+);
diff --git a/web/src/routes/dashboard/devices/[deviceId]/+page.svelte b/web/src/routes/dashboard/devices/[deviceId]/+page.svelte
index 4bd0f6f..53e1b0a 100644
--- a/web/src/routes/dashboard/devices/[deviceId]/+page.svelte
+++ b/web/src/routes/dashboard/devices/[deviceId]/+page.svelte
@@ -41,9 +41,9 @@
 		id: string;
 		goal: string;
 		status: string;
-		stepsUsed: number;
-		startedAt: string;
-		completedAt: string | null;
+		stepsUsed: number | null;
+		startedAt: Date;
+		completedAt: Date | null;
 	}
 	interface Step {
 		id: string;
@@ -144,8 +144,8 @@
 		return unsub;
 	});
 
-	function formatTime(iso: string) {
-		return new Date(iso).toLocaleString();
+	function formatTime(d: string | Date) {
+		return (d instanceof Date ? d : new Date(d)).toLocaleString();
 	}
 
 	function relativeTime(iso: string) {