diff --git a/ui/src/components/review/server/no-review.tsx b/ui/src/components/review/server/no-review.tsx
new file mode 100644
index 00000000..4c1b0d1b
--- /dev/null
+++ b/ui/src/components/review/server/no-review.tsx
@@ -0,0 +1,13 @@
+import { XCircleIcon } from '@heroicons/react/24/outline';
+
+import Text from '@/components/common/server/text';
+
+export function NoReview() {
+ return (
+
+
+
+ 해당하는 리뷰가 없습니다.
+
+ );
+}
diff --git a/ui/src/components/review/server/review-cards-list.tsx b/ui/src/components/review/server/review-cards-list.tsx
index f19aec01..47e142ca 100644
--- a/ui/src/components/review/server/review-cards-list.tsx
+++ b/ui/src/components/review/server/review-cards-list.tsx
@@ -1,5 +1,6 @@
import Pagination from '@/components/common/client/pagination';
import { ReviewCard } from '@/components/review/client/review-card';
+import { NoReview } from '@/components/review/server/no-review';
import { listReviews } from '@/lib/apis/review/server';
import type { ListReviewsQuery } from '@/lib/definitions/review';
@@ -10,9 +11,10 @@ export async function ReviewCardsList({ query }: { query: ListReviewsQuery }) {
return (
- {reviews.map((review) => (
-
- ))}
+ {reviews.length > 0 &&
+ reviews.map((review) => )}
+
+ {reviews.length === 0 && }
diff --git a/ui/src/hooks/common/use-pagination.ts b/ui/src/hooks/common/use-pagination.ts
index 44d4392b..5ccc3d86 100644
--- a/ui/src/hooks/common/use-pagination.ts
+++ b/ui/src/hooks/common/use-pagination.ts
@@ -7,6 +7,12 @@ export function usePagination(totalPages: number) {
const searchParams = useSearchParams();
const currentPage = Number(searchParams.get('page')) || 1;
+ // when there are no pages, set totalPages to 1
+ // to show fallback on 1st page
+ if (totalPages === 0) {
+ totalPages = 1;
+ }
+
if (currentPage < 1 || currentPage > totalPages) {
redirect(`${pathname}?page=1`);
// TODO: handle properly - move this to page.tsx before fetch and redirect to notfound ?