diff --git a/frontend/src/lib/hooks/useFileLoader.svelte.ts b/frontend/src/lib/hooks/useFileLoader.svelte.ts index a2b7356e..f7e7feee 100644 --- a/frontend/src/lib/hooks/useFileLoader.svelte.ts +++ b/frontend/src/lib/hooks/useFileLoader.svelte.ts @@ -1,3 +1,5 @@ +import { untrack } from 'svelte'; + export function createFileLoader() { let fileUrl = $state(''); let isLoading = $state(false); @@ -6,7 +8,11 @@ export function createFileLoader() { async function loadFile(url: string): Promise { isLoading = true; fileError = ''; - if (fileUrl) URL.revokeObjectURL(fileUrl); + // untrack prevents callers ($effect) from accidentally subscribing to fileUrl. + // Without it, the calling effect would re-run every time fileUrl changes (i.e. + // on every successful load), creating an infinite load loop. + const prev = untrack(() => fileUrl); + if (prev) URL.revokeObjectURL(prev); fileUrl = ''; try {