diff --git a/src/apis/incomingLetters.ts b/src/apis/incomingLetters.ts index 12f8040..d4c2db7 100644 --- a/src/apis/incomingLetters.ts +++ b/src/apis/incomingLetters.ts @@ -1,4 +1,4 @@ -import { client } from '@/apis/client'; +import client from './client'; export const fetchIncomingLettersApi = async (token: string) => { try { diff --git a/src/apis/myPage.ts b/src/apis/myPage.ts new file mode 100644 index 0000000..6e5057e --- /dev/null +++ b/src/apis/myPage.ts @@ -0,0 +1,11 @@ +import client from './client'; + +export const fetchMyPageInfo = async () => { + try { + const response = await client.get('/api/members/me'); + if (!response) throw new Error('❌데이터를 불러오던 중 오류가 발생했습니다'); + return response.data; + } catch (error) { + console.error(error); + } +}; diff --git a/src/pages/MyPage/index.tsx b/src/pages/MyPage/index.tsx index 4bed508..5c2fcfe 100644 --- a/src/pages/MyPage/index.tsx +++ b/src/pages/MyPage/index.tsx @@ -1,14 +1,17 @@ -import { useState } from 'react'; +import { useState, useEffect } from 'react'; import { Link } from 'react-router'; import ConfirmModal from '@/components/ConfirmModal'; +import useMyPageStore from '@/stores/myPageStore'; import { TEMPERATURE_RANGE } from './constants'; -const DUMMY_TEMP = 48.5; -const DUMMY_ZIP_CODE = '235EA'; - const MyPage = () => { + useEffect(() => { + fetchMyPageInfo(); + }, []); + + const { data, fetchMyPageInfo } = useMyPageStore(); const [isOpenModal, setIsOpenModal] = useState(false); const getDescriptionByTemperature = (temp: number) => { @@ -16,7 +19,7 @@ const MyPage = () => { return range?.description; }; - const description = getDescriptionByTemperature(DUMMY_TEMP); + const description = getDescriptionByTemperature(Number(data.temperature)); return ( <> @@ -32,7 +35,7 @@ const MyPage = () => { )}

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

{description}

-

{DUMMY_TEMP}도

+

{data.temperature}도

@@ -69,8 +72,8 @@ const MyPage = () => {

로그인 정보

- 카카오 - kakaoAccount@kakao.com + {data.social} + {data.email}

로그아웃

diff --git a/src/stores/myPageStore.ts b/src/stores/myPageStore.ts new file mode 100644 index 0000000..61b34ac --- /dev/null +++ b/src/stores/myPageStore.ts @@ -0,0 +1,37 @@ +import { create } from 'zustand'; + +import { fetchMyPageInfo } from '@/apis/mypage'; + +interface MyPageDataStore { + zipCode: string; + temperature: string; + social: string; + email: string; +} + +interface MyPageStore { + data: MyPageDataStore; + message: string; + setMyPageData: (newData: MyPageDataStore) => void; + fetchMyPageInfo: () => void; +} +const useMyPageStore = create((set) => ({ + data: { + zipCode: '', + temperature: '', + social: '', + email: '', + }, + 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;