'use client'; import * as Sentry from '@sentry/nextjs'; import { useEffect, useState } from 'react'; export default function GlobalError({ error, reset, }: { error: Error & { digest?: string }; reset: () => void; }) { const [retryCount, setRetryCount] = useState(0); const [autoRetrying, setAutoRetrying] = useState(false); useEffect(() => { Sentry.captureException(error); if (process.env.NODE_ENV !== 'production') { console.error('Unhandled error:', error); } }, [error]); // Auto-retry once after 3 seconds useEffect(() => { if (retryCount > 0) return; setAutoRetrying(true); const timer = setTimeout(() => { setAutoRetrying(false); setRetryCount((c) => c + 1); reset(); }, 3000); return () => clearTimeout(timer); }, [error, reset, retryCount]); const handleRetry = () => { setRetryCount((c) => c + 1); reset(); }; return (
{autoRetrying ? 'Đang tự động thử lại...' : 'Rất tiếc, đã có lỗi xảy ra. Vui lòng thử lại.'}
{error.digest && (Mã lỗi: {error.digest}
)} {retryCount > 0 && (Đã thử lại {retryCount} lần
)}