fix(webui): prevent redundant thread and media reloads (#5164)

webui/src/lib/http.ts

@@ -12,22 +12,32 @@ export async function fetchWithTimeout(
   const controller = typeof AbortController !== "undefined"
     ? new AbortController()
     : null;
+  const externalSignal = init.signal;
+  const abortFromExternal = () => controller?.abort();
   let timeoutId: ReturnType<typeof setTimeout> | undefined;
 
-  const request = fetch(input, {
-    ...init,
-    signal: controller?.signal ?? init.signal,
-  });
-  const timeout = new Promise<Response>((_, reject) => {
-    timeoutId = setTimeout(() => {
-      reject(new Error(`Request timed out after ${timeoutMs}ms`));
-      controller?.abort();
-    }, timeoutMs);
-  });
+  if (controller && externalSignal) {
+    if (externalSignal.aborted) {
+      controller.abort();
+    } else {
+      externalSignal.addEventListener("abort", abortFromExternal, { once: true });
+    }
+  }
 
   try {
+    const request = fetch(input, {
+      ...init,
+      signal: controller?.signal ?? externalSignal,
+    });
+    const timeout = new Promise<Response>((_, reject) => {
+      timeoutId = setTimeout(() => {
+        reject(new Error(`Request timed out after ${timeoutMs}ms`));
+        controller?.abort();
+      }, timeoutMs);
+    });
     return await Promise.race([request, timeout]);
   } finally {
     if (timeoutId !== undefined) clearTimeout(timeoutId);
+    externalSignal?.removeEventListener("abort", abortFromExternal);
   }
 }