immich-app/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-12-20 09:15:35 +03:00
Code Issues Packages Projects Releases 18 Wiki Activity

fix(web): select all button displays incorrectly (#17305)

Browse Source 
* fix(web): select all show incorrectly

* fix: lint

---------

Co-authored-by: Alex Tran <alex.tran1502@gmail.com>
This commit is contained in:
Daimolean
2025-04-02 03:00:48 +08:00
committed by GitHub
parent 946507231d
commit e4b0c00885
3 changed files with 39 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
web/src/lib/components/photos-page/asset-date-group.svelte
View File

@@ -1,6 +1,12 @@
<script lang="ts">
import Icon from '$lib/components/elements/icon.svelte';
import { AssetBucket, assetSnapshot, assetsSnapshot } from '$lib/stores/assets-store.svelte';
import {
type AssetStore,
type AssetBucket,
assetSnapshot,
assetsSnapshot,
isSelectingAllAssets,
} from '$lib/stores/assets-store.svelte';
import { navigate } from '$lib/utils/navigation';
import { getDateLocaleString } from '$lib/utils/timeline-util';
import type { AssetResponseDto } from '@immich/sdk';
@@ -22,6 +28,7 @@
withStacked: boolean;
showArchiveIcon: boolean;
bucket: AssetBucket;
assetStore: AssetStore;
assetInteraction: AssetInteraction;
onSelect: ({ title, assets }: { title: string; assets: AssetResponseDto[] }) => void;
@@ -36,6 +43,7 @@
showArchiveIcon,
bucket = $bindable(),
assetInteraction,
assetStore,
onSelect,
onSelectAssets,
onSelectAssetCandidates,
@@ -46,9 +54,9 @@
const transitionDuration = $derived.by(() => (bucket.store.suspendTransitions && !$isUploading ? 0 : 150));
const scaleDuration = $derived(transitionDuration === 0 ? 0 : transitionDuration + 100);
const onClick = (assets: AssetResponseDto[], groupTitle: string, asset: AssetResponseDto) => {
const onClick = (assetStore: AssetStore, assets: AssetResponseDto[], groupTitle: string, asset: AssetResponseDto) => {
if (isSelectionMode || assetInteraction.selectionActive) {
assetSelectHandler(asset, assets, groupTitle);
assetSelectHandler(assetStore, asset, assets, groupTitle);
return;
}
void navigate({ targetRoute: 'current', assetId: asset.id });
@@ -56,7 +64,12 @@
const handleSelectGroup = (title: string, assets: AssetResponseDto[]) => onSelect({ title, assets });
const assetSelectHandler = (asset: AssetResponseDto, assetsInDateGroup: AssetResponseDto[], groupTitle: string) => {
const assetSelectHandler = (
assetStore: AssetStore,
asset: AssetResponseDto,
assetsInDateGroup: AssetResponseDto[],
groupTitle: string,
) => {
onSelectAssets(asset);
// Check if all assets are selected in a group to toggle the group selection's icon
@@ -70,6 +83,12 @@
} else {
assetInteraction.removeGroupFromMultiselectGroup(groupTitle);
}
if (assetStore.getAssets().length == assetInteraction.selectedAssets.length) {
isSelectingAllAssets.set(true);
} else {
isSelectingAllAssets.set(false);
}
};
const assetMouseEventHandler = (groupTitle: string, asset: AssetResponseDto | null) => {
@@ -164,8 +183,8 @@
{asset}
{groupIndex}
focussed={assetInteraction.isFocussedAsset(asset.id)}
onClick={(asset) => onClick(dateGroup.getAssets(), dateGroup.groupTitle, asset)}
onSelect={(asset) => assetSelectHandler(asset, dateGroup.getAssets(), dateGroup.groupTitle)}
onClick={(asset) => onClick(assetStore, dateGroup.getAssets(), dateGroup.groupTitle, asset)}
onSelect={(asset) => assetSelectHandler(assetStore, asset, dateGroup.getAssets(), dateGroup.groupTitle)}
onMouseEvent={() => assetMouseEventHandler(dateGroup.groupTitle, assetSnapshot(asset))}
selected={assetInteraction.hasSelectedAsset(asset.id) || dateGroup.bucket.store.albumAssets.has(asset.id)}
selectionCandidate={assetInteraction.hasSelectionCandidate(asset.id)}