From 8f84da7e2fe917b5ae5ce792897719a872423b03 Mon Sep 17 00:00:00 2001
From: Garret Patti <42485635+garretpatti@users.noreply.github.com>
Date: Sat, 18 Apr 2026 11:18:40 -0400
Subject: [PATCH] add keyboard navigation

---
 src/components/games/GameDetailModal.tsx   | 4 +++-
 src/components/movies/MovieDetailModal.tsx | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/games/GameDetailModal.tsx b/src/components/games/GameDetailModal.tsx
index 5221876..2ebaa17 100644
--- a/src/components/games/GameDetailModal.tsx
+++ b/src/components/games/GameDetailModal.tsx
@@ -122,6 +122,8 @@ export default function GameDetailModal({ game, libraryId, onClose, onPrev, onNe
         if (e.key === 'ArrowRight') { setLightboxIndex((i) => (i! < screenshots.length - 1 ? i! + 1 : i)); return }
         return
       }
+      if (e.key === 'ArrowLeft') { onPrev?.(); return }
+      if (e.key === 'ArrowRight') { onNext?.(); return }
       if (e.key === 'Escape') {
         if (menuOpen) { setMenuOpen(false); return }
         if (confirming) { setConfirming(false); return }
@@ -137,7 +139,7 @@ export default function GameDetailModal({ game, libraryId, onClose, onPrev, onNe
       document.removeEventListener('keydown', handleKey)
       document.body.style.overflow = ''
     }
-  }, [onClose, menuOpen, editingImages, confirming, renaming, showTagPanel, lightboxIndex, screenshots.length])
+  }, [onClose, onPrev, onNext, menuOpen, editingImages, confirming, renaming, showTagPanel, lightboxIndex, screenshots.length])
 
   // Close menu on outside click
   useEffect(() => {
diff --git a/src/components/movies/MovieDetailModal.tsx b/src/components/movies/MovieDetailModal.tsx
index e96ef94..e18c091 100644
--- a/src/components/movies/MovieDetailModal.tsx
+++ b/src/components/movies/MovieDetailModal.tsx
@@ -40,6 +40,8 @@ export default function MovieDetailModal({ movie, libraryId, onClose, onPrev, on
 
   useEffect(() => {
     const handleKey = (e: KeyboardEvent) => {
+      if (e.key === 'ArrowLeft') { onPrev?.(); return }
+      if (e.key === 'ArrowRight') { onNext?.(); return }
       if (e.key === 'Escape') {
         if (menuOpen) { setMenuOpen(false); return }
         if (confirming) { setConfirming(false); return }
@@ -56,7 +58,7 @@ export default function MovieDetailModal({ movie, libraryId, onClose, onPrev, on
       document.removeEventListener('keydown', handleKey)
       document.body.style.overflow = ''
     }
-  }, [onClose, menuOpen, confirming, editing, warnRefresh, renaming, showTagPanel])
+  }, [onClose, onPrev, onNext, menuOpen, confirming, editing, warnRefresh, renaming, showTagPanel])
 
   // Close menu on outside click
   useEffect(() => {