diff --git a/frontend/src/static/js/components/media-viewer/ImageViewer.js b/frontend/src/static/js/components/media-viewer/ImageViewer.js
index fa87ed5..a806ca5 100755
--- a/frontend/src/static/js/components/media-viewer/ImageViewer.js
+++ b/frontend/src/static/js/components/media-viewer/ImageViewer.js
@@ -52,7 +52,7 @@ export default function ImageViewer() {
 
   useEffect(() => {
     if (!isModalOpen) return;
-    
+
     document.addEventListener('keydown', handleKeyDown);
 
     return () => {
@@ -61,13 +61,13 @@ export default function ImageViewer() {
   }, [isModalOpen, slideshowItems]);
 
   const handleKeyDown = (event) => {
-    if (event.key === 'ArrowRight') {
-      handleNext();
-    } else if (event.key === 'ArrowLeft') {
-      handlePrevious();
-    }
+    if (event.key === 'ArrowRight') handleNext();
+    if (event.key === 'ArrowLeft') handlePrevious();
+    if (event.key === 'Escape') onClose();
   };
 
+  const onClose=()=>setIsModalOpen(false)
+
   const handleNext = () => {
     setCurrentIndex((prevIndex) => (prevIndex + 1) % slideshowItems.length);
   };