diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx index bf70bfa..12f38c9 100644 --- a/src/pages/Home.jsx +++ b/src/pages/Home.jsx @@ -23,6 +23,7 @@ const Home = () => { const [userInfo, setUserInfo] = useState({}); const [userLoading, setUserLoading] = useState(true); const [userError, setUserError] = useState(null); + const [prevTier, setPrevTier] = useState(null); const [loading, setLoading] = useState(true); const [user, setUser] = useState(null); @@ -38,6 +39,15 @@ const Home = () => { const navigate = useNavigate(); const [client, setClient] = useState(null); // WebSocket 클라이언트 상태 + // 티어 아이콘 매핑 + const tierEmojis = { + NONE: "❌미획득", + SEED: "🫘씨앗", + SPROUT: "🌱새싹", + FLOWER: "🌺꽃", + FRUIT: "🍎열매", + TREE: "🌳나무", + }; // 사용자 정보 불러오기 useEffect(() => { @@ -56,6 +66,33 @@ const Home = () => { fetchUserInfo(); }, []); +// 업적 기록을 가져오기 +const fetchTierInfo = async () => { + try { + const response = await fetch("/api/user/tierinfo"); + const data = await response.json(); + + // "2025년 겨울 시즌" 데이터 필터링 + const winterTier = data.find(item => item.year === "2025" && item.season === "winter"); + + if (winterTier) { + console.log("겨울 시즌 티어:", winterTier.tier); + setPrevTier(winterTier.tier); // 상태로 저장하여 UI에 반영 + } else { + console.log("겨울 시즌 데이터 없음"); + setPrevTier("미획득"); + } + } catch (error) { + console.error("Tier 정보를 가져오는 중 오류 발생:", error); + } +}; + +// useEffect를 사용하여 API 호출 +useEffect(() => { + fetchTierInfo(); +}, []); + + const toggleModal = async () => { // 읽은 알림들을 필터링하여 제거 setNotifications(prev => prev.filter(noti => !noti.read)); @@ -496,10 +533,14 @@ useEffect(() => { {seasonData[season].restrictedContributionsCount} - - - 미획득 - + {season === "winter" ? ( + + {tierEmojis[prevTier] || tierEmojis['NONE']} + + ) : ( + + {tierEmojis['NONE']} + )} 0 ? 'max-streak-badge' : 'zero-value'}`}> diff --git a/src/pages/Profile.jsx b/src/pages/Profile.jsx index 07d2218..4ed162f 100644 --- a/src/pages/Profile.jsx +++ b/src/pages/Profile.jsx @@ -11,15 +11,17 @@ const Profile = ({ userInfo }) => { const [isRefreshing, setIsRefreshing] = useState(false); const refreshTimerRef = useRef(null); - const maxExp = userInfo.petGrow === "EGG" ? 150 : userInfo.petGrow === "HATCH" ? 300 : 300; + //FIXME: 테스트를 위해 수치 줄임. 차후 150/300으로 변경 필요. + const maxExp = userInfo.petGrow === "EGG" ? 20 : userInfo.petGrow === "HATCH" ? 40 : 40; // 티어 아이콘 매핑 const tierEmojis = { - SEED: "🫘", - SPROUT: "🌱", - FLOWER: "🌺", - FRUIT: "🍎", - TREE: "🌳", + NONE: "❌미획득", + SEED: "🫘씨앗", + SPROUT: "🌱새싹", + FLOWER: "🌺꽃", + FRUIT: "🍎열매", + TREE: "🌳나무", }; // 펫 성장 단계 한글화 @@ -170,7 +172,7 @@ useEffect(() => {
User Avatar
- {userInfo.nickname || "사용자"}({userInfo.username || "사용자"}) + {userInfo.nickname || userInfo.username}({userInfo.username || "사용자"}) {/* 유저 세부 정보 */} @@ -193,7 +195,7 @@ useEffect(() => { 🏆 티어: - {tierEmojis[userInfo.tier] || ""} {userInfo.tier || "없음"} + {tierEmojis[userInfo.tier] || ""}