From 3eec2515969555468712affba3d693ab7dd8f019 Mon Sep 17 00:00:00 2001
From: "immich-push-o-matic[bot]"
 <179150890+immich-push-o-matic[bot]@users.noreply.github.com>
Date: Tue, 6 Oct 2026 11:37:07 +0000
Subject: [PATCH] fix(web): don't swallow Escape when person name editor is
 closed (#32161)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

fix(web): don't swallow Escape when person name editor is closed (#32123)


(cherry picked from commit 3a5fc38f85df38d73d5c3a21ab4a06d6090eb248)

Co-authored-by: Adi Čaušević <31798801+ChocolateChipKookie@users.noreply.github.com>
Co-authored-by: Daniel Dietzler <36593685+danieldietzler@users.noreply.github.com>
---
 web/src/lib/actions/click-outside.ts                     | 9 ++++++---
 .../[[photos=photos]]/[[assetId=id]]/+page.svelte        | 2 +-
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/web/src/lib/actions/click-outside.ts b/web/src/lib/actions/click-outside.ts
index af4ec8695..292e28e71 100644
--- a/web/src/lib/actions/click-outside.ts
+++ b/web/src/lib/actions/click-outside.ts
@@ -12,10 +12,9 @@ interface Options {
  * @param options Object containing onOutclick and onEscape functions
  * @returns
  */
-export function clickOutside(node: HTMLElement, options: Options = {}): ActionReturn {
-  const { onOutclick, onEscape } = options;
-
+export function clickOutside(node: HTMLElement, options: Options = {}): ActionReturn<Options> {
   const handleClick = (event: MouseEvent) => {
+    const { onOutclick } = options;
     const targetNode = event.target as Node | null;
     if (node.contains(targetNode)) {
       return;
@@ -25,6 +24,7 @@ export function clickOutside(node: HTMLElement, options: Options = {}): ActionRe
   };
 
   const handleKey = (event: KeyboardEvent) => {
+    const { onEscape } = options;
     if (!matchesShortcut(event, { key: 'Escape' })) {
       return;
     }
@@ -39,6 +39,9 @@ export function clickOutside(node: HTMLElement, options: Options = {}): ActionRe
   node.addEventListener('keydown', handleKey, { capture: false });
 
   return {
+    update(newOptions: Options) {
+      options = newOptions;
+    },
     destroy() {
       document.removeEventListener('mousedown', handleClick, false);
       node.removeEventListener('keydown', handleKey, false);
diff --git a/web/src/routes/(user)/people/[personId]/[[photos=photos]]/[[assetId=id]]/+page.svelte b/web/src/routes/(user)/people/[personId]/[[photos=photos]]/[[assetId=id]]/+page.svelte
index 347f4be04..ab749a45a 100644
--- a/web/src/routes/(user)/people/[personId]/[[photos=photos]]/[[assetId=id]]/+page.svelte
+++ b/web/src/routes/(user)/people/[personId]/[[photos=photos]]/[[assetId=id]]/+page.svelte
@@ -362,7 +362,7 @@
           class="relative w-fit p-4 pt-12 sm:px-6"
           use:clickOutside={{
             onOutclick: handleCancelEditName,
-            onEscape: handleCancelEditName,
+            onEscape: isEditingName ? handleCancelEditName : undefined,
           }}
           use:listNavigation={suggestionContainer}
         >