From c278bb0e5ba05571e38ba80ff2b21a3e35720465 Mon Sep 17 00:00:00 2001
From: Daniel Dietzler <36593685+danieldietzler@users.noreply.github.com>
Date: Thu, 22 May 2025 14:48:07 +0200
Subject: [PATCH] fix: avatar selection z-index issues (#18425)
---
.../navigation-bar/account-info-panel.svelte | 5 ++++-
.../shared-components/navigation-bar/navigation-bar.svelte | 7 +++++--
2 files changed, 9 insertions(+), 3 deletions(-)
diff --git a/web/src/lib/components/shared-components/navigation-bar/account-info-panel.svelte b/web/src/lib/components/shared-components/navigation-bar/account-info-panel.svelte
index f259f493ca..22b74767d5 100644
--- a/web/src/lib/components/shared-components/navigation-bar/account-info-panel.svelte
+++ b/web/src/lib/components/shared-components/navigation-bar/account-info-panel.svelte
@@ -41,7 +41,10 @@
class="border"
size="12"
padding="2"
- onclick={() => modalManager.show(AvatarEditModal, {})}
+ onclick={async () => {
+ onClose();
+ await modalManager.show(AvatarEditModal, {});
+ }}
/>
</div>
</div>
diff --git a/web/src/lib/components/shared-components/navigation-bar/navigation-bar.svelte b/web/src/lib/components/shared-components/navigation-bar/navigation-bar.svelte
index 582270b1af..f0e140c8c1 100644
--- a/web/src/lib/components/shared-components/navigation-bar/navigation-bar.svelte
+++ b/web/src/lib/components/shared-components/navigation-bar/navigation-bar.svelte
@@ -5,6 +5,7 @@
<script lang="ts">
import { page } from '$app/state';
import { clickOutside } from '$lib/actions/click-outside';
+ import CastButton from '$lib/cast/cast-button.svelte';
import SkipLink from '$lib/components/elements/buttons/skip-link.svelte';
import ImmichLogo from '$lib/components/shared-components/immich-logo.svelte';
import NotificationPanel from '$lib/components/shared-components/navigation-bar/notification-panel.svelte';
@@ -27,7 +28,6 @@
import ThemeButton from '../theme-button.svelte';
import UserAvatar from '../user-avatar.svelte';
import AccountInfoPanel from './account-info-panel.svelte';
- import CastButton from '$lib/cast/cast-button.svelte';
interface Props {
showUploadButton?: boolean;
@@ -183,7 +183,10 @@
</button>
{#if shouldShowAccountInfoPanel}
- <AccountInfoPanel onLogout={() => authManager.logout()} />
+ <AccountInfoPanel
+ onLogout={() => authManager.logout()}
+ onClose={() => (shouldShowAccountInfoPanel = false)}
+ />
{/if}
</div>
</section>