diff --git a/app/routes/home/index.tsx b/app/routes/home/index.tsx index 1d7e4f5..6e484a8 100644 --- a/app/routes/home/index.tsx +++ b/app/routes/home/index.tsx @@ -6,13 +6,59 @@ import { MatchingTestRequiredError, } from "../matching/api/matching"; import { useAuthStore } from "../../stores/auth-store"; +import { getMyPage } from "../mypage/api/mypage"; +import { tokenStorage } from "../../lib/token"; export default function Home() { const [hasMatch, setHasMatch] = useState(null); - const hasMatchingTest = useAuthStore((s) => s.me?.matchingTestDone); + const me = useAuthStore((s) => s.me); + const setMe = useAuthStore((s) => s.setMe); + const hasTokens = tokenStorage.hasTokens(); + const resolvedHasMatchingTest = + me?.matchingTestDone !== undefined + ? Boolean(me.matchingTestDone) + : hasTokens + ? null + : false; useEffect(() => { - if (hasMatchingTest !== true) return; + if (me?.matchingTestDone !== undefined) return; + if (!hasTokens) return; + + let isMounted = true; + + const fetchMe = async () => { + try { + const result = await getMyPage(); + if (!isMounted) return; + + const name = result.name ?? result.nickname ?? ""; + const roleText = result.nickname ?? result.name ?? ""; + + setMe({ + name, + roleText, + email: result.email, + avatarUrl: result.profileImageUrl ?? undefined, + matchingTestDone: Boolean(result.hasMatchingTest), + }); + } catch (error) { + console.error("Failed to load my page info:", error); + if (isMounted) { + setMe({ matchingTestDone: false }); + } + } + }; + + fetchMe(); + + return () => { + isMounted = false; + }; + }, [hasTokens, me?.matchingTestDone, setMe]); + + useEffect(() => { + if (resolvedHasMatchingTest !== true) return; const checkMatchStatus = async () => { try { @@ -29,13 +75,13 @@ export default function Home() { }; checkMatchStatus(); - }, [hasMatchingTest]); + }, [resolvedHasMatchingTest]); - if (hasMatchingTest === false) { + if (resolvedHasMatchingTest === false) { return ; } - if (hasMatch === null) { + if (resolvedHasMatchingTest === null || hasMatch === null) { return (
diff --git a/app/routes/mypage/likes/likes-content.tsx b/app/routes/mypage/likes/likes-content.tsx index be492cb..fd79414 100644 --- a/app/routes/mypage/likes/likes-content.tsx +++ b/app/routes/mypage/likes/likes-content.tsx @@ -63,6 +63,15 @@ type CampaignLike = { logoUrl?: string | null; }; +const SORT_PARAM_MAP: Record = { + "정렬 필터": "matchingRate", + "매칭률 순": "matchingRate", + "인기 순": "popularity", + "신규 순": "latest", + "금액 순": "reward", + "마감 순": "dDay", +}; + export default function MyPageLikes() { useHideHeader(true); const navigate = useNavigate(); @@ -108,15 +117,6 @@ export default function MyPageLikes() { return list; }, [sortOption, campaignLikesApi]); - const sortParamMap: Record = { - "정렬 필터": "matchingRate", - "매칭률 순": "matchingRate", - "인기 순": "popularity", - "신규 순": "latest", - "금액 순": "reward", - "마감 순": "dDay", - }; - useEffect(() => { let isMounted = true; const fetchScrap = async () => { @@ -127,7 +127,7 @@ export default function MyPageLikes() { { params: { type: activeTab === "brand" ? "brand" : "campaign", - sort: sortParamMap[sortOption] ?? "matchingRate", + sort: SORT_PARAM_MAP[sortOption] ?? "matchingRate", }, }, );