Lightbox keybinds (#928)

* Add mousetrap-pause
* Disable keybinds while lightbox open

ui/v2.5/src/components/Images/ImageList.tsx

@@ -53,6 +53,18 @@ const ImageWall: React.FC<IImageWallProps> = ({ images }) => {
   // FsLightbox doesn't update unless the key updates
   const key = images.map((i) => i.id).join(",");
 
+  function onLightboxOpen() {
+    // disable mousetrap
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (Mousetrap as any).pause();
+  }
+
+  function onLightboxClose() {
+    // re-enable mousetrap
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (Mousetrap as any).unpause();
+  }
+
   return (
     <div className="gallery">
       <div className="flexbin">{thumbs}</div>
@@ -61,6 +73,8 @@ const ImageWall: React.FC<IImageWallProps> = ({ images }) => {
         toggler={lightboxToggle}
         sources={photos}
         key={key}
+        onOpen={onLightboxOpen}
+        onClose={onLightboxClose}
       />
     </div>
   );