kmc7468/arkvault
1
0
Fork 0
mirror of https://github.com/kmc7468/arkvault.git synced 2026-02-04 16:16:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

썸네일 로딩 로직 최적화

Browse Source
This commit is contained in:
static
2026-01-04 20:01:30 +09:00
parent 0eb1d29259
commit f10a0a2da3
7 changed files with 110 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/lib/components/organisms/Category/File.svelte
View File

@@ -1,9 +1,8 @@
<script lang="ts">
import { browser } from "$app/environment";
import { ActionEntryButton } from "$lib/components/atoms";
import { DirectoryEntryLabel } from "$lib/components/molecules";
import { getFileThumbnail } from "$lib/modules/file";
import type { CategoryFileInfo } from "$lib/modules/filesystem";
import { requestFileThumbnailDownload } from "$lib/services/file";
import type { SelectedFile } from "./service";
import IconClose from "~icons/material-symbols/close";
@@ -16,12 +15,7 @@
let { info, onclick, onRemoveClick }: Props = $props();
let showThumbnail = $derived(
browser && (info.contentType.startsWith("image/") || info.contentType.startsWith("video/")),
);
let thumbnailPromise = $derived(
showThumbnail ? requestFileThumbnailDownload(info.id, info.dataKey?.key) : null,
);
let thumbnail = $derived(getFileThumbnail(info));
</script>
<ActionEntryButton
@@ -30,9 +24,5 @@
actionButtonIcon={onRemoveClick && IconClose}
onActionButtonClick={() => onRemoveClick?.(info)}
>
{#await thumbnailPromise}
<DirectoryEntryLabel type="file" name={info.name} />
{:then thumbnail}
<DirectoryEntryLabel type="file" thumbnail={thumbnail ?? undefined} name={info.name} />
{/await}
<DirectoryEntryLabel type="file" thumbnail={$thumbnail} name={info.name} />
</ActionEntryButton>