diff --git a/web/src/lib/components/asset-viewer/actions/action.ts b/web/src/lib/components/asset-viewer/actions/action.ts
index 446a004cbb..680dced7ca 100644
--- a/web/src/lib/components/asset-viewer/actions/action.ts
+++ b/web/src/lib/components/asset-viewer/actions/action.ts
@@ -1,6 +1,6 @@
import type { AssetAction } from '$lib/constants';
import type { TimelineAsset } from '$lib/managers/timeline-manager/types';
-import type { AlbumResponseDto, AssetResponseDto, StackResponseDto } from '@immich/sdk';
+import type { AlbumResponseDto, AssetResponseDto, PersonResponseDto, StackResponseDto } from '@immich/sdk';
type ActionMap = {
[AssetAction.ARCHIVE]: { asset: TimelineAsset };
@@ -18,6 +18,7 @@ type ActionMap = {
[AssetAction.REMOVE_ASSET_FROM_STACK]: { stack: StackResponseDto | null; asset: AssetResponseDto };
[AssetAction.SET_VISIBILITY_LOCKED]: { asset: TimelineAsset };
[AssetAction.SET_VISIBILITY_TIMELINE]: { asset: TimelineAsset };
+ [AssetAction.SET_PERSON_FEATURED_PHOTO]: { asset: AssetResponseDto; person: PersonResponseDto };
};
export type Action = {
diff --git a/web/src/lib/components/asset-viewer/actions/set-person-featured-action.svelte b/web/src/lib/components/asset-viewer/actions/set-person-featured-action.svelte
index 70e1c4f1ba..de94c46dfc 100644
--- a/web/src/lib/components/asset-viewer/actions/set-person-featured-action.svelte
+++ b/web/src/lib/components/asset-viewer/actions/set-person-featured-action.svelte
@@ -4,21 +4,36 @@
notificationController,
NotificationType,
} from '$lib/components/shared-components/notification/notification';
+ import { AssetAction } from '$lib/constants';
import { handleError } from '$lib/utils/handle-error';
import { updatePerson, type AssetResponseDto, type PersonResponseDto } from '@immich/sdk';
import { mdiFaceManProfile } from '@mdi/js';
import { t } from 'svelte-i18n';
+ import type { OnAction } from './action';
interface Props {
asset: AssetResponseDto;
person: PersonResponseDto;
+ onAction?: OnAction;
}
- let { asset, person }: Props = $props();
+ let { asset, person, onAction }: Props = $props();
const handleSelectFeaturePhoto = async () => {
try {
- await updatePerson({ id: person.id, personUpdateDto: { featureFaceAssetId: asset.id } });
+ const updatedPerson = await updatePerson({
+ id: person.id,
+ personUpdateDto: { featureFaceAssetId: asset.id },
+ });
+
+ person = { ...person, ...updatedPerson };
+
+ onAction?.({
+ type: AssetAction.SET_PERSON_FEATURED_PHOTO,
+ asset,
+ person,
+ });
+
notificationController.show({ message: $t('feature_photo_updated'), type: NotificationType.Info });
} catch (error) {
handleError(error, $t('errors.unable_to_set_feature_photo'));
diff --git a/web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte b/web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte
index dd197f3a90..a22fbf2366 100644
--- a/web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte
+++ b/web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte
@@ -208,7 +208,7 @@
{/if}
{#if person}
-
+
{/if}
{#if asset.type === AssetTypeEnum.Image && !isLocked}
diff --git a/web/src/lib/components/asset-viewer/asset-viewer.svelte b/web/src/lib/components/asset-viewer/asset-viewer.svelte
index 0737031635..5484cd2c08 100644
--- a/web/src/lib/components/asset-viewer/asset-viewer.svelte
+++ b/web/src/lib/components/asset-viewer/asset-viewer.svelte
@@ -22,6 +22,7 @@
import {
AssetJobName,
AssetTypeEnum,
+ getAssetInfo,
getAllAlbums,
getStack,
runAssetJobs,
@@ -339,6 +340,11 @@
stack = action.stack;
break;
}
+ case AssetAction.SET_PERSON_FEATURED_PHOTO: {
+ const assetInfo = await getAssetInfo({ id: asset.id });
+ asset = { ...asset, people: assetInfo.people };
+ break;
+ }
case AssetAction.KEEP_THIS_DELETE_OTHERS:
case AssetAction.UNSTACK: {
closeViewer();
diff --git a/web/src/lib/constants.ts b/web/src/lib/constants.ts
index a4cdb656b4..da638bb41d 100644
--- a/web/src/lib/constants.ts
+++ b/web/src/lib/constants.ts
@@ -14,6 +14,7 @@ export enum AssetAction {
REMOVE_ASSET_FROM_STACK = 'remove-asset-from-stack',
SET_VISIBILITY_LOCKED = 'set-visibility-locked',
SET_VISIBILITY_TIMELINE = 'set-visibility-timeline',
+ SET_PERSON_FEATURED_PHOTO = 'set-person-featured-photo',
}
export enum AppRoute {