From 34c2992521fcb4a495398f27f6044d696b4d17c3 Mon Sep 17 00:00:00 2001
From: Paul Nothaft <53005142+the-luap@users.noreply.github.com>
Date: Wed, 29 Jul 2026 10:52:54 +0200
Subject: [PATCH] fix(gallery): don't close the lightbox when clicking beside
 the photo (#883) (#890)

Clicking the black bars around the image (a missed arrow click) closed
the lightbox and dropped the guest back into the grid. The lightbox now
only closes via the X button or Escape, matching what gallery guests
expect while paging through photos.

Co-authored-by: Paul Nothaft <paul@MacStudio-von-Paul.local>
---
 frontend/src/components/gallery/PhotoLightbox.tsx | 9 ---------
 1 file changed, 9 deletions(-)

diff --git a/frontend/src/components/gallery/PhotoLightbox.tsx b/frontend/src/components/gallery/PhotoLightbox.tsx
index 56d62400..77735202 100644
--- a/frontend/src/components/gallery/PhotoLightbox.tsx
+++ b/frontend/src/components/gallery/PhotoLightbox.tsx
@@ -407,13 +407,6 @@ export const PhotoLightbox: React.FC<PhotoLightboxProps> = ({
     setIsDragging(false);
   };
 
-  const handleImageClick = (e: React.MouseEvent) => {
-    // Only close if clicking the background, not the image
-    if (e.target === e.currentTarget) {
-      onClose();
-    }
-  };
-
   // Touch event handlers: pinch-to-zoom (2 fingers) + single-finger
   // carousel-style swipe nav. Swipe is suppressed while zoomed in so the
   // user can pan instead. The carousel is also disabled mid-animation.
@@ -860,7 +853,6 @@ export const PhotoLightbox: React.FC<PhotoLightboxProps> = ({
               key={slideKey(photo, slot)}
               className="h-full flex items-center justify-center"
               style={{ flex: '0 0 33.3333%' }}
-              onClick={handleImageClick}
             >
               <AuthenticatedImage
                 // Same preview-prefer-with-fallback logic as the
@@ -915,7 +907,6 @@ export const PhotoLightbox: React.FC<PhotoLightboxProps> = ({
           <div
             ref={trackContainerRef}
             className="absolute top-0 left-0 bottom-0 overflow-hidden z-0"
-            onClick={isVideoCurrent ? undefined : handleImageClick}
             onMouseDown={isVideoCurrent ? undefined : handleMouseDown}
             onMouseMove={isVideoCurrent ? undefined : handleMouseMove}
             onMouseUp={isVideoCurrent ? undefined : handleMouseUp}