From 976cf01d58ef6e95a925bab865ae6f4a6b6ab40a Mon Sep 17 00:00:00 2001
From: soohyuniii <myungsoocc@gmail.com>
Date: Thu, 24 Apr 2025 16:36:25 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EC=B1=84=ED=8C=85=20=EB=82=B4=EC=97=AD?=
 =?UTF-8?q?=20=EC=A0=80=EC=9E=A5=ED=95=98=EA=B8=B0=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/header/SubHeader.tsx |  5 +++++
 src/pages/Chat.tsx                  | 12 +++++++++++-
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/components/header/SubHeader.tsx b/src/components/header/SubHeader.tsx
index 124539b..325bc49 100644
--- a/src/components/header/SubHeader.tsx
+++ b/src/components/header/SubHeader.tsx
@@ -24,6 +24,7 @@ const SubHeader = ({
   const isChatPage = pathname === "/chat";
   const isFirstQuestionPage = currentPage === 1;
   const mode = state?.mode;
+  const chatId = state?.id;
 
   const handleGoBack = () => {
     if (isProgressPage && !isFirstQuestionPage) {
@@ -45,6 +46,10 @@ const SubHeader = ({
   const handleCancel = () => setIsLeaveChatModalOpen(false);
 
   const handleConfirm = () => {
+    if (chatId) {
+      sessionStorage.removeItem(`chatMessages_${chatId}`);
+    }
+
     setIsLeaveChatModalOpen(false);
     navigate("/");
   };
diff --git a/src/pages/Chat.tsx b/src/pages/Chat.tsx
index a47b0ef..ce1f32d 100644
--- a/src/pages/Chat.tsx
+++ b/src/pages/Chat.tsx
@@ -20,7 +20,7 @@ interface ChatResponse {
 
 const Chat = () => {
   const { state } = useLocation();
-  const { mbti, mode, id } = state;
+  const { mbti, mode, id = Date.now().toString() } = state;
 
   const [messages, setMessages] = useState<Message[]>([]);
   const [input, setInput] = useState("");
@@ -30,11 +30,21 @@ const Chat = () => {
   const chatTitle = `${mbti}와 대화`;
   const assistantInfo = mbti;
   const assistantImgUrl = pickMbtiImage(assistantInfo);
+  const storageKey = `chatMessages_${id}`;
 
   useEffect(() => {
     bottomRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [messages, isOpen]);
 
+  useEffect(() => {
+    const stored = sessionStorage.getItem(storageKey);
+    if (stored) setMessages(JSON.parse(stored));
+  }, [storageKey]);
+
+  useEffect(() => {
+    sessionStorage.setItem(storageKey, JSON.stringify(messages));
+  }, [messages, storageKey]);
+
   const handleToggleTips = () => {
     const nextAction = !isOpen;