File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
'use client';
import { useEffect } from 'react';
interface ErrorPageProps {
error: Error & { digest?: string };
unstable_retry: () => void;
}
// 게시판 세 화면이 공유하는 에러 경계. 원본 메시지·스택은 화면에 내지 않는다 — 개발자 진단용으로만
// 콘솔에 남기고(프로덕션에서는 Next.js가 Server Component 에러를 이미 digest 포함 일반화 메시지로
// 치환해 전달한다), 사용자에게는 일반화된 문구 + 재시도만 제공한다. Next.js 16.2 문서 권고에 따라
// 세그먼트 재조회까지 수행하는 `unstable_retry()`를 `reset()` 대신 사용한다.
export default function ErrorPage({ error, unstable_retry }: ErrorPageProps) {
useEffect(() => {
console.error(error);
}, [error]);
return (
<section className="flex flex-1 flex-col items-center justify-center gap-2 p-8">
<h1 className="text-lg text-foreground">문제가 발생했습니다.</h1>
<p className="text-sm text-foreground/60">잠시 후 다시 시도해 주세요.</p>
<button
type="button"
onClick={() => unstable_retry()}
className="mt-4 bg-foreground px-4 py-2 text-background"
>
다시 시도
</button>
</section>
);
}