diff --git a/apps/web/src/app/main/community/freeboard/[freeboardId]/ClientPage.tsx b/apps/web/src/app/main/community/freeboard/[freeboardId]/ClientPage.tsx index 0012455d..8028293e 100644 --- a/apps/web/src/app/main/community/freeboard/[freeboardId]/ClientPage.tsx +++ b/apps/web/src/app/main/community/freeboard/[freeboardId]/ClientPage.tsx @@ -7,6 +7,8 @@ import CommentInput from './components/CommentInput'; import FreeboardDetailSkeleton from './components/FreeboardDetailSkeleton'; import { useGetFreeboardPost } from '@/generated/api/endpoints/freeboard/freeboard'; import { useAuthRestore } from '@/hooks/useAuth'; +import ErrorFallback from '@/components/ErrorFallback'; +import { ErrorBoundary } from 'react-error-boundary'; /** * 자유 게시판 게시글 상세 클라이언트 화면 @@ -18,6 +20,7 @@ export default function ClientPage({ postId }: { postId: number }) { data: post, isPending, error, + refetch, } = useGetFreeboardPost(postId, { query: { staleTime: 0, // 언제나 신선하지 않은 것으로 간주 @@ -28,11 +31,37 @@ export default function ClientPage({ postId }: { postId: number }) { }, }); - // TODO: 로딩/에러 처리 구체화 필요 - // postId가 유효하지 않은 경우 처리 필요 if (!postId) return ; if (isPending) return ; - if (error || !post) return
에러가 발생했습니다.
; + if (error || !post) { + return ( +
+
+ + {/* router.back() 내부 처리 */} + + 자유게시판 + + {/* TODO: onClick 핸들러 추가 */} + { + /* 바텀시트 열기 */ + }} + /> + +
+ +
+ { + refetch(); + }} + /> +
+
+ ); + } return (
@@ -51,7 +80,16 @@ export default function ClientPage({ postId }: { postId: number }) { - + ( + + )} + > + +
0 - ? data.pages[data.pages.length - 1]?.total + ? data.pages[0]?.total : undefined; - const headerCount = latestTotal ?? initialCount ?? comments.length; + const headerCount = firstPageTotal ?? initialCount ?? 0; return (
diff --git a/apps/web/src/app/main/community/freeboard/[freeboardId]/components/LikeButtonComment.tsx b/apps/web/src/app/main/community/freeboard/[freeboardId]/components/LikeButtonComment.tsx index 1e348383..42dd6b8d 100644 --- a/apps/web/src/app/main/community/freeboard/[freeboardId]/components/LikeButtonComment.tsx +++ b/apps/web/src/app/main/community/freeboard/[freeboardId]/components/LikeButtonComment.tsx @@ -3,11 +3,12 @@ import { useEffect, useState } from 'react'; import { ThumbsUp } from 'lucide-react'; import { useQueryClient } from '@tanstack/react-query'; -import { useAuthGuard, useAuthRestore } from '@/hooks/useAuth'; +import { useAuthGuard } from '@/hooks/useAuth'; import { useToast } from '@/hooks/ui/useToast'; import { formatCappedCount } from '@/utils/formatCount'; import { getGetFreeboardCommentsByCursorQueryKey } from '@/generated/api/endpoints/freeboard-comment/freeboard-comment'; import { useToggleFreeboardCommentLike } from '@/generated/api/endpoints/freeboard-comment-like/freeboard-comment-like'; +import { clampCount } from '@/utils/clampCount'; interface LikeButtonCommentProps { postId: number; @@ -16,9 +17,6 @@ interface LikeButtonCommentProps { initialLikeCount: number; } -// 음수 방지(보정) 헬퍼 -const clampMin0 = (n: number) => (n < 0 ? 0 : n); - /** * 댓글 좋아요 버튼 * @@ -32,7 +30,6 @@ export default function LikeButtonComment({ initialLiked, initialLikeCount, }: LikeButtonCommentProps) { - const { isRestoring, isAuthenticated } = useAuthRestore(); const queryClient = useQueryClient(); const toast = useToast(); const { guard } = useAuthGuard(); @@ -66,7 +63,7 @@ export default function LikeButtonComment({ setLiked((prev) => { const next = !prev; const delta = next ? 1 : -1; - setLikeCount((count) => clampMin0(count + delta)); + setLikeCount((count) => clampCount(count + delta)); return next; }); @@ -104,23 +101,6 @@ export default function LikeButtonComment({ toggleLike.mutate({ freeboardId: postId, commentId }); }); - // 인증 복원 중임을 명시(시각적 피드백) - if (isRestoring) { - return ( - - ); - } - return ( - ); - } - return (