helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-07 17:27:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore(web): migration svelte 5 syntax (#13883)

Browse source
This commit is contained in:
Alex 2024-11-14 08:43:25 -06:00 • committed by GitHub
parent 9203a61709
commit 0b3742cf13
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
310 changed files with 6435 additions and 4176 deletions
Download patch file Download diff file Expand all files Collapse all files

20
web/src/lib/components/utilities-page/duplicates/duplicate-asset.svelte
View file

@ -7,13 +7,17 @@
import { mdiHeart, mdiMagnifyPlus, mdiImageMultipleOutline } from '@mdi/js';
import { t } from 'svelte-i18n';
export let asset: AssetResponseDto;
export let isSelected: boolean;
export let onSelectAsset: (asset: AssetResponseDto) => void;
export let onViewAsset: (asset: AssetResponseDto) => void;
interface Props {
asset: AssetResponseDto;
isSelected: boolean;
onSelectAsset: (asset: AssetResponseDto) => void;
onViewAsset: (asset: AssetResponseDto) => void;
}
$: isFromExternalLibrary = !!asset.libraryId;
$: assetData = JSON.stringify(asset, null, 2);
let { asset, isSelected, onSelectAsset, onViewAsset }: Props = $props();
let isFromExternalLibrary = $derived(!!asset.libraryId);
let assetData = $derived(JSON.stringify(asset, null, 2));
</script>
<div
@ -24,7 +28,7 @@
<div class="relative w-full">
<button
type="button"
on:click={() => onSelectAsset(asset)}
onclick={() => onSelectAsset(asset)}
class="block relative w-full"
aria-pressed={isSelected}
aria-label={$t('keep')}
@ -74,7 +78,7 @@
<button
type="button"
on:click={() => onViewAsset(asset)}
onclick={() => onViewAsset(asset)}
class="absolute rounded-full top-1 left-1 text-gray-200 p-2 hover:text-white bg-black/35 hover:bg-black/50"
title={$t('view')}
>

29
web/src/lib/components/utilities-page/duplicates/duplicates-compare-control.svelte
View file

@ -11,21 +11,26 @@
import { mdiCheck, mdiTrashCanOutline, mdiImageMultipleOutline } from '@mdi/js';
import { onDestroy, onMount } from 'svelte';
import { t } from 'svelte-i18n';
import { SvelteSet } from 'svelte/reactivity';
export let assets: AssetResponseDto[];
export let onResolve: (duplicateAssetIds: string[], trashIds: string[]) => void;
export let onStack: (assets: AssetResponseDto[]) => void;
interface Props {
assets: AssetResponseDto[];
onResolve: (duplicateAssetIds: string[], trashIds: string[]) => void;
onStack: (assets: AssetResponseDto[]) => void;
}
let { assets, onResolve, onStack }: Props = $props();
const { isViewing: showAssetViewer, asset: viewingAsset, setAsset } = assetViewingStore;
const getAssetIndex = (id: string) => assets.findIndex((asset) => asset.id === id);
let selectedAssetIds = new Set<string>();
$: trashCount = assets.length - selectedAssetIds.size;
let selectedAssetIds = $state(new SvelteSet<string>());
let trashCount = $derived(assets.length - selectedAssetIds.size);
onMount(() => {
const suggestedAsset = suggestDuplicateByFileSize(assets);
if (!suggestedAsset) {
selectedAssetIds = new Set(assets[0].id);
selectedAssetIds = new SvelteSet(assets[0].id);
return;
}
@ -53,7 +58,7 @@
};
const onSelectAll = () => {
selectedAssetIds = new Set(assets.map((asset) => asset.id));
selectedAssetIds = new SvelteSet(assets.map((asset) => asset.id));
};
const handleResolve = () => {
@ -100,12 +105,12 @@
<button
type="button"
class="px-4 py-3 flex place-items-center gap-2 rounded-tl-full rounded-bl-full dark:bg-immich-dark-primary hover:dark:bg-immich-dark-primary/90 bg-immich-primary/25 hover:bg-immich-primary/50"
on:click={onSelectAll}><Icon path={mdiCheck} size="20" />{$t('select_keep_all')}</button
onclick={onSelectAll}><Icon path={mdiCheck} size="20" />{$t('select_keep_all')}</button
>
<button
type="button"
class="px-4 py-3 flex place-items-center gap-2 rounded-tr-full rounded-br-full dark:bg-immich-dark-primary/50 hover:dark:bg-immich-dark-primary/70 bg-immich-primary hover:bg-immich-primary/80 text-white"
on:click={onSelectNone}><Icon path={mdiTrashCanOutline} size="20" />{$t('select_trash_all')}</button
onclick={onSelectNone}><Icon path={mdiTrashCanOutline} size="20" />{$t('select_trash_all')}</button
>
</div>
@ -116,7 +121,7 @@
size="sm"
color="primary"
class="flex place-items-center rounded-tl-full rounded-bl-full gap-2"
on:click={handleResolve}
onclick={handleResolve}
>
<Icon path={mdiCheck} size="20" />{$t('keep_all')}
</Button>
@ -125,7 +130,7 @@
size="sm"
color="red"
class="flex place-items-center rounded-tl-full rounded-bl-full gap-2 py-3"
on:click={handleResolve}
onclick={handleResolve}
>
<Icon path={mdiTrashCanOutline} size="20" />{trashCount === assets.length
? $t('trash_all')
@ -136,7 +141,7 @@
size="sm"
color="primary"
class="flex place-items-center rounded-tr-full rounded-br-full gap-2"
on:click={handleStack}
onclick={handleStack}
disabled={selectedAssetIds.size !== 1}
>
<Icon path={mdiImageMultipleOutline} size="20" />{$t('stack')}