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

feat: Added shortcuts, shift-multi select and missing menu options to Search (Galleryviewer) (#14213)

Browse source 
feat: Added shortcuts, shift-multi select and missing menu options to GalleryViewer (Search, Share, Memories)

Co-authored-by: Alex <alex.tran1502@gmail.com>
This commit is contained in:
weathondev 2024-11-19 19:19:50 +01:00 • committed by GitHub
parent 3a2e30e30e
commit 69e50d0d27
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 238 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

15
web/src/lib/components/share-page/individual-shared-viewer.svelte
View file

@ -6,7 +6,7 @@
import { downloadArchive } from '$lib/utils/asset-utils';
import { fileUploadHandler, openFileUploadDialog } from '$lib/utils/file-uploader';
import { handleError } from '$lib/utils/handle-error';
import { addSharedLinkAssets, type AssetResponseDto, type SharedLinkResponseDto } from '@immich/sdk';
import { addSharedLinkAssets, type SharedLinkResponseDto } from '@immich/sdk';
import { mdiArrowLeft, mdiFileImagePlusOutline, mdiFolderDownloadOutline, mdiSelectAll } from '@mdi/js';
import CircleIconButton from '../elements/buttons/circle-icon-button.svelte';
import DownloadAction from '../photos-page/actions/download-action.svelte';
@ -14,6 +14,8 @@
import AssetSelectControlBar from '../photos-page/asset-select-control-bar.svelte';
import ControlAppBar from '../shared-components/control-app-bar.svelte';
import GalleryViewer from '../shared-components/gallery-viewer/gallery-viewer.svelte';
import { cancelMultiselect } from '$lib/utils/asset-utils';
import { createAssetInteractionStore } from '$lib/stores/asset-interaction.store';
import ImmichLogoSmallLink from '$lib/components/shared-components/immich-logo-small-link.svelte';
import { NotificationType, notificationController } from '../shared-components/notification/notification';
import type { Viewport } from '$lib/stores/assets.store';
@ -27,11 +29,12 @@
let { sharedLink = $bindable(), isOwned }: Props = $props();
const viewport: Viewport = $state({ width: 0, height: 0 });
let selectedAssets: Set<AssetResponseDto> = $state(new Set());
const assetInteractionStore = createAssetInteractionStore();
const { selectedAssets } = assetInteractionStore;
let innerWidth: number = $state(0);
let assets = $derived(sharedLink.assets);
let isMultiSelectionMode = $derived(selectedAssets.size > 0);
let isMultiSelectionMode = $derived($selectedAssets.size > 0);
dragAndDropFilesStore.subscribe((value) => {
if (value.isDragging && value.files.length > 0) {
@ -70,7 +73,7 @@
};
const handleSelectAll = () => {
selectedAssets = new Set(assets);
assetInteractionStore.selectAssets(assets);
};
</script>
@ -78,7 +81,7 @@
<section class="bg-immich-bg dark:bg-immich-dark-bg">
{#if isMultiSelectionMode}
<AssetSelectControlBar assets={selectedAssets} clearSelect={() => (selectedAssets = new Set())}>
<AssetSelectControlBar assets={$selectedAssets} clearSelect={() => cancelMultiselect(assetInteractionStore)}>
<CircleIconButton title={$t('select_all')} icon={mdiSelectAll} onclick={handleSelectAll} />
{#if sharedLink?.allowDownload}
<DownloadAction filename="immich-shared.zip" />
@ -109,6 +112,6 @@
</ControlAppBar>
{/if}
<section class="my-[160px] mx-4" bind:clientHeight={viewport.height} bind:clientWidth={viewport.width}>
<GalleryViewer {assets} bind:selectedAssets {viewport} />
<GalleryViewer {assets} {assetInteractionStore} {viewport} />
</section>
</section>