mirror of
https://github.com/immich-app/immich.git
synced 2025-07-07 09:12:56 +02:00
chore: migrate away from event dispatcher (#12820)
This commit is contained in:
parent
529d49471f
commit
124eb8251b
72 changed files with 360 additions and 656 deletions
web/src/lib/components/photos-page
|
@ -28,7 +28,7 @@
|
|||
import { TUNABLES } from '$lib/utils/tunables';
|
||||
import type { AlbumResponseDto, AssetResponseDto } from '@immich/sdk';
|
||||
import { throttle } from 'lodash-es';
|
||||
import { createEventDispatcher, onDestroy, onMount } from 'svelte';
|
||||
import { onDestroy, onMount } from 'svelte';
|
||||
import Portal from '../shared-components/portal/portal.svelte';
|
||||
import Scrubber from '../shared-components/scrubber/scrubber.svelte';
|
||||
import ShowShortcuts from '../shared-components/show-shortcuts.svelte';
|
||||
|
@ -64,6 +64,8 @@
|
|||
export let isShared = false;
|
||||
export let album: AlbumResponseDto | null = null;
|
||||
export let isShowDeleteConfirmation = false;
|
||||
export let onSelect: (asset: AssetResponseDto) => void = () => {};
|
||||
export let onEscape: () => void = () => {};
|
||||
|
||||
let { isViewing: showAssetViewer, asset: viewingAsset, preloadAssets, gridScrollTarget } = assetViewingStore;
|
||||
const { assetSelectionCandidates, assetSelectionStart, selectedGroup, selectedAssets, isMultiSelectState } =
|
||||
|
@ -127,8 +129,6 @@
|
|||
},
|
||||
} = TUNABLES;
|
||||
|
||||
const dispatch = createEventDispatcher<{ select: AssetResponseDto; escape: void }>();
|
||||
|
||||
const isViewportOrigin = () => {
|
||||
return viewport.height === 0 && viewport.width === 0;
|
||||
};
|
||||
|
@ -447,7 +447,7 @@
|
|||
const ids = await stackAssets(Array.from($selectedAssets));
|
||||
if (ids) {
|
||||
$assetStore.removeAssets(ids);
|
||||
dispatch('escape');
|
||||
onEscape();
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -471,7 +471,7 @@
|
|||
}
|
||||
|
||||
const shortcuts: ShortcutOptions[] = [
|
||||
{ shortcut: { key: 'Escape' }, onShortcut: () => dispatch('escape') },
|
||||
{ shortcut: { key: 'Escape' }, onShortcut: onEscape },
|
||||
{ shortcut: { key: '?', shift: true }, onShortcut: () => (showShortcuts = !showShortcuts) },
|
||||
{ shortcut: { key: '/' }, onShortcut: () => goto(AppRoute.EXPLORE) },
|
||||
{ shortcut: { key: 'A', ctrl: true }, onShortcut: () => selectAllAssets($assetStore, assetInteractionStore) },
|
||||
|
@ -539,7 +539,7 @@
|
|||
return !!nextAsset;
|
||||
};
|
||||
|
||||
const handleClose = async ({ detail: { asset } }: { detail: { asset: AssetResponseDto } }) => {
|
||||
const handleClose = async ({ asset }: { asset: AssetResponseDto }) => {
|
||||
assetViewingStore.showAssetViewer(false);
|
||||
showSkeleton = true;
|
||||
$gridScrollTarget = { at: asset.id };
|
||||
|
@ -554,7 +554,7 @@
|
|||
case AssetAction.DELETE: {
|
||||
// find the next asset to show or close the viewer
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-expressions
|
||||
(await handleNext()) || (await handlePrevious()) || (await handleClose({ detail: { asset: action.asset } }));
|
||||
(await handleNext()) || (await handlePrevious()) || (await handleClose({ asset: action.asset }));
|
||||
|
||||
// delete after find the next one
|
||||
assetStore.removeAssets([action.asset.id]);
|
||||
|
@ -649,7 +649,7 @@
|
|||
return;
|
||||
}
|
||||
|
||||
dispatch('select', asset);
|
||||
onSelect(asset);
|
||||
|
||||
if (singleSelect) {
|
||||
element.scrollTop = 0;
|
||||
|
@ -754,8 +754,8 @@
|
|||
{#if isShowDeleteConfirmation}
|
||||
<DeleteAssetDialog
|
||||
size={idsSelectedAssets.length}
|
||||
on:cancel={() => (isShowDeleteConfirmation = false)}
|
||||
on:confirm={() => handlePromiseError(trashOrDelete(true))}
|
||||
onCancel={() => (isShowDeleteConfirmation = false)}
|
||||
onConfirm={() => handlePromiseError(trashOrDelete(true))}
|
||||
/>
|
||||
{/if}
|
||||
|
||||
|
@ -847,9 +847,9 @@
|
|||
{onAssetInGrid}
|
||||
{bucket}
|
||||
viewport={safeViewport}
|
||||
on:select={({ detail: group }) => handleGroupSelect(group.title, group.assets)}
|
||||
on:selectAssetCandidates={({ detail: asset }) => handleSelectAssetCandidates(asset)}
|
||||
on:selectAssets={({ detail: asset }) => handleSelectAssets(asset)}
|
||||
onSelect={({ title, assets }) => handleGroupSelect(title, assets)}
|
||||
onSelectAssetCandidates={handleSelectAssetCandidates}
|
||||
onSelectAssets={handleSelectAssets}
|
||||
/>
|
||||
{/if}
|
||||
</div>
|
||||
|
@ -869,9 +869,9 @@
|
|||
{isShared}
|
||||
{album}
|
||||
onAction={handleAction}
|
||||
on:previous={handlePrevious}
|
||||
on:next={handleNext}
|
||||
on:close={handleClose}
|
||||
onPrevious={handlePrevious}
|
||||
onNext={handleNext}
|
||||
onClose={handleClose}
|
||||
/>
|
||||
{/await}
|
||||
{/if}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue