From beabcc094fb608a5a4e0eb06ee8dbcb112b21509 Mon Sep 17 00:00:00 2001
From: caadiq <caadiq@gmail.com>
Date: Wed, 21 Jan 2026 12:17:24 +0900
Subject: [PATCH] =?UTF-8?q?=EB=9D=BC=EC=9D=B4=ED=8A=B8=EB=B0=95=EC=8A=A4?=
 =?UTF-8?q?=20=EB=8B=AB=EA=B8=B0=20=EC=8B=9C=20=EC=9D=B4=EC=A0=84=20?=
 =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EB=A1=9C=20=EC=9D=B4=EB=8F=99?=
 =?UTF-8?q?=ED=95=98=EB=8A=94=20=EB=B2=84=EA=B7=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- ref를 사용해 히스토리 push 상태 추적
- X 버튼 클릭 시 히스토리가 push된 경우에만 history.back() 호출
- 하드웨어 백버튼과 X 버튼 닫기 동작 분리

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 .../src/pages/mobile/public/ScheduleDetail.jsx  | 17 ++++++++++++++---
 .../pc/public/schedule-sections/XSection.jsx    | 17 ++++++++++++++---
 2 files changed, 28 insertions(+), 6 deletions(-)

diff --git a/frontend/src/pages/mobile/public/ScheduleDetail.jsx b/frontend/src/pages/mobile/public/ScheduleDetail.jsx
index 6df9243..ab508c9 100644
--- a/frontend/src/pages/mobile/public/ScheduleDetail.jsx
+++ b/frontend/src/pages/mobile/public/ScheduleDetail.jsx
@@ -292,11 +292,21 @@ function XSection({ schedule }) {
     // 라이트박스 상태
     const [lightboxOpen, setLightboxOpen] = useState(false);
     const [lightboxIndex, setLightboxIndex] = useState(0);
+    const historyPushedRef = useRef(false);
 
     const openLightbox = (index) => {
         setLightboxIndex(index);
         setLightboxOpen(true);
         window.history.pushState({ lightbox: true }, '');
+        historyPushedRef.current = true;
+    };
+
+    const closeLightbox = () => {
+        setLightboxOpen(false);
+        if (historyPushedRef.current) {
+            historyPushedRef.current = false;
+            window.history.back();
+        }
     };
 
     const goToPrev = () => {
@@ -323,10 +333,11 @@ function XSection({ schedule }) {
         };
     }, [lightboxOpen]);
 
-    // 뒤로가기 처리
+    // 뒤로가기 처리 (하드웨어 백버튼)
     useEffect(() => {
         const handlePopState = () => {
             if (lightboxOpen) {
+                historyPushedRef.current = false;
                 setLightboxOpen(false);
             }
         };
@@ -457,12 +468,12 @@ function XSection({ schedule }) {
                         animate={{ opacity: 1 }}
                         exit={{ opacity: 0 }}
                         className="fixed inset-0 bg-black z-50 flex items-center justify-center"
-                        onClick={() => window.history.back()}
+                        onClick={closeLightbox}
                     >
                         {/* 닫기 버튼 */}
                         <button
                             className="absolute top-4 right-4 p-2 text-white/70 z-10"
-                            onClick={() => window.history.back()}
+                            onClick={closeLightbox}
                         >
                             <X size={28} />
                         </button>
diff --git a/frontend/src/pages/pc/public/schedule-sections/XSection.jsx b/frontend/src/pages/pc/public/schedule-sections/XSection.jsx
index 7da1278..a56f334 100644
--- a/frontend/src/pages/pc/public/schedule-sections/XSection.jsx
+++ b/frontend/src/pages/pc/public/schedule-sections/XSection.jsx
@@ -1,4 +1,4 @@
-import { useState, useEffect, useCallback } from 'react';
+import { useState, useEffect, useCallback, useRef } from 'react';
 import { motion } from 'framer-motion';
 import Linkify from 'react-linkify';
 import { decodeHtmlEntities } from './utils';
@@ -15,17 +15,28 @@ function XSection({ schedule }) {
     // 라이트박스 상태
     const [lightboxOpen, setLightboxOpen] = useState(false);
     const [lightboxIndex, setLightboxIndex] = useState(0);
+    const historyPushedRef = useRef(false);
 
     const openLightbox = useCallback((index) => {
         setLightboxIndex(index);
         setLightboxOpen(true);
         window.history.pushState({ lightbox: true }, '');
+        historyPushedRef.current = true;
     }, []);
 
-    // 뒤로가기 처리
+    const closeLightbox = useCallback(() => {
+        setLightboxOpen(false);
+        if (historyPushedRef.current) {
+            historyPushedRef.current = false;
+            window.history.back();
+        }
+    }, []);
+
+    // 뒤로가기 처리 (하드웨어 백버튼)
     useEffect(() => {
         const handlePopState = () => {
             if (lightboxOpen) {
+                historyPushedRef.current = false;
                 setLightboxOpen(false);
             }
         };
@@ -156,7 +167,7 @@ function XSection({ schedule }) {
                 images={schedule.imageUrls || []}
                 currentIndex={lightboxIndex}
                 isOpen={lightboxOpen}
-                onClose={() => window.history.back()}
+                onClose={closeLightbox}
                 onIndexChange={setLightboxIndex}
             />
         </div>