From 6c1438f733968e80bc752e118eed6229455c7d74 Mon Sep 17 00:00:00 2001 From: Jaime Resano Date: Sat, 22 Aug 2026 18:56:08 +0200 Subject: [PATCH] fix(examples): forward abort signal in tanstack-db-web-starter Electric proxy `proxyElectricRequest` called `fetch(originUrl)` without the incoming request's `AbortSignal`, so a client disconnect left the upstream call to Electric with no cancellation path. For `live=true` long-polls that holds a connection and a fetch slot for the full long-poll timeout (~20s measured) after the client is gone, which compounds with the 256-concurrent-fetch cap that skills/electric-proxy-auth/SKILL.md documents. Forward the signal through to the upstream fetch and pass `request.signal` at the three call sites. The parameter is optional, so existing callers are unaffected. Co-Authored-By: Claude Opus 5 --- .../tanstack-db-web-starter/src/lib/electric-proxy.ts | 10 ++++++++-- .../tanstack-db-web-starter/src/routes/api/projects.ts | 2 +- .../tanstack-db-web-starter/src/routes/api/todos.ts | 2 +- .../tanstack-db-web-starter/src/routes/api/users.ts | 2 +- 4 files changed, 11 insertions(+), 5 deletions(-) diff --git a/examples/tanstack-db-web-starter/src/lib/electric-proxy.ts b/examples/tanstack-db-web-starter/src/lib/electric-proxy.ts index d1ea9b7a29..0b382251a2 100644 --- a/examples/tanstack-db-web-starter/src/lib/electric-proxy.ts +++ b/examples/tanstack-db-web-starter/src/lib/electric-proxy.ts @@ -42,10 +42,16 @@ export function prepareElectricUrl(requestUrl: string): URL { /** * Proxies a request to Electric SQL and returns the response * @param originUrl - The prepared Electric SQL URL + * @param signal - The incoming request's abort signal. Forwarding it means a client disconnect + * also cancels the upstream request, instead of leaving a `live=true` long-poll holding a + * connection to Electric until it times out. * @returns The proxied response */ -export async function proxyElectricRequest(originUrl: URL): Promise { - const response = await fetch(originUrl) +export async function proxyElectricRequest( + originUrl: URL, + signal?: AbortSignal +): Promise { + const response = await fetch(originUrl, { signal }) const headers = new Headers(response.headers) headers.delete(`content-encoding`) headers.delete(`content-length`) diff --git a/examples/tanstack-db-web-starter/src/routes/api/projects.ts b/examples/tanstack-db-web-starter/src/routes/api/projects.ts index eb6accb1a3..04052f9bc2 100644 --- a/examples/tanstack-db-web-starter/src/routes/api/projects.ts +++ b/examples/tanstack-db-web-starter/src/routes/api/projects.ts @@ -20,7 +20,7 @@ const serve = async ({ request }: { request: Request }) => { ) originUrl.searchParams.set(`params[1]`, session.user.id) - return proxyElectricRequest(originUrl) + return proxyElectricRequest(originUrl, request.signal) } export const Route = createFileRoute(`/api/projects`)({ diff --git a/examples/tanstack-db-web-starter/src/routes/api/todos.ts b/examples/tanstack-db-web-starter/src/routes/api/todos.ts index e157a550bc..fda54ce104 100644 --- a/examples/tanstack-db-web-starter/src/routes/api/todos.ts +++ b/examples/tanstack-db-web-starter/src/routes/api/todos.ts @@ -17,7 +17,7 @@ const serve = async ({ request }: { request: Request }) => { originUrl.searchParams.set(`where`, `$1 = ANY(user_ids)`) originUrl.searchParams.set(`params[1]`, session.user.id) - return proxyElectricRequest(originUrl) + return proxyElectricRequest(originUrl, request.signal) } export const Route = createFileRoute(`/api/todos`)({ diff --git a/examples/tanstack-db-web-starter/src/routes/api/users.ts b/examples/tanstack-db-web-starter/src/routes/api/users.ts index 0b404ca3c3..ba2b3ca89d 100644 --- a/examples/tanstack-db-web-starter/src/routes/api/users.ts +++ b/examples/tanstack-db-web-starter/src/routes/api/users.ts @@ -14,7 +14,7 @@ const serve = async ({ request }: { request: Request }) => { const originUrl = prepareElectricUrl(request.url) originUrl.searchParams.set(`table`, `users`) - return proxyElectricRequest(originUrl) + return proxyElectricRequest(originUrl, request.signal) } export const Route = createFileRoute(`/api/users`)({