Files
goodgo-platform/apps/web/app/error.tsx
Ho Ngoc Hai 400a75845c feat(observability): integrate Sentry error tracking for API and Web apps
- API: add @sentry/nestjs with instrument.ts, SentryModule, and SentryGlobalFilter
- Web: add @sentry/nextjs with client/server/edge configs, instrumentation hook
- Update next.config.js with withSentryConfig wrapper
- Replace TODO in error.tsx with Sentry.captureException
- Add SENTRY_DSN, SENTRY_AUTH_TOKEN, SENTRY_ORG, SENTRY_PROJECT to .env.example

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-08 13:44:57 +07:00

67 lines
2.2 KiB
TypeScript

'use client';
import * as Sentry from '@sentry/nextjs';
import { useEffect } from 'react';
export default function GlobalError({
error,
reset,
}: {
error: Error & { digest?: string };
reset: () => void;
}) {
useEffect(() => {
Sentry.captureException(error);
if (process.env.NODE_ENV !== 'production') {
console.error('Unhandled error:', error);
}
}, [error]);
return (
<div className="flex min-h-screen flex-col items-center justify-center bg-background px-4">
<div className="mx-auto max-w-md text-center">
<div className="mx-auto flex h-16 w-16 items-center justify-center rounded-full bg-destructive/10">
<svg
className="h-8 w-8 text-destructive"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z"
/>
</svg>
</div>
<h1 className="mt-4 text-2xl font-bold tracking-tight">
Đã xảy ra lỗi
</h1>
<p className="mt-2 text-muted-foreground">
Rất tiếc, đã lỗi xảy ra. Vui lòng thử lại.
</p>
{error.digest && (
<p className="mt-1 text-xs text-muted-foreground">
lỗi: {error.digest}
</p>
)}
<div className="mt-8 flex justify-center gap-3">
<button
onClick={reset}
className="inline-flex h-10 items-center justify-center rounded-md bg-primary px-6 text-sm font-medium text-primary-foreground shadow transition-colors hover:bg-primary/90"
>
Thử lại
</button>
<a
href="/"
className="inline-flex h-10 items-center justify-center rounded-md border border-input bg-background px-6 text-sm font-medium shadow-sm transition-colors hover:bg-accent hover:text-accent-foreground"
>
Về trang chủ
</a>
</div>
</div>
</div>
);
}