mirror of
https://github.com/immich-app/immich
synced 2025-11-14 17:36:12 +00:00
refactor(web): asset interaction (#14662)
* refactor(web): asset interaction * feedback
This commit is contained in:
parent
525840b040
commit
b5022d80d6
21 changed files with 375 additions and 367 deletions
|
|
@ -4,7 +4,6 @@
|
|||
import { dragAndDropFilesStore } from '$lib/stores/drag-and-drop-files.store';
|
||||
import { fileUploadHandler, openFileUploadDialog } from '$lib/utils/file-uploader';
|
||||
import type { AlbumResponseDto, SharedLinkResponseDto, UserResponseDto } from '@immich/sdk';
|
||||
import { createAssetInteractionStore } from '$lib/stores/asset-interaction.store';
|
||||
import { AssetStore } from '$lib/stores/assets.store';
|
||||
import { cancelMultiselect, downloadAlbum } from '$lib/utils/asset-utils';
|
||||
import CircleIconButton from '../elements/buttons/circle-icon-button.svelte';
|
||||
|
|
@ -20,6 +19,7 @@
|
|||
import AlbumSummary from './album-summary.svelte';
|
||||
import { t } from 'svelte-i18n';
|
||||
import { onDestroy } from 'svelte';
|
||||
import { AssetInteraction } from '$lib/stores/asset-interaction.svelte';
|
||||
|
||||
interface Props {
|
||||
sharedLink: SharedLinkResponseDto;
|
||||
|
|
@ -34,8 +34,7 @@
|
|||
let { isViewing: showAssetViewer } = assetViewingStore;
|
||||
|
||||
const assetStore = new AssetStore({ albumId: album.id, order: album.order });
|
||||
const assetInteractionStore = createAssetInteractionStore();
|
||||
const { isMultiSelectState, selectedAssets } = assetInteractionStore;
|
||||
const assetInteraction = new AssetInteraction();
|
||||
|
||||
dragAndDropFilesStore.subscribe((value) => {
|
||||
if (value.isDragging && value.files.length > 0) {
|
||||
|
|
@ -52,8 +51,8 @@
|
|||
use:shortcut={{
|
||||
shortcut: { key: 'Escape' },
|
||||
onShortcut: () => {
|
||||
if (!$showAssetViewer && $isMultiSelectState) {
|
||||
cancelMultiselect(assetInteractionStore);
|
||||
if (!$showAssetViewer && assetInteraction.selectionActive) {
|
||||
cancelMultiselect(assetInteraction);
|
||||
}
|
||||
},
|
||||
}}
|
||||
|
|
@ -61,13 +60,13 @@
|
|||
/>
|
||||
|
||||
<header>
|
||||
{#if $isMultiSelectState}
|
||||
{#if assetInteraction.selectionActive}
|
||||
<AssetSelectControlBar
|
||||
ownerId={user?.id}
|
||||
assets={$selectedAssets}
|
||||
clearSelect={() => assetInteractionStore.clearMultiselect()}
|
||||
assets={assetInteraction.selectedAssets}
|
||||
clearSelect={() => assetInteraction.clearMultiselect()}
|
||||
>
|
||||
<SelectAllAssets {assetStore} {assetInteractionStore} />
|
||||
<SelectAllAssets {assetStore} {assetInteraction} />
|
||||
{#if sharedLink.allowDownload}
|
||||
<DownloadAction filename="{album.albumName}.zip" />
|
||||
{/if}
|
||||
|
|
@ -102,7 +101,7 @@
|
|||
</header>
|
||||
|
||||
<main class="relative h-screen overflow-hidden bg-immich-bg px-6 pt-[var(--navbar-height)] dark:bg-immich-dark-bg">
|
||||
<AssetGrid enableRouting={true} {album} {assetStore} {assetInteractionStore}>
|
||||
<AssetGrid enableRouting={true} {album} {assetStore} {assetInteraction}>
|
||||
<section class="pt-8 md:pt-24">
|
||||
<!-- ALBUM TITLE -->
|
||||
<h1
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue