diff --git a/web/src/lib/components/memory-page/memory-viewer.svelte b/web/src/lib/components/memory-page/memory-viewer.svelte index b6cf44bcb3..2baaf0e610 100644 --- a/web/src/lib/components/memory-page/memory-viewer.svelte +++ b/web/src/lib/components/memory-page/memory-viewer.svelte @@ -3,16 +3,36 @@ import { page } from '$app/stores'; import IntersectionObserver from '$lib/components/asset-viewer/intersection-observer.svelte'; import CircleIconButton from '$lib/components/elements/buttons/circle-icon-button.svelte'; + import AddToAlbum from '$lib/components/photos-page/actions/add-to-album.svelte'; + import ArchiveAction from '$lib/components/photos-page/actions/archive-action.svelte'; + import CreateSharedLink from '$lib/components/photos-page/actions/create-shared-link.svelte'; + import DeleteAssets from '$lib/components/photos-page/actions/delete-assets.svelte'; + import DownloadAction from '$lib/components/photos-page/actions/download-action.svelte'; + import FavoriteAction from '$lib/components/photos-page/actions/favorite-action.svelte'; + import AssetSelectContextMenu from '$lib/components/photos-page/asset-select-context-menu.svelte'; + import AssetSelectControlBar from '$lib/components/photos-page/asset-select-control-bar.svelte'; + import ChangeDate from '$lib/components/photos-page/actions/change-date-action.svelte'; + import ChangeLocation from '$lib/components/photos-page/actions/change-location-action.svelte'; import ControlAppBar from '$lib/components/shared-components/control-app-bar.svelte'; import GalleryViewer from '$lib/components/shared-components/gallery-viewer/gallery-viewer.svelte'; import { AppRoute, QueryParameter } from '$lib/constants'; - import type { Viewport } from '$lib/stores/assets.store'; + import { type Viewport } from '$lib/stores/assets.store'; import { memoryStore } from '$lib/stores/memory.store'; import { getAssetThumbnailUrl, handlePromiseError, memoryLaneTitle } from '$lib/utils'; import { shortcuts } from '$lib/utils/shortcut'; import { fromLocalDateTime } from '$lib/utils/timeline-util'; - import { ThumbnailFormat, getMemoryLane } from '@immich/sdk'; - import { mdiChevronDown, mdiChevronLeft, mdiChevronRight, mdiChevronUp, mdiPause, mdiPlay } from '@mdi/js'; + import { ThumbnailFormat, getMemoryLane, type AssetResponseDto } from '@immich/sdk'; + import { + mdiChevronDown, + mdiChevronLeft, + mdiChevronRight, + mdiChevronUp, + mdiDotsVertical, + mdiPause, + mdiPlay, + mdiPlus, + mdiSelectAll, + } from '@mdi/js'; import { DateTime } from 'luxon'; import { onMount } from 'svelte'; import { tweened } from 'svelte/motion'; @@ -74,6 +94,21 @@ // Progress should be reset when the current memory or asset changes. $: memoryIndex, assetIndex, handlePromiseError(reset()); + let selectedAssets: Set = new Set(); + $: isMultiSelectionMode = selectedAssets.size > 0; + + let memoryGallery: HTMLElement; + let memoryWrapper: HTMLElement; + let galleryInView = false; + + $: isAllArchived = [...selectedAssets].every((asset) => asset.isArchived); + $: isAllFavorite = [...selectedAssets].every((asset) => asset.isFavorite); + $: { + if (!galleryInView) { + selectedAssets = new Set(); + } + } + onMount(async () => { if (!$memoryStore) { const localTime = new Date(); @@ -84,9 +119,16 @@ } }); - let memoryGallery: HTMLElement; - let memoryWrapper: HTMLElement; - let galleryInView = false; + const triggerAssetUpdate = () => (currentMemory.assets = currentMemory.assets); + + const onAssetDelete = (assetIds: string[]) => { + const assetIdSet = new Set(assetIds); + currentMemory.assets = currentMemory.assets.filter((a: AssetResponseDto) => !assetIdSet.has(a.id)); + }; + + const handleSelectAll = () => { + selectedAssets = new Set(currentMemory.assets); + }; +{#if isMultiSelectionMode} +
+ (selectedAssets = new Set())}> + + + + + + + + + + + + + + + + + + +
+{/if} +
{#if currentMemory} goto(AppRoute.PHOTOS)} forceDark> @@ -268,7 +334,6 @@
-
- +