From f7664fdf425555e0f85b74d904cfa4eaf57cf7af Mon Sep 17 00:00:00 2001
From: oliver <97427849+flamboh@users.noreply.github.com>
Date: Sat, 10 Oct 2026 05:23:40 -0700
Subject: [PATCH] perf(web): Open Source Licenses downloads its manifest once
 per session (#17119)

---
 .../settings/OpenSourceLicenses.tsx           | 50 ++++++++++++++-----
 1 file changed, 37 insertions(+), 13 deletions(-)

diff --git a/apps/web/src/components/settings/OpenSourceLicenses.tsx b/apps/web/src/components/settings/OpenSourceLicenses.tsx
index 02a87caf7ac781979d9331ec3d7090539d5c13f7..4005db89a35b800d7529979b97162f66cc36f659 100644
--- a/apps/web/src/components/settings/OpenSourceLicenses.tsx
+++ b/apps/web/src/components/settings/OpenSourceLicenses.tsx
@@ -21,15 +21,35 @@ type LicenseManifestState =
   | { readonly status: "error"; readonly message: string }
   | { readonly status: "ready"; readonly manifest: ThirdPartyLicenseManifest };
 
-async function loadLicenseManifest(signal: AbortSignal): Promise<ThirdPartyLicenseManifest> {
-  const response = await fetch(
-    `${import.meta.env.BASE_URL.replace(/\/$/, "")}/third-party-licenses.json`,
-    { signal },
-  );
-  if (!response.ok) {
-    throw new Error(`The license manifest request failed with status ${String(response.status)}.`);
+let licenseManifestPromise: Promise<ThirdPartyLicenseManifest> | undefined;
+
+async function fetchLicenseManifest(): Promise<ThirdPartyLicenseManifest> {
+  const signal = AbortSignal.timeout(30_000);
+  try {
+    const response = await fetch(
+      `${import.meta.env.BASE_URL.replace(/\/$/, "")}/third-party-licenses.json`,
+      { signal },
+    );
+    if (!response.ok) {
+      throw new Error(
+        `The license manifest request failed with status ${String(response.status)}.`,
+      );
+    }
+    return decodeThirdPartyLicenseManifest((await response.json()) as unknown);
+  } catch (error) {
+    if (signal.aborted) {
+      throw new Error("The license manifest took too long to load.", { cause: error });
+    }
+    throw error;
   }
-  return decodeThirdPartyLicenseManifest((await response.json()) as unknown);
+}
+
+function loadLicenseManifest(): Promise<ThirdPartyLicenseManifest> {
+  licenseManifestPromise ??= fetchLicenseManifest().catch((error: unknown) => {
+    licenseManifestPromise = undefined;
+    throw error;
+  });
+  return licenseManifestPromise;
 }
 
 function LicenseNoticeRow({
@@ -198,19 +218,23 @@ export function OpenSourceLicensesPanel() {
   const [requestVersion, setRequestVersion] = useState(0);
 
   useEffect(() => {
-    const controller = new AbortController();
+    let cancelled = false;
     setState({ status: "loading" });
-    void loadLicenseManifest(controller.signal).then(
-      (manifest) => setState({ status: "ready", manifest }),
+    void loadLicenseManifest().then(
+      (manifest) => {
+        if (!cancelled) setState({ status: "ready", manifest });
+      },
       (error: unknown) => {
-        if (controller.signal.aborted) return;
+        if (cancelled) return;
         setState({
           status: "error",
           message: error instanceof Error ? error.message : "The license manifest could not load.",
         });
       },
     );
-    return () => controller.abort();
+    return () => {
+      cancelled = true;
+    };
   }, [requestVersion]);
 
   const entries = state.status === "ready" ? state.manifest.entries : [];
-- 
2.54.0