chore(web): minor UX improvements of "view asset owners" feature (#24319)

* feat: toggle in options modal

* feat(i18n): add labels to display who uploaded each asset and show asset owners

* feat: migrate asset owner settings to TimelineManager and update AlbumOptionsModal

* Revert "feat(i18n): add labels to display who uploaded each asset and show asset owners"

This reverts commit cf8f4eb135.

* fix: simplify AlbumOptionsModal invocation and update aria-label for asset owners

* feat(i18n): add label for viewing asset owners in the interface

* feat: add tests for showAssetOwners functionality in TimelineManager

* chore: move asset owner visibility toggle to kebabu menu
This commit is contained in:
idubnori
2025-12-02 01:25:12 +09:00
committed by GitHub
parent ab35afd3b1
commit d8ca210641
3 changed files with 63 additions and 13 deletions
@@ -66,6 +66,7 @@
} from '@immich/sdk';
import { Button, Icon, IconButton, modalManager, toastManager } from '@immich/ui';
import {
mdiAccountEye,
mdiAccountEyeOutline,
mdiArrowLeft,
mdiCogOutline,
@@ -101,7 +102,9 @@
let isCreatingSharedAlbum = $state(false);
let isShowActivity = $state(false);
let albumOrder: AssetOrder | undefined = $state(data.album.order);
let showAlbumUsers = $state(false);
let timelineManager = $state<TimelineManager>() as TimelineManager;
let showAlbumUsers = $derived(timelineManager?.showAssetOwners ?? false);
const assetInteraction = new AssetInteraction();
const timelineInteraction = new AssetInteraction();
@@ -303,7 +306,6 @@
}
});
let timelineManager = $state<TimelineManager>() as TimelineManager;
const options = $derived.by(() => {
if (viewMode === AlbumPageViewMode.SELECT_ASSETS) {
return {
@@ -597,17 +599,6 @@
{#snippet trailing()}
<CastButton />
{#if containsEditors}
<IconButton
variant="ghost"
shape="round"
color="secondary"
aria-label={$t('view_asset_owners')}
icon={mdiAccountEyeOutline}
onclick={() => (showAlbumUsers = !showAlbumUsers)}
/>
{/if}
{#if isEditor}
<IconButton
variant="ghost"
@@ -668,6 +659,13 @@
color="secondary"
offset={{ x: 175, y: 25 }}
>
{#if containsEditors}
<MenuOption
icon={showAlbumUsers ? mdiAccountEye : mdiAccountEyeOutline}
text={$t('view_asset_owners')}
onClick={() => timelineManager.toggleShowAssetOwners()}
/>
{/if}
{#if album.assetCount > 0}
<MenuOption
icon={mdiImageOutline}