diff --git a/src/apis/myPage.ts b/src/apis/myPage.ts index 638ebc1..ab65d76 100644 --- a/src/apis/myPage.ts +++ b/src/apis/myPage.ts @@ -4,7 +4,7 @@ export const fetchMyPageInfo = async () => { try { const response = await client.get('/api/members/me'); if (!response) throw new Error('❌데이터를 불러오던 중 오류가 발생했습니다'); - return response.data; + return response.data.data; } catch (error) { console.error(error); } diff --git a/src/layouts/Header.tsx b/src/layouts/Header.tsx index c51df60..b05e8ba 100644 --- a/src/layouts/Header.tsx +++ b/src/layouts/Header.tsx @@ -24,7 +24,7 @@ const Header = () => { )} - + diff --git a/src/pages/MyPage/index.tsx b/src/pages/MyPage/index.tsx index 6b268aa..9a5ba7f 100644 --- a/src/pages/MyPage/index.tsx +++ b/src/pages/MyPage/index.tsx @@ -1,21 +1,17 @@ import { useState, useEffect } from 'react'; import { Link } from 'react-router'; +import { fetchMyPageInfo } from '@/apis/myPage'; import { deleteUserInfo } from '@/apis/auth'; import ConfirmModal from '@/components/ConfirmModal'; import useAuthStore from '@/stores/authStore'; -import useMyPageStore from '@/stores/myPageStore'; import { TEMPERATURE_RANGE } from './constants'; import useToastStore from '@/stores/toastStore'; import ModalOverlay from '@/components/ModalOverlay'; const MyPage = () => { - useEffect(() => { - fetchMyPageInfo(); - }, []); - - const { data, fetchMyPageInfo } = useMyPageStore(); + const [myInfo, setMyInfo] = useState(); const [isOpenModal, setIsOpenModal] = useState(false); const [isOpenWarningModal, setIsOpenWarningModal] = useState(false); @@ -23,13 +19,19 @@ const MyPage = () => { const logout = useAuthStore((state) => state.logout); const setToastActive = useToastStore((state) => state.setToastActive); + useEffect(() => { + const fetchData = async () => { + const data = await fetchMyPageInfo(); + if (data) setMyInfo(data); + }; + fetchData(); + }, []); + const getDescriptionByTemperature = (temp: number) => { const range = TEMPERATURE_RANGE.find((range) => temp >= range.min && temp < range.max); return range?.description; }; - const description = getDescriptionByTemperature(Number(data.temperature)); - const handleLeave = async () => { try { const response = await deleteUserInfo(); @@ -88,7 +90,7 @@ const MyPage = () => {

- {data.zipCode.split('').map((code, index) => ( + {myInfo?.zipCode.split('').map((code, index) => (
{

-

{description}

-

{data.temperature}도

+

+ {getDescriptionByTemperature(Number(myInfo?.temperature))} +

+

{myInfo?.temperature}도

@@ -131,8 +135,8 @@ const MyPage = () => {

로그인 정보

- {data.social} - {data.email} + {myInfo?.social} + {myInfo?.email}

{ >

경고 횟수

- {data.warningCount}회 + {myInfo?.warningCount}회

diff --git a/src/stores/myPageStore.ts b/src/stores/myPageStore.ts deleted file mode 100644 index dda344e..0000000 --- a/src/stores/myPageStore.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { create } from 'zustand'; - -import { fetchMyPageInfo } from '@/apis/myPage'; - -interface MyPageDataStore { - zipCode: string; - temperature: string; - social: string; - email: string; - warningCount: number; -} - -interface MyPageStore { - data: MyPageDataStore; - message: string; - setMyPageData: (newData: MyPageDataStore) => void; - fetchMyPageInfo: () => void; -} -const useMyPageStore = create((set) => ({ - data: { - zipCode: '', - temperature: '', - social: '', - email: '', - warningCount: 0, - }, - message: '', - setMyPageData: (newData) => set({ data: newData }), - fetchMyPageInfo: async () => { - try { - const responseData = await fetchMyPageInfo(); - set({ data: responseData.data, message: responseData.message }); - } catch (error) { - console.error('데이터를 불러오던 중 에러가 발생했습니다', error); - } - }, -})); - -export default useMyPageStore; diff --git a/src/types/mypage.d.ts b/src/types/mypage.d.ts new file mode 100644 index 0000000..f70b9a1 --- /dev/null +++ b/src/types/mypage.d.ts @@ -0,0 +1,7 @@ +interface MyPage { + zipCode: string; + temperature: string; + social: string; + email: string; + warningCount: number; +}