Skip to content

Commit

Permalink
fix(SearchResults): 검색 결과 페이지에서 검색 모달 상태 관리
Browse files Browse the repository at this point in the history
  • Loading branch information
joojjang committed Nov 20, 2024
1 parent 054b8a4 commit 89dcfaf
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 12 deletions.
4 changes: 4 additions & 0 deletions src/components/layouts/SearchBar/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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(
Expand All @@ -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}`);
};
Expand Down
24 changes: 12 additions & 12 deletions src/pages/SearchResults/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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();
Expand All @@ -36,10 +46,10 @@ const SearchResultsContent = () => {

const { isModalOpen, setIsModalOpen } = useSearchModalStore();

// 검색 결과로 이동 직후 검색 모달 닫음
// 검색어 바꿔 새로 검색 시 검색 모달 닫음
useEffect(() => {
setIsModalOpen(false);
}, []);
}, [searchQuery]);

const goBack = () => {
navigate(-1);
Expand Down Expand Up @@ -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`
Expand Down

0 comments on commit 89dcfaf

Please sign in to comment.