From 9d579d9b9f6ef239a6fa7ad73a6b5a47d6306142 Mon Sep 17 00:00:00 2001
From: h <h@kotikot.com>
Date: Wed, 21 Jan 2026 02:07:44 +0100
Subject: [PATCH] fix(frontend): ws replacement

---
 frontend/src/lib/convex-polling.svelte.ts   | 13 +++++++++++--
 frontend/src/routes/[mnemonic]/+page.svelte | 21 ++++++++++++++++++---
 2 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/frontend/src/lib/convex-polling.svelte.ts b/frontend/src/lib/convex-polling.svelte.ts
index 627e4ae..da1fe96 100644
--- a/frontend/src/lib/convex-polling.svelte.ts
+++ b/frontend/src/lib/convex-polling.svelte.ts
@@ -12,13 +12,17 @@ type PollingContext = {
 export function hasWebSocketSupport(): boolean {
 	if (typeof window === 'undefined') return true;
 	try {
-		return 'WebSocket' in window && typeof WebSocket !== 'undefined';
-	} catch {
+		const hasWs = 'WebSocket' in window && typeof WebSocket !== 'undefined';
+		console.log('[convex-polling] WebSocket check:', hasWs);
+		return hasWs;
+	} catch (e) {
+		console.log('[convex-polling] WebSocket check error:', e);
 		return false;
 	}
 }
 
 export function setupPollingConvex(url: string): void {
+	console.log('[convex-polling] Setting up polling client with URL:', url);
 	const client = new ConvexHttpClient(url);
 	setContext<PollingContext>(POLLING_CONTEXT_KEY, { client });
 }
@@ -63,22 +67,27 @@ export function usePollingQuery<Query extends FunctionReference<'query'>>(
 	async function poll() {
 		const args = argsGetter();
 		if (args === 'skip') {
+			console.log('[convex-polling] Skipping query (args=skip)');
 			state.isLoading = false;
 			return;
 		}
 
 		const argsJson = JSON.stringify(args);
 		if (argsJson !== lastArgsJson) {
+			console.log('[convex-polling] Args changed, setting loading');
 			state.isLoading = true;
 			lastArgsJson = argsJson;
 		}
 
 		try {
+			console.log('[convex-polling] Polling query with args:', args);
 			const result = await client.query(query, args);
+			console.log('[convex-polling] Query result:', result);
 			state.data = result;
 			state.error = null;
 			state.isLoading = false;
 		} catch (err) {
+			console.error('[convex-polling] Query error:', err);
 			state.error = err instanceof Error ? err : new Error(String(err));
 			state.isLoading = false;
 		}
diff --git a/frontend/src/routes/[mnemonic]/+page.svelte b/frontend/src/routes/[mnemonic]/+page.svelte
index 8da178b..e4aa5fe 100644
--- a/frontend/src/routes/[mnemonic]/+page.svelte
+++ b/frontend/src/routes/[mnemonic]/+page.svelte
@@ -10,6 +10,7 @@
 
 	const usePolling = getContext<boolean>('convex-use-polling') ?? false;
 	let mnemonic = $derived(page.params.mnemonic);
+	let debugInfo = $state('');
 
 	const chatDataWs = usePolling
 		? null
@@ -97,11 +98,25 @@
 </svelte:head>
 
 <div class="min-h-dvh bg-black text-white">
+	<div
+		class="fixed top-1 right-1 z-50 max-w-[200px] rounded bg-neutral-900 p-1 text-[8px] break-all text-neutral-500"
+	>
+		mode: {usePolling ? 'polling' : 'websocket'}<br />
+		mnemonic: {mnemonic}<br />
+		loading: {chatData.isLoading}<br />
+		error: {chatData.error?.message ?? 'none'}<br />
+		data: {chatData.data ? 'yes' : 'no'}
+	</div>
+
 	{#if chatData.isLoading}
-		<div class="flex min-h-dvh items-center justify-center text-neutral-500">Loading...</div>
+		<div class="flex min-h-dvh items-center justify-center text-neutral-500">
+			Loading... ({usePolling ? 'polling' : 'ws'})
+		</div>
 	{:else if chatData.error}
-		<div class="flex min-h-dvh items-center justify-center text-red-500">
-			Error: {chatData.error.toString()}
+		<div class="flex min-h-dvh flex-col items-center justify-center gap-2 p-4 text-red-500">
+			<div>Error:</div>
+			<div class="max-w-full text-xs break-all">{chatData.error.message}</div>
+			<div class="text-[10px] text-neutral-500">Mode: {usePolling ? 'polling' : 'websocket'}</div>
 		</div>
 	{:else if !chatData.data}
 		<div class="flex min-h-dvh items-center justify-center text-neutral-500">Chat not found</div>