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

fix: Change shortcut listeners from window to document (#18416)

Browse source 
* fix: Change shortcut listeners to document

* fix: split into window and document

* chore: upgrade ui package
This commit is contained in:
Arno 2025-05-21 18:12:00 +02:00 • committed by GitHub
parent b2ef8ea7dd
commit 188188a844
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
25 changed files with 40 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

2
web/src/lib/components/album-page/album-viewer.svelte
View file

@ -48,7 +48,7 @@
});
</script>
<svelte:window
<svelte:document
use:shortcut={{
shortcut: { key: 'Escape' },
onShortcut: () => {

2
web/src/lib/components/asset-viewer/actions/add-to-album-action.svelte
View file

@ -36,7 +36,7 @@
};
</script>
<svelte:window
<svelte:document
use:shortcut={{ shortcut: { key: 'l', shift: shared }, onShortcut: () => (showSelectionModal = true) }}
/>

2
web/src/lib/components/asset-viewer/actions/archive-action.svelte
View file

@ -28,7 +28,7 @@
};
</script>
<svelte:window use:shortcut={{ shortcut: { key: 'a', shift: true }, onShortcut: onArchive }} />
<svelte:document use:shortcut={{ shortcut: { key: 'a', shift: true }, onShortcut: onArchive }} />
<MenuOption
icon={asset.isArchived ? mdiArchiveArrowUpOutline : mdiArchiveArrowDownOutline}

2
web/src/lib/components/asset-viewer/actions/close-action.svelte
View file

@ -11,6 +11,6 @@
let { onClose }: Props = $props();
</script>
<svelte:window use:shortcut={{ shortcut: { key: 'Escape' }, onShortcut: onClose }} />
<svelte:document use:shortcut={{ shortcut: { key: 'Escape' }, onShortcut: onClose }} />
<CircleIconButton color="opaque" icon={mdiArrowLeft} title={$t('go_back')} onclick={onClose} />

2
web/src/lib/components/asset-viewer/actions/delete-action.svelte
View file

@ -73,7 +73,7 @@
};
</script>
<svelte:window
<svelte:document
use:shortcuts={[
{ shortcut: { key: 'Delete' }, onShortcut: () => trashOrDelete(asset.isTrashed) },
{ shortcut: { key: 'Delete', shift: true }, onShortcut: () => trashOrDelete(true) },

2
web/src/lib/components/asset-viewer/actions/download-action.svelte
View file

@ -19,7 +19,7 @@
const onDownloadFile = async () => downloadFile(await getAssetInfo({ id: asset.id, key: authManager.key }));
</script>
<svelte:window use:shortcut={{ shortcut: { key: 'd', shift: true }, onShortcut: onDownloadFile }} />
<svelte:document use:shortcut={{ shortcut: { key: 'd', shift: true }, onShortcut: onDownloadFile }} />
{#if !menuItem}
<CircleIconButton color="opaque" icon={mdiFolderDownloadOutline} title={$t('download')} onclick={onDownloadFile} />

2
web/src/lib/components/asset-viewer/actions/favorite-action.svelte
View file

@ -46,7 +46,7 @@
};
</script>
<svelte:window use:shortcut={{ shortcut: { key: 'f' }, onShortcut: toggleFavorite }} />
<svelte:document use:shortcut={{ shortcut: { key: 'f' }, onShortcut: toggleFavorite }} />
<CircleIconButton
color="opaque"

2
web/src/lib/components/asset-viewer/actions/next-asset-action.svelte
View file

@ -12,7 +12,7 @@
let { onNextAsset }: Props = $props();
</script>
<svelte:window
<svelte:document
use:shortcuts={[
{ shortcut: { key: 'ArrowRight' }, onShortcut: onNextAsset },
{ shortcut: { key: 'd' }, onShortcut: onNextAsset },

2
web/src/lib/components/asset-viewer/actions/previous-asset-action.svelte
View file

@ -12,7 +12,7 @@
let { onPreviousAsset }: Props = $props();
</script>
<svelte:window
<svelte:document
use:shortcuts={[
{ shortcut: { key: 'ArrowLeft' }, onShortcut: onPreviousAsset },
{ shortcut: { key: 'a' }, onShortcut: onPreviousAsset },

2
web/src/lib/components/asset-viewer/actions/show-detail-action.svelte
View file

@ -11,6 +11,6 @@
let { onShowDetail }: Props = $props();
</script>
<svelte:window use:shortcut={{ shortcut: { key: 'i' }, onShortcut: onShowDetail }} />
<svelte:document use:shortcut={{ shortcut: { key: 'i' }, onShortcut: onShowDetail }} />
<CircleIconButton color="opaque" icon={mdiInformationOutline} onclick={onShowDetail} title={$t('info')} />

2
web/src/lib/components/asset-viewer/editor/editor-panel.svelte
View file

@ -40,7 +40,7 @@
const onConfirm = () => (typeof $showCancelConfirmDialog === 'boolean' ? null : $showCancelConfirmDialog());
</script>
<svelte:window use:shortcut={{ shortcut: { key: 'Escape' }, onShortcut: onClose }} />
<svelte:document use:shortcut={{ shortcut: { key: 'Escape' }, onShortcut: onClose }} />
<section class="relative p-2 dark:bg-immich-dark-bg dark:text-immich-dark-fg">
<div class="flex place-items-center gap-2">

2
web/src/lib/components/asset-viewer/photo-viewer.svelte
View file

@ -202,7 +202,7 @@
let containerHeight = $state(0);
</script>
<svelte:window
<svelte:document
use:shortcuts={[
{ shortcut: { key: 'c', ctrl: true }, onShortcut: onCopyShortcut, preventDefault: false },
{ shortcut: { key: 'c', meta: true }, onShortcut: onCopyShortcut, preventDefault: false },

2
web/src/lib/components/asset-viewer/slideshow-bar.svelte
View file

@ -107,7 +107,7 @@
};
</script>
<svelte:window
<svelte:document
onmousemove={showControlBar}
use:shortcuts={[
{ shortcut: { key: 'Escape' }, onShortcut: onClose },

2
web/src/lib/components/faces-page/manage-people-visibility.svelte
View file

@ -108,7 +108,7 @@
let toggleButton = $derived(toggleButtonOptions[getNextVisibility(toggleVisibility)]);
</script>
<svelte:window use:shortcut={{ shortcut: { key: 'Escape' }, onShortcut: onClose }} />
<svelte:document use:shortcut={{ shortcut: { key: 'Escape' }, onShortcut: onClose }} />
<div
class="fixed top-0 flex h-16 w-full items-center justify-between border-b bg-white p-1 dark:border-immich-dark-gray dark:bg-black dark:text-immich-dark-fg md:p-8"

2
web/src/lib/components/memory-page/memory-viewer.svelte
View file

@ -301,7 +301,7 @@
});
</script>
<svelte:window
<svelte:document
use:shortcuts={$isViewing
? []
: [

2
web/src/lib/components/photos-page/actions/download-action.svelte
View file

@ -35,7 +35,7 @@
let menuItemIcon = $derived(getAssets().length === 1 ? mdiFileDownloadOutline : mdiFolderDownloadOutline);
</script>
<svelte:window use:shortcut={{ shortcut: { key: 'd', shift: true }, onShortcut: handleDownloadFiles }} />
<svelte:document use:shortcut={{ shortcut: { key: 'd', shift: true }, onShortcut: handleDownloadFiles }} />
{#if menuItem}
<MenuOption text={$t('download')} icon={menuItemIcon} onClick={handleDownloadFiles} />

2
web/src/lib/components/photos-page/asset-grid.svelte
View file

@ -712,7 +712,7 @@
});
</script>
<svelte:window onkeydown={onKeyDown} onkeyup={onKeyUp} onselectstart={onSelectStart} use:shortcuts={shortcutList} />
<svelte:document onkeydown={onKeyDown} onkeyup={onKeyUp} onselectstart={onSelectStart} use:shortcuts={shortcutList} />
{#if isShowDeleteConfirmation}
<DeleteAssetDialog

10
web/src/lib/components/shared-components/context-menu/menu-option.svelte
View file

@ -1,9 +1,9 @@
<script lang="ts">
import Icon from '$lib/components/elements/icon.svelte';
import { generateId } from '$lib/utils/generate-id';
import { optionClickCallbackStore, selectedIdStore } from '$lib/stores/context-menu.store';
import type { Shortcut } from '$lib/actions/shortcut';
import { shortcutLabel as computeShortcutLabel, shortcut as bindShortcut } from '$lib/actions/shortcut';
import { shortcut as bindShortcut, shortcutLabel as computeShortcutLabel } from '$lib/actions/shortcut';
import Icon from '$lib/components/elements/icon.svelte';
import { optionClickCallbackStore, selectedIdStore } from '$lib/stores/context-menu.store';
import { generateId } from '$lib/utils/generate-id';
interface Props {
text: string;
@ -44,7 +44,7 @@
: () => {};
</script>
<svelte:window use:bindShortcutIfSet />
<svelte:document use:bindShortcutIfSet />
<!-- svelte-ignore a11y_click_events_have_key_events -->
<!-- svelte-ignore a11y_mouse_events_have_key_events -->

2
web/src/lib/components/shared-components/gallery-viewer/gallery-viewer.svelte
View file

@ -446,7 +446,7 @@
});
</script>
<svelte:window
<svelte:document
onkeydown={onKeyDown}
onkeyup={onKeyUp}
onselectstart={onSelectStart}

2
web/src/lib/components/shared-components/search-bar/search-bar.svelte
View file

@ -206,7 +206,7 @@
}
</script>
<svelte:window
<svelte:document
use:shortcuts={[
{ shortcut: { key: 'Escape' }, onShortcut: onEscape },
{ shortcut: { ctrl: true, key: 'k' }, onShortcut: () => input?.select() },

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

@ -98,7 +98,7 @@
};
</script>
<svelte:window
<svelte:document
use:shortcuts={[
{ shortcut: { key: 'a' }, onShortcut: onSelectAll },
{