From 479fdb9dbee1a952775e7d569e9e13dea690f90d Mon Sep 17 00:00:00 2001
From: Eric Leroy-Terquem <eric.leroyterquem@beta.gouv.fr>
Date: Tue, 30 Apr 2024 17:22:29 +0200
Subject: [PATCH] feat(gallery): can close gallery when clicking on browser
 back button

---
 app/javascript/controllers/lightbox_controller.ts | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/app/javascript/controllers/lightbox_controller.ts b/app/javascript/controllers/lightbox_controller.ts
index 8d4660d70..49e53ecd0 100644
--- a/app/javascript/controllers/lightbox_controller.ts
+++ b/app/javascript/controllers/lightbox_controller.ts
@@ -4,6 +4,7 @@ import { LightGallery } from 'lightgallery/lightgallery';
 import lgThumbnail from 'lightgallery/plugins/thumbnail';
 import lgZoom from 'lightgallery/plugins/zoom';
 import lgRotate from 'lightgallery/plugins/rotate';
+import lgHash from 'lightgallery/plugins/hash';
 import 'lightgallery/css/lightgallery-bundle.css';
 
 export default class extends Controller {
@@ -11,7 +12,7 @@ export default class extends Controller {
 
   connect(): void {
     const options = {
-      plugins: [lgZoom, lgThumbnail, lgRotate],
+      plugins: [lgZoom, lgThumbnail, lgRotate, lgHash],
       flipVertical: false,
       flipHorizontal: false,
       animateThumb: false,
@@ -21,6 +22,14 @@ export default class extends Controller {
       selector: '.gallery-link'
     };
 
+    const gallery = document.querySelector('.gallery');
+
+    if (gallery != null) {
+      gallery.addEventListener('lgBeforeOpen', () => {
+        window.history.pushState({}, 'Gallery opened');
+      });
+    }
+
     this.lightGallery = lightGallery(this.element as HTMLElement, options);
 
     const downloadIcon = document.querySelector('.lg-download');