H1K0-dev/tanabata
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(frontend): auto-fill viewport on file list load

Browse Source 
After each batch, check if the scroll container is still shorter than
the viewport (scrollHeight <= clientHeight) and keep loading until the
scrollbar appears or there are no more files.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Masahiko AMANO 2026-04-07 00:06:45 +03:00
parent 012c6f9c48
commit 70cbb45b01
1 changed files with 10 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/routes/files/+page.svelte
View File

@ -13,10 +13,13 @@
import { selectionStore, selectionActive } from '$lib/stores/selection';
import ConfirmDialog from '$lib/components/common/ConfirmDialog.svelte';
import BulkTagEditor from '$lib/components/file/BulkTagEditor.svelte';
import { tick } from 'svelte';
import { parseDslFilter } from '$lib/utils/dsl';
import type { File, FileCursorPage, Pool, PoolOffsetPage } from '$lib/api/types';
import { appSettings } from '$lib/stores/appSettings';
let scrollContainer = $state<HTMLElement | undefined>();
let uploader = $state<{ open: () => void } | undefined>();
let confirmDeleteFiles = $state(false);
@ -121,6 +124,12 @@
} finally {
loading = false;
}
// If the loaded content doesn't fill the viewport yet (no scrollbar),
// keep loading until it does or there's nothing left.
await tick();
if (hasMore && scrollContainer && scrollContainer.scrollHeight <= scrollContainer.clientHeight) {
void loadMore();
}
}
function applyFilter(filter: string | null) {
@ -244,7 +253,7 @@
{/if}
<FileUpload bind:this={uploader} onUploaded={handleUploaded}>
<main>
<main bind:this={scrollContainer}>
{#if error}
<p class="error" role="alert">{error}</p>
{/if}