From 89dcfafaaaaebba09de549b0af41a3da99a918da Mon Sep 17 00:00:00 2001
From: joojjang <itchu999@naver.com>
Date: Wed, 20 Nov 2024 11:45:15 +0900
Subject: [PATCH] =?UTF-8?q?fix(SearchResults):=20=EA=B2=80=EC=83=89=20?=
 =?UTF-8?q?=EA=B2=B0=EA=B3=BC=20=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90?=
 =?UTF-8?q?=EC=84=9C=20=EA=B2=80=EC=83=89=20=EB=AA=A8=EB=8B=AC=20=EC=83=81?=
 =?UTF-8?q?=ED=83=9C=20=EA=B4=80=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/layouts/SearchBar/index.tsx |  4 ++++
 src/pages/SearchResults/index.tsx          | 24 +++++++++++-----------
 2 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/src/components/layouts/SearchBar/index.tsx b/src/components/layouts/SearchBar/index.tsx
index 7ed75ea..f065bf0 100644
--- a/src/components/layouts/SearchBar/index.tsx
+++ b/src/components/layouts/SearchBar/index.tsx
@@ -56,6 +56,8 @@ const SearchBar = ({ includeBack = true, includeFavorite = false, goBack }: Sear
 
   const activeEnter = (data: { searchWord: string }) => {
     const { searchWord } = data;
+
+    // 검색 기록 업데이트
     const storedData = localStorage.getItem(SEARCH_ARRAY_KEY);
     let searchArray = storedData ? JSON.parse(storedData) : [];
     const existingIndex = searchArray.findIndex(
@@ -73,6 +75,8 @@ const SearchBar = ({ includeBack = true, includeFavorite = false, goBack }: Sear
     }
 
     localStorage.setItem(SEARCH_ARRAY_KEY, JSON.stringify(searchArray));
+
+    // 검색 실행
     setSearchParams({ query: searchWord });
     navigate(`/${RouterPath.results}?query=${searchWord}`);
   };
diff --git a/src/pages/SearchResults/index.tsx b/src/pages/SearchResults/index.tsx
index 11d55eb..007716e 100644
--- a/src/pages/SearchResults/index.tsx
+++ b/src/pages/SearchResults/index.tsx
@@ -16,6 +16,16 @@ import ArtistContents from './components/ArtistContents';
 import HorizontalFrame from './components/HorizontalFrame';
 import MoreButton from './components/MoreButton';
 
+const SearchResults = () => {
+  return (
+    <ErrorBoundary fallback={<div>Error Status</div>}>
+      <Suspense fallback={<Loader />}>
+        <SearchResultsContent />
+      </Suspense>
+    </ErrorBoundary>
+  );
+};
+
 const SearchResultsContent = () => {
   const [selectedTab, setSelectedTab] = useState('전체');
   const [searchParams] = useSearchParams();
@@ -36,10 +46,10 @@ const SearchResultsContent = () => {
 
   const { isModalOpen, setIsModalOpen } = useSearchModalStore();
 
-  // 검색 결과로 이동 직후 검색 모달 닫음
+  // 검색어 바꿔 새로 검색 시 검색 모달 닫음
   useEffect(() => {
     setIsModalOpen(false);
-  }, []);
+  }, [searchQuery]);
 
   const goBack = () => {
     navigate(-1);
@@ -94,16 +104,6 @@ const SearchResultsContent = () => {
   );
 };
 
-const SearchResults = () => {
-  return (
-    <ErrorBoundary fallback={<div>Error Status</div>}>
-      <Suspense fallback={<Loader />}>
-        <SearchResultsContent />
-      </Suspense>
-    </ErrorBoundary>
-  );
-};
-
 export default SearchResults;
 
 const PageContainer = styled.div`