diff --git a/src/pages/home/components/SearchPostList.tsx b/src/pages/home/components/SearchPostList.tsx index f201dbd..dcf7dc8 100644 --- a/src/pages/home/components/SearchPostList.tsx +++ b/src/pages/home/components/SearchPostList.tsx @@ -2,6 +2,7 @@ import { useEffect } from "react"; import { useGetSearchPost, useSearchHistory } from "../../../lib/search"; import { CardItem } from "../../../shared/CardItem"; import type { CardItemProps } from "../../../types/post"; +import useUserStore from "../../../store/useUserStore"; interface SearchPostListProps { query: string; @@ -10,10 +11,11 @@ interface SearchPostListProps { export const SearchPostList = ({ query }: SearchPostListProps) => { const { data: searchData } = useGetSearchPost(query); const history = useSearchHistory(); + const { user } = useUserStore(); + const isLogin = !!user?.accessToken; useEffect(() => { - if (!query) return; - + if (!query || !isLogin) return; history.mutate({ searchWord: query, searchedAt: new Date().toISOString(), diff --git a/src/shared/SystemHeader.tsx b/src/shared/SystemHeader.tsx index 8d41c1e..89a2cee 100644 --- a/src/shared/SystemHeader.tsx +++ b/src/shared/SystemHeader.tsx @@ -23,7 +23,7 @@ export const SystemHeader = () => { const { data } = useGetMyProfile(isLogin); const [searchParams] = useSearchParams(); - const searchQuery = searchParams.get("search") ?? ""; + const [input, setInput] = useState(""); const handleLogout = async () => { try { @@ -49,6 +49,25 @@ export const SystemHeader = () => { } }; + useEffect(() => { + const searchQuery = searchParams.get("search") || ""; + if (input !== searchQuery) { + setInput(searchQuery); + } + }, [searchParams]); + + useEffect(() => { + if (input === "") { + if (searchParams.get("search")) { + navigate("/", { replace: true }); + } + return; + } + if (input !== searchParams.get("search")) { + navigate(`/?search=${input}`, { replace: true }); + } + }, [input, navigate]); + useEffect(() => { const handleClick = (e: MouseEvent) => { if (!modalRef.current?.contains(e.target as Node)) @@ -61,14 +80,6 @@ export const SystemHeader = () => { document.removeEventListener("click", handleClick); }; }, []); - const [input, setInput] = useState(""); - - useEffect(() => { - if (!input) return; - if (input) { - navigate(`/?search=${input}`); - } - }, [input, navigate]); useEffect(() => { if (userModal) { @@ -94,7 +105,7 @@ export const SystemHeader = () => { type="text" placeholder="검색어 또는 태그명 입력" className="w-full px-3 py-2 focus:outline-none outline-none" - value={searchQuery} + value={input} onChange={e => setInput(e.target.value)} />