diff --git a/src/pages/Home/components/FloatingLetters.tsx b/src/pages/Home/components/FloatingLetters.tsx
index 3403883..2941464 100644
--- a/src/pages/Home/components/FloatingLetters.tsx
+++ b/src/pages/Home/components/FloatingLetters.tsx
@@ -16,7 +16,7 @@ const FloatingLetters = () => {
lettersRef.current.forEach((letter, index) => {
gsap.to(letter, {
// x: Math.random() * 50 - 40,
- y: Math.random() * 20 - 40 + 'vh', // 위아래 이동
+ y: Math.random() * 20 - 30 + 'vh', // 위아래 이동
rotation: Math.random() * 50 - 25, // 회전
duration: Math.random() * 3 + 2, // 지속 시간
repeat: -1, // 무한 반복
@@ -35,7 +35,7 @@ const FloatingLetters = () => {
ref={(el) => {
if (el) lettersRef.current[index] = el;
}}
- className="absolute w-20 opacity-90"
+ className="absolute w-20 opacity-90 md:w-24"
style={{
left: `${index * 30 + 30}px`, // 편지지 간격
top: '60vh',
diff --git a/src/pages/Home/components/GoToLetterBoard.tsx b/src/pages/Home/components/GoToLetterBoard.tsx
index ddce857..fbdc6d9 100644
--- a/src/pages/Home/components/GoToLetterBoard.tsx
+++ b/src/pages/Home/components/GoToLetterBoard.tsx
@@ -4,11 +4,15 @@ import goToLetterBoard from '@/assets/images/go-to-letter-board.png';
const GoToLetterBoard = () => {
return (
-
+
게시판
-

+
diff --git a/src/pages/Home/components/GoToLetterBox.tsx b/src/pages/Home/components/GoToLetterBox.tsx
index d5be9a5..f14ab4d 100644
--- a/src/pages/Home/components/GoToLetterBox.tsx
+++ b/src/pages/Home/components/GoToLetterBox.tsx
@@ -4,9 +4,11 @@ import { Link } from 'react-router';
import { getUnreadLettersCount } from '@/apis/unreadLetters';
import goToLetterBoxNewLetters from '@/assets/images/go-to-letter-box-new-letters.png';
import goToLetterBox from '@/assets/images/go-to-letter-box.png';
+import useToastStore from '@/stores/toastStore';
const GoToLetterBox = () => {
const [arrivedCount, setArrivedCount] = useState
(0);
+ const setToastActive = useToastStore((state) => state.setToastActive);
useEffect(() => {
const fetchUnreadCount = async () => {
@@ -15,20 +17,25 @@ const GoToLetterBox = () => {
setArrivedCount(result.data);
} catch (error) {
console.error('❌ 안 읽은 편지 개수를 불러오는 데 실패했습니다:', error);
+ setToastActive({
+ toastType: 'Error',
+ title: '서버 오류로 안 읽은 편지 개수를 불러오는 데에 실패했습니다.',
+ time: 5,
+ });
}
};
fetchUnreadCount();
}, []);
return (
-
+
내 편지함
diff --git a/src/pages/Home/components/HomeBackgroundRightBottom.tsx b/src/pages/Home/components/HomeBackgroundRightBottom.tsx
index db74245..4a15d96 100644
--- a/src/pages/Home/components/HomeBackgroundRightBottom.tsx
+++ b/src/pages/Home/components/HomeBackgroundRightBottom.tsx
@@ -9,7 +9,7 @@ const HomeBackgroundRightBottom = () => {
return (
);
diff --git a/src/pages/Home/components/HomeBackgroundRightTop.tsx b/src/pages/Home/components/HomeBackgroundRightTop.tsx
index 9795f12..e37560b 100644
--- a/src/pages/Home/components/HomeBackgroundRightTop.tsx
+++ b/src/pages/Home/components/HomeBackgroundRightTop.tsx
@@ -10,7 +10,7 @@ const HomeBackgroundRightTop = () => {
return (
);
diff --git a/src/pages/Home/components/HomeRight.tsx b/src/pages/Home/components/HomeRight.tsx
index 8182517..fb75c01 100644
--- a/src/pages/Home/components/HomeRight.tsx
+++ b/src/pages/Home/components/HomeRight.tsx
@@ -7,9 +7,13 @@ import GoToLetterBoard from './GoToLetterBoard';
import GoToLetterBox from './GoToLetterBox';
import UnreadLetterModal from './UnreadLetterModal';
+import useToastStore from '@/stores/toastStore';
+
const HomeRight = () => {
const [arrivedCount, setArrivedCount] = useState
(0);
+ const setToastActive = useToastStore((state) => state.setToastActive);
+
useEffect(() => {
const fetchUnreadCount = async () => {
try {
@@ -17,6 +21,11 @@ const HomeRight = () => {
setArrivedCount(result.data);
} catch (error) {
console.error('❌ 안 읽은 편지 개수를 불러오는 데 실패했습니다:', error);
+ setToastActive({
+ toastType: 'Error',
+ title: '서버 오류로 안 읽은 편지 개수를 불러오는 데에 실패했습니다.',
+ time: 5,
+ });
}
};
fetchUnreadCount();
diff --git a/src/pages/Home/components/ShowDraftModal.tsx b/src/pages/Home/components/ShowDraftModal.tsx
index 4764837..b2f1d59 100644
--- a/src/pages/Home/components/ShowDraftModal.tsx
+++ b/src/pages/Home/components/ShowDraftModal.tsx
@@ -6,6 +6,8 @@ import { DraftLetter, getDraftLetters, deleteDraftLetters } from '@/apis/draftLe
import ModalBackgroundWrapper from '@/components/ModalBackgroundWrapper';
import ModalOverlay from '@/components/ModalOverlay';
+import useToastStore from '@/stores/toastStore';
+
interface ShowDraftModalProps {
children?: React.ReactNode;
onClose: () => void;
@@ -16,6 +18,8 @@ const ShowDraftModal = ({ onClose }: ShowDraftModalProps) => {
const navigate = useNavigate();
+ const setToastActive = useToastStore((state) => state.setToastActive);
+
const handleNavigation = (draft: DraftLetter) => {
navigate(`/letter/write/?letterId=${draft.parentLetterId}`, {
state: { draft, isDraft: true },
@@ -29,17 +33,26 @@ const ShowDraftModal = ({ onClose }: ShowDraftModalProps) => {
})
.catch((error) => {
console.error('❌ 임시저장된 편지를 불러오는데 실패했습니다', error);
+ setToastActive({
+ toastType: 'Error',
+ title: '서버 오류로 임시저장된 편지를 불러오는 데에 실패했습니다.',
+ time: 5,
+ });
});
};
const handleDeleteDraftLetters = async (letterId: number) => {
- //TODO: 정말로 삭제하시겠습니까? 모달창
try {
await deleteDraftLetters(letterId);
setDraftLetters((prev) => prev.filter((letter) => letter.letterId !== letterId));
console.log(`letterId는 `, letterId);
} catch (error) {
console.error(`❌임시저장된 편지를 삭제하던 중 에러가 발생했습니다.`, error);
+ setToastActive({
+ toastType: 'Error',
+ title: '서버 오류로 임시저장 된 편지를 삭제하던 중 에러가 발생했습니다.',
+ time: 5,
+ });
}
};
diff --git a/src/pages/Home/components/ShowShareAccessModal.tsx b/src/pages/Home/components/ShowShareAccessModal.tsx
index e9c1dfa..15a952c 100644
--- a/src/pages/Home/components/ShowShareAccessModal.tsx
+++ b/src/pages/Home/components/ShowShareAccessModal.tsx
@@ -8,6 +8,8 @@ import { ShareProposal } from '@/apis/share';
import ModalBackgroundWrapper from '@/components/ModalBackgroundWrapper';
import ModalOverlay from '@/components/ModalOverlay';
+import useToastStore from '@/stores/toastStore';
+
interface ShowShareAccessModalProps {
children?: React.ReactNode;
onClose: () => void;
@@ -18,6 +20,8 @@ const ShowShareAccessModal = ({ onClose }: ShowShareAccessModalProps) => {
const [shareProposals, setShareProposals] = useState([]);
+ const setToastActive = useToastStore((state) => state.setToastActive);
+
useEffect(() => {
getShareProposalList()
.then((data) => {
@@ -25,6 +29,11 @@ const ShowShareAccessModal = ({ onClose }: ShowShareAccessModalProps) => {
})
.catch((error) => {
console.error('❌ 공유 요청 목록을 불러오는 데 실패했습니다.', error);
+ setToastActive({
+ toastType: 'Error',
+ title: '서버 오류로 공유 요청 목록을 불러오는 데에 실패했습니다.',
+ time: 5,
+ });
});
}, []);
@@ -36,6 +45,11 @@ const ShowShareAccessModal = ({ onClose }: ShowShareAccessModalProps) => {
});
} catch (error) {
console.error('❌ 게시글 상세 페이지로 이동하는 데에 실패했습니다.', error);
+ setToastActive({
+ toastType: 'Error',
+ title: '서버 오류로 게시글 상세 페이지로 이동하는 데에 실패했습니다.',
+ time: 5,
+ });
}
};
diff --git a/src/pages/Home/components/UnreadLetterModal.tsx b/src/pages/Home/components/UnreadLetterModal.tsx
index c3491a3..5ce5522 100644
--- a/src/pages/Home/components/UnreadLetterModal.tsx
+++ b/src/pages/Home/components/UnreadLetterModal.tsx
@@ -1,9 +1,11 @@
import { useEffect, useState } from 'react';
import { getUnreadLettersCount } from '@/apis/unreadLetters';
+import useToastStore from '@/stores/toastStore';
const UnreadLetterModal = () => {
const [arrivedCount, setArrivedCount] = useState(0);
+ const setToastActive = useToastStore((state) => state.setToastActive);
useEffect(() => {
const fetchUnreadCount = async () => {
@@ -12,6 +14,11 @@ const UnreadLetterModal = () => {
setArrivedCount(result.data);
} catch (error) {
console.error('❌ 안 읽은 편지 개수를 불러오는 데 실패했습니다:', error);
+ setToastActive({
+ toastType: 'Error',
+ title: '서버 오류로 안 읽은 편지 개수를 불러오는 데에 실패했습니다.',
+ time: 5,
+ });
}
};
fetchUnreadCount();
diff --git a/src/pages/LetterBoxDetail/index.tsx b/src/pages/LetterBoxDetail/index.tsx
index eced975..8bed0a8 100644
--- a/src/pages/LetterBoxDetail/index.tsx
+++ b/src/pages/LetterBoxDetail/index.tsx
@@ -95,13 +95,13 @@ const LetterBoxDetailPage = () => {
setShareComment('');
setToastActive({
toastType: 'Success',
- title: '공유 완료 되었습니다.',
+ title: '공유 요청이 완료 되었습니다.',
});
},
onError: (error) => {
setToastActive({
toastType: 'Error',
- title: '공유가 실패했습니다. 잠시 후에 다시 시도해주세요.',
+ title: '공유 요청이 실패했습니다. 잠시 후에 다시 시도해주세요.',
});
console.error(error);
},
diff --git a/src/pages/MyPage/index.tsx b/src/pages/MyPage/index.tsx
index 7e19fa7..e091935 100644
--- a/src/pages/MyPage/index.tsx
+++ b/src/pages/MyPage/index.tsx
@@ -59,7 +59,11 @@ const MyPage = () => {
setIsOpenModal(false);
if (response?.status === 200) {
logout();
- alert('탈퇴가 완료 되었습니다.');
+ setToastActive({
+ toastType: 'Success',
+ title: '탈퇴가 완료되었습니다.',
+ time: 5,
+ });
}
}}
/>
@@ -70,6 +74,11 @@ const MyPage = () => {
+
경고 안내
+
+ 따사로운 서비스 이용을 위해, 부적절하다고 판단되는 편지는 반려하고 있어요. 서로를
+ 존중하는 따뜻한 공간을 만들기 위해 협조 부탁드립니다.
+
경고 규칙
3회 경고: 서비스 이용 불가능
diff --git a/src/pages/Share/index.tsx b/src/pages/Share/index.tsx
index 8a2fddf..2ecb81f 100644
--- a/src/pages/Share/index.tsx
+++ b/src/pages/Share/index.tsx
@@ -4,6 +4,8 @@ import { useNavigate, useParams } from 'react-router';
import { getShareProposalDetail } from '@/apis/share';
import { postShareProposalApproval, ShareProposalDetail } from '@/apis/share';
+import useToastStore from '@/stores/toastStore';
+
import { twMerge } from 'tailwind-merge';
import Letter from '../LetterBoardDetail/components/Letter';
@@ -12,17 +14,36 @@ import BlurImg from '@/assets/images/landing-blur.png';
const ShareApprovalPage = () => {
const navigate = useNavigate();
const { shareProposalId } = useParams();
- console.log(shareProposalId);
const [proposalDetail, setProposalDetail] = useState();
+ const setToastActive = useToastStore((state) => state.setToastActive);
+
const handleProposalApproval = async (action: 'approve' | 'reject') => {
try {
const result = await postShareProposalApproval(Number(shareProposalId), action);
console.log(`✅ 편지 공유 ${action === 'approve' ? '수락' : '거절'}됨:`, result);
+ if (action === 'approve') {
+ setToastActive({
+ toastType: 'Success',
+ title: '편지를 성공적으로 공유하였습니다. 게시판에서 확인해보세요!',
+ time: 5,
+ });
+ } else {
+ setToastActive({
+ toastType: 'Info',
+ title: '공유 요청을 성공적으로 거부하였습니다.',
+ time: 5,
+ });
+ }
navigate('/');
} catch (error) {
console.error('❌공유 요청 처리 중 에러 발생', error);
+ setToastActive({
+ toastType: 'Error',
+ title: '서버 오류로 편지를 공유하는 데에 실패했습니다.',
+ time: 5,
+ });
}
};
useEffect(() => {
@@ -32,6 +53,11 @@ const ShareApprovalPage = () => {
setProposalDetail(data);
} catch (error) {
console.error('❌ 공유 요청 상세 조회에 실패했습니다.', error);
+ setToastActive({
+ toastType: 'Error',
+ title: '서버 오류로 공유 요청을 조회하는 데에 실패했습니다.',
+ time: 5,
+ });
throw error;
}
};