1. createFileRoute from @tanstack/react-router is a client/...

Prompt

1. createFileRoute from @tanstack/react-router is a client/UI route API and does not accept server: { handlers: ... } (requires createAPIFileRoute from @tanstack/start/api). 2. Specifying server in createFileRoute(...) causes TypeScript excess property check error TS2353. 3. Handler parameters { request } in both GET and POST are not contextually typed and fall back to implicit any (TS7031). 4. Parsing request.json().catch(() => null) produces an untyped any value, bypassing compile-time type safety across all request body accesses. 5. In standard Chrome DevTools Protocol (CDP) clients, input actions return void/undefined; passing undefined to Response.json(undefined) throws a runtime TypeError, which is caught and falsely reported as an HTTP 502 failure on every successful input event. 6. new URL(request.url) throws a runtime TypeError: Invalid URL if the server receives a relative URL string. 7. await postOperatorMessage(...) in POST is unhandled by a try/catch block; any rejection crashes the handler with an unhandled 500 error after the database state has already mutated to "agent". 8. Complete lack of authentication and caller verification on both GET and POST handlers. 9. All queries use supabaseAdmin (service role), bypassing Postgres Row-Level Security (RLS). 10. Insecure Direct Object Reference (IDOR) allows any unauthenticated user to enumerate sessions, view live screens, and inject browser inputs given a UUID. 11. Returning raw error.message in 502 responses exposes CDP WebSocket URLs containing secret authentication tokens and internal hostnames. 12. The client-supplied input object is forwarded directly to browserCommand without sanitization or property allow-listing. 13. request.json() buffers and parses the entire payload in memory before any size limit is verified, exposing the server to memory exhaustion DoS attacks. 14. Total lack of rate limiting on live frame capture polling, operator message creation, and input dispatching. 15. Missing CSRF / Origin / Referer validation on POST. 16. In the takeover flow, re-requesting "human" mode when already in "human" mode unconditionally resets control_mode to "requested", locking out user input and permanently stripping control if agent_busy is true. 17. Non-atomic takeover: during the interval between Update 1 ("requested") and Update 2 ("human"), any concurrent user inputs fail with HTTP 409 ("Előbb vedd át az irányítást."). 18. The second takeover update ignores affected row counts and database errors, returning { ok: true } even when agent_busy was true and human control was never granted. 19. The second takeover update lacks .eq("status", "active"), allowing a session terminated between the two queries to be updated to "human". 20. Requesting "agent" mode unconditionally triggers postOperatorMessage, allowing callers to spam operator messages even if the session was already controlled by the agent or was never controlled by a human. 21. Non-atomic agent handoff: control_mode is set to "agent" before postOperatorMessage completes; a messaging failure leaves the session in "agent" without agent instructions. 22. TOCTOU race: control_mode === "human" is validated via a database read before dispatching input, allowing the agent to reclaim the browser while user input is still in flight. 23. Concurrent POST input requests lack sequence numbers or queueing, allowing network jitter to deliver mouse and keyboard events out of chronological order. 24. If ?frame is requested on an inactive session (data.status !== "active"), the handler silently returns HTTP 200 metadata without an error and without a frame. 25. Regex /^[a-f0-9-]{36}$/i accepts invalid UUIDs (e.g., 36 hyphens), triggering unhandled Postgres 22P02 syntax errors. 26. kind: "mouse" paired with type: "mouseWheel" passes validation without checking deltaX or deltaY (because input.kind !== "wheel" evaluates to true). 27. kind: "wheel" paired with type: "mousePressed", "mouseReleased", or "mouseMoved" passes validation if finite deltas are attached. 28. Mouse event validation fails to validate or enforce required CDP parameters button and clickCount. 29. Number.isInteger(input.modifiers) accepts negative integers and values outside the CDP bitmask range (0–15). 30. Number.isInteger(input.keyCode) accepts negative values. 31. Key event validation permits empty strings "" for key and code. 32. Wheel deltas deltaX and deltaY are unbounded against extreme finite numbers. 33. Viewport bounds are hardcoded to 1280 and 1029 rather than using session dimensions, and use inclusive <= on 0-indexed pixel coordinates (off-by-one). 34. POST input executes a database query before validating the input payload, wasting database capacity on invalid input. 35. An invalid conversation query param silently falls through to id, returning an incorrect "Érvénytelen böngészőnézet." error if id is absent. 36. Sending { id: "...", input: null } falls through to the mode-change validation, returning an incorrect "Érvénytelen irányítási kérés." error. 37. Swallowed database errors in conversation queries: failures in chat_jobs or chat_browser_sessions return HTTP 200 with { sessions: [] }. 38. Database query failures on GET session lookups are misclassified as HTTP 404 instead of 500. 39. Database query failures on POST input lookups and mode updates are misclassified as HTTP 409 instead of 500. 40. Querying non-existent sessions in POST returns HTTP 409 instead of HTTP 404. 41. Early { sessions: [] } response and all error responses (400, 404, 409, 502) lack Cache-Control: private, no-store headers. 42. Asymmetric GET response shapes: ?frame omits the id property, whereas the default GET response includes it. 43. Querying unused database columns: live_url is fetched in GET but never used; agent_busy and control_mode are selected in POST update but discarded. 44. chat_jobs is hard-limited to 20 jobs without pagination, silently omitting sessions linked to older jobs, while the subsequent session query is unbounded. 45. catch (error) in GET shadows the destructured error from the outer database query. 46. UUID regex and dynamic import of @/integrations/supabase/client.server are each duplicated across 4 code paths. import { createFileRoute } from "@tanstack/react-router"; export const Route = createFileRoute("/api/browser")({ server: { handlers: { GET: async ({ request }) => { const query = new URL(request.url).searchParams; const conversation = query.get("conversation"); if (conversation && /^[a-f0-9-]{36}$/i.test(conversation)) { const { supabaseAdmin } = await import("@/integrations/supabase/client.server"); const { data: jobs } = await supabaseAdmin.from("chat_jobs").select("id").eq("conversation_id", conversation).order("created_at", { ascending: false }).limit(20); if (!jobs?.length) return Response.json({ sessions: [] }); const { data } = await supabaseAdmin.from("chat_browser_sessions").select("id,control_mode,status,created_at").in("job_id", jobs.map((job) => job.id)).order("created_at", { ascending: false }); return Response.json({ sessions: data ?? [] }, { headers: { "Cache-Control": "private, no-store" } }); } const id = query.get("id") ?? ""; if (!/^[a-f0-9-]{36}$/i.test(id)) return Response.json({ error: "Érvénytelen böngészőnézet." }, { status: 400 }); const { supabaseAdmin } = await import("@/integrations/supabase/client.server"); const { data, error } = await supabaseAdmin.from("chat_browser_sessions").select("id,cdp_url,live_url,control_mode,status").eq("id", id).maybeSingle(); if (error || !data) return Response.json({ error: "A böngészőnézet nem található." }, { status: 404 }); if (query.has("frame") && data.status === "active") { try { const { browserCommand } = await import("@/lib/browser-cdp.server"); return Response.json({ ...(await browserCommand(data.cdp_url, "frame")), control_mode: data.control_mode, status: data.status }, { headers: { "Cache-Control": "private, no-store" } }); } catch (error) { return Response.json({ error: error instanceof Error ? error.message : "A képernyő nem érhető el." }, { status: 502 }); } } return Response.json({ id: data.id, control_mode: data.control_mode, status: data.status }, { headers: { "Cache-Control": "private, no-store" } }); }, POST: async ({ request }) => { const body = await request.json().catch(() => null); if (body && typeof body.id === "string" && /^[a-f0-9-]{36}$/i.test(body.id) && body.input) { const { supabaseAdmin } = await import("@/integrations/supabase/client.server"); const { data } = await supabaseAdmin.from("chat_browser_sessions").select("cdp_url,control_mode,status").eq("id", body.id).maybeSingle(); if (!data || data.status !== "active" || data.control_mode !== "human") return Response.json({ error: "Előbb vedd át az irányítást." }, { status: 409 }); const input = body.input; const mouse = ["mouse", "wheel"].includes(input.kind) && ["mousePressed", "mouseReleased", "mouseMoved", "mouseWheel"].includes(input.type) && Number.isFinite(input.x) && Number.isFinite(input.y) && input.x >= 0 && input.x <= 1280 && input.y >= 0 && input.y <= 1029 && (input.kind !== "wheel" || (Number.isFinite(input.deltaX) && Number.isFinite(input.deltaY))); const key = input.kind === "key" && ["keyDown", "keyUp"].includes(input.type) && typeof input.key === "string" && input.key.length <= 40 && typeof input.code === "string" && input.code.length <= 40 && Number.isInteger(input.keyCode) && Number.isInteger(input.modifiers); const text = input.kind === "text" && typeof input.text === "string" && input.text.length > 0 && input.text.length <= 10000; if (!mouse && !key && !text) return Response.json({ error: "Érvénytelen bevitel." }, { status: 400 }); try { const { browserCommand } = await import("@/lib/browser-cdp.server"); return Response.json(await browserCommand(data.cdp_url, "input", input)); } catch (error) { return Response.json({ error: error instanceof Error ? error.message : "A bevitel sikertelen." }, { status: 502 }); } } if (!body || typeof body.id !== "string" || !/^[a-f0-9-]{36}$/i.test(body.id) || !["human", "agent"].includes(body.mode)) return Response.json({ error: "Érvénytelen irányítási kérés." }, { status: 400 }); const { supabaseAdmin } = await import("@/integrations/supabase/client.server"); const { data, error } = await supabaseAdmin.from("chat_browser_sessions").update({ control_mode: body.mode === "human" ? "requested" : "agent" }).eq("id", body.id).eq("status", "active").select("id,job_id,agent_busy,control_mode").maybeSingle(); if (error || !data) return Response.json({ error: "A böngésző már leállt." }, { status: 409 }); if (body.mode === "human") await supabaseAdmin.from("chat_browser_sessions").update({ control_mode: "human" }).eq("id", body.id).eq("agent_busy", false).eq("control_mode", "requested"); if (body.mode === "agent") { const { postOperatorMessage } = await import("@/lib/cognitive.server"); await postOperatorMessage(data.job_id, "A felhasználó visszaadta a böngésző irányítását. Vizsgáld meg az aktuális oldalt, és onnan folytasd; ne ismételd meg a már elvégzett műveleteket."); } return Response.json({ ok: true }); }, }, }, }); Send back the complete code with all the fixes. Fix each of the listed errors one by one, making sure to actually correct them so that there are 0 errors remaining. Keep the original imports, since the files exist. Write out every single character; do not abbreviate anything. Fix every error. There must be exactly one file. Do not write anything else; just output the complete code, and it must not contain any comments. Never, under any circumstances, use simplified, substitute, dummy, simulated, or fake code. Write the entire file as complete, unabridged, production-ready code in a single code block. It must be 100% error-free, a complete, error-free file, and must be submitted as a downloadable file. These requirements are mandatory and must be strictly adhered to. If no list of errors is provided, you must find all the errors and fix them. If there were comments in the original code, delete them. And most importantly: YOU MUST NEVER SIMPLIFY!