Adds @sentry/nextjs v10 with the Next.js 16 instrumentation pattern:
- instrumentation.ts — server + edge runtime init
- instrumentation-client.ts — browser init with Session Replay
(free tier, mask all text/inputs by
default since chat content is sensitive)
- app/global-error.tsx — catches root-layout crashes that escape
every other error boundary
- app/sentry-example-page — verification page; click both buttons
- next.config.ts — wrapped with withSentryConfig, source
maps upload to Sentry on every build,
client error events tunneled through
/monitoring to bypass ad-blockers
Runtime capture works as soon as NEXT_PUBLIC_SENTRY_DSN is in Coolify
env (already added). Full source-map de-minification of prod stack
traces requires SENTRY_AUTH_TOKEN in Coolify env — pending user.
Co-authored-by: Cursor <cursoragent@cursor.com>
54 lines
1.4 KiB
TypeScript
54 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
/**
|
|
* Next.js global error boundary. Renders only when a render error
|
|
* escapes every other error.tsx boundary in the tree (including the
|
|
* root layout). Required for Sentry to capture root-layout crashes
|
|
* — the more granular `error.tsx` files don't run when the layout
|
|
* itself blows up.
|
|
*/
|
|
|
|
import * as Sentry from "@sentry/nextjs";
|
|
import { useEffect } from "react";
|
|
|
|
export default function GlobalError({
|
|
error,
|
|
}: {
|
|
error: Error & { digest?: string };
|
|
}) {
|
|
useEffect(() => {
|
|
Sentry.captureException(error);
|
|
}, [error]);
|
|
|
|
return (
|
|
<html>
|
|
<body>
|
|
<div
|
|
style={{
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
minHeight: "100vh",
|
|
padding: "2rem",
|
|
fontFamily: "system-ui, -apple-system, sans-serif",
|
|
color: "#1a1a1a",
|
|
}}
|
|
>
|
|
<h1 style={{ fontSize: "1.5rem", marginBottom: "0.5rem" }}>
|
|
Something went wrong
|
|
</h1>
|
|
<p style={{ color: "#666", marginBottom: "1.5rem" }}>
|
|
We've been notified and will look into it. Try refreshing.
|
|
</p>
|
|
{error.digest ? (
|
|
<code style={{ fontSize: "0.75rem", color: "#999" }}>
|
|
ref: {error.digest}
|
|
</code>
|
|
) : null}
|
|
</div>
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|