diff --git a/src/lib/components/layout/FilesModal.svelte b/src/lib/components/layout/FilesModal.svelte index ab075192f4..8aff0d44ef 100644 --- a/src/lib/components/layout/FilesModal.svelte +++ b/src/lib/components/layout/FilesModal.svelte @@ -28,7 +28,7 @@ let page = 0; let allFilesLoaded = false; let filesLoading = false; - let searchDebounceTimeout: any; + let searchDebounceTimer: ReturnType; let selectedFileId: string | null = null; let showDeleteConfirmDialog = false; @@ -61,31 +61,19 @@ const searchHandler = async () => { if (!show) return; - if (searchDebounceTimeout) { - clearTimeout(searchDebounceTimeout); - } - page = 0; files = null; allFilesLoaded = false; - const doSearch = async () => { - try { - const pattern = query ? `*${query}*` : '*'; - const newFiles = await searchFiles(localStorage.token, pattern, 0, PAGE_SIZE); - files = sortFiles(newFiles); - allFilesLoaded = newFiles.length < PAGE_SIZE; - } catch (error) { - // Handle 404 or other errors - show empty state instead of spinner - files = []; - allFilesLoaded = true; - } - }; - - if (query === '') { - await doSearch(); - } else { - searchDebounceTimeout = setTimeout(doSearch, 500); + try { + const pattern = query ? `*${query}*` : '*'; + const newFiles = await searchFiles(localStorage.token, pattern, 0, PAGE_SIZE); + files = sortFiles(newFiles); + allFilesLoaded = newFiles.length < PAGE_SIZE; + } catch (error) { + // Handle 404 or other errors - show empty state instead of spinner + files = []; + allFilesLoaded = true; } }; @@ -152,8 +140,12 @@ showFileItemModal = true; }; - $: if (show) { - searchHandler(); + // Debounce query changes + $: if (show && query !== undefined) { + clearTimeout(searchDebounceTimer); + searchDebounceTimer = setTimeout(() => { + searchHandler(); + }, 300); } onMount(() => { @@ -178,11 +170,16 @@ window.addEventListener('blur', onBlur); return () => { + clearTimeout(searchDebounceTimer); window.removeEventListener('keydown', onKeyDown); window.removeEventListener('keyup', onKeyUp); window.removeEventListener('blur', onBlur); }; }); + + onDestroy(() => { + clearTimeout(searchDebounceTimer); + }); searchHandler()} placeholder={$i18n.t('Search Files')} maxlength="500" /> @@ -254,7 +250,6 @@ class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition" on:click={() => { query = ''; - searchHandler(); }} >