cjones/immich
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(web): Change the primary asset of a stack (#18913)

Browse Source 
* - Add set primary primary asset button to asset viewer

* - Cleanup
- change AssetAction to contain a StackResponseDto
- Properly update displayed stack at bottom of the asset viewer

* - update the assetStore with the changed stack

* - Cleanup
This commit is contained in:
xCJPECKOVERx
2025-06-08 22:35:41 -04:00
committed by GitHub
parent e0ac588ca8
commit de2115d11e
7 changed files with 53 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/lib/components/asset-viewer/actions/action.ts
+2 -1
View File
@@ -1,6 +1,6 @@
import type { AssetAction } from '$lib/constants';
import type { TimelineAsset } from '$lib/managers/timeline-manager/types';
import type { AlbumResponseDto } from '@immich/sdk';
import type { AlbumResponseDto, StackResponseDto } from '@immich/sdk';
type ActionMap = {
[AssetAction.ARCHIVE]: { asset: TimelineAsset };
@@ -14,6 +14,7 @@ type ActionMap = {
[AssetAction.ADD_TO_ALBUM]: { asset: TimelineAsset; album: AlbumResponseDto };
[AssetAction.UNSTACK]: { assets: TimelineAsset[] };
[AssetAction.KEEP_THIS_DELETE_OTHERS]: { asset: TimelineAsset };
[AssetAction.SET_STACK_PRIMARY_ASSET]: { stack: StackResponseDto };
[AssetAction.SET_VISIBILITY_LOCKED]: { asset: TimelineAsset };
[AssetAction.SET_VISIBILITY_TIMELINE]: { asset: TimelineAsset };
};
web/src/lib/components/asset-viewer/actions/set-stack-primary-asset.svelte
+26
View File
@@ -0,0 +1,26 @@
<script lang="ts">
import MenuOption from '$lib/components/shared-components/context-menu/menu-option.svelte';
import { AssetAction } from '$lib/constants';
import { updateStack, type AssetResponseDto, type StackResponseDto } from '@immich/sdk';
import { mdiImageCheckOutline } from '@mdi/js';
import { t } from 'svelte-i18n';
import type { OnAction } from './action';
interface Props {
stack: StackResponseDto;
asset: AssetResponseDto;
onAction: OnAction;
}
let { stack, asset, onAction }: Props = $props();
const handleSetPrimaryAsset = async () => {
const updatedStack = await updateStack({ id: stack.id, stackUpdateDto: { primaryAssetId: asset.id } });
if (updatedStack) {
onAction({ type: AssetAction.SET_STACK_PRIMARY_ASSET, stack: updatedStack });
}
};
</script>
<MenuOption icon={mdiImageCheckOutline} onClick={handleSetPrimaryAsset} text={$t('set_stack_primary_asset')} />