diff --git a/src/apis/unreadLetters.ts b/src/apis/unreadLetters.ts new file mode 100644 index 0000000..d828441 --- /dev/null +++ b/src/apis/unreadLetters.ts @@ -0,0 +1,18 @@ +import client from './client'; + +export interface UnreadLetters { + data: number; + message: string; + timestamp: string; +} + +export const getUnreadLettersCount = async (): Promise => { + try { + const response = await client.get('/api/letters/unread/count'); + console.log('πŸ“© μ•ˆ 읽은 νŽΈμ§€ 개수 데이터', response); + return response.data; + } catch (error) { + console.error('βŒμ•ˆ 읽은 νŽΈμ§€ 개수λ₯Ό λ°›μ•„μ˜€λ˜ 쀑 μ—λŸ¬κ°€ λ°œμƒν–ˆμŠ΅λ‹ˆλ‹€', error); + throw new Error('μ•ˆ 읽은 νŽΈμ§€ 개수 쑰회 μ‹€νŒ¨'); + } +}; diff --git a/src/pages/Home/components/HomeRight.tsx b/src/pages/Home/components/HomeRight.tsx index 9d20d0b..0ec0f9a 100644 --- a/src/pages/Home/components/HomeRight.tsx +++ b/src/pages/Home/components/HomeRight.tsx @@ -1,6 +1,6 @@ -import { useEffect } from 'react'; +import { useEffect, useState } from 'react'; -import { useIncomingLettersStore } from '@/stores/incomingLettersStore'; +import { getUnreadLettersCount } from '@/apis/unreadLetters'; import FloatingLetters from './FloatingLetters'; import GoToLetterBoard from './GoToLetterBoard'; @@ -8,10 +8,19 @@ import GoToLetterBox from './GoToLetterBox'; import NewLetterModal from './NewLetterModal'; const HomeRight = () => { - const { arrivedCount, fetchIncomingLetters } = useIncomingLettersStore(); + const [arrivedCount, setArrivedCount] = useState(0); + useEffect(() => { - fetchIncomingLetters(); - }, [fetchIncomingLetters]); + const fetchUnreadCount = async () => { + try { + const result = await getUnreadLettersCount(); + setArrivedCount(result.data); + } catch (error) { + console.error('❌ μ•ˆ 읽은 νŽΈμ§€ 개수λ₯Ό λΆˆλŸ¬μ˜€λŠ” 데 μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€:', error); + } + }; + fetchUnreadCount(); + }, []); return (
diff --git a/src/pages/Home/components/NewLetterModal.tsx b/src/pages/Home/components/NewLetterModal.tsx index 03614c0..b5ccf7a 100644 --- a/src/pages/Home/components/NewLetterModal.tsx +++ b/src/pages/Home/components/NewLetterModal.tsx @@ -1,8 +1,21 @@ -import { useIncomingLettersStore } from '@/stores/incomingLettersStore'; +import { useEffect, useState } from 'react'; + +import { getUnreadLettersCount } from '@/apis/unreadLetters'; -//TODO: λ‚΄ νŽΈμ§€ν•¨ 상세 μ‘°νšŒμ—μ„œ ν•΄λ‹Ή νŽΈμ§€λ₯Ό μ‘°νšŒν•˜λ©΄ arrivedCountκ°€ 1 κ°μ†Œν•˜λ„λ‘ const NewLetterModal = () => { - const arrivedCount = useIncomingLettersStore((state) => state.arrivedCount); + const [arrivedCount, setArrivedCount] = useState(0); + + useEffect(() => { + const fetchUnreadCount = async () => { + try { + const result = await getUnreadLettersCount(); + setArrivedCount(result.data); + } catch (error) { + console.error('❌ μ•ˆ 읽은 νŽΈμ§€ 개수λ₯Ό λΆˆλŸ¬μ˜€λŠ” 데 μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€:', error); + } + }; + fetchUnreadCount(); + }, []); return (