Skip to content

Commit 0ea8a02

Browse files
committed
chore: Enhance Sentry configuration and error tracking
Update Sentry configuration across multiple files: - Modify Next.js config to add React component annotation - Adjust client-side Sentry settings, including replay error sampling - Update server and edge runtime Sentry configurations - Add error tracking instrumentation - Refactor error handling in custom error page
1 parent b5c5b4d commit 0ea8a02

6 files changed

+76
-40
lines changed

next.config.mjs

+67-29
Original file line numberDiff line numberDiff line change
@@ -75,42 +75,80 @@ const nextConfig = {
7575
},
7676
}
7777

78-
export default withSentryConfig(nextConfig, {
79-
// For all available options, see:
80-
// https://github.com/getsentry/sentry-webpack-plugin#options
78+
export default withSentryConfig(
79+
withSentryConfig(nextConfig, {
80+
// For all available options, see:
81+
// https://github.com/getsentry/sentry-webpack-plugin#options
8182

82-
org: 'mgates-llc',
83-
project: 'dotabod-frontend',
83+
org: 'mgates-llc',
84+
project: 'dotabod-frontend',
8485

85-
release: process.env.NEXT_PUBLIC_VERCEL_GIT_COMMIT_SHA,
86+
release: process.env.NEXT_PUBLIC_VERCEL_GIT_COMMIT_SHA,
8687

87-
// Only print logs for uploading source maps in CI
88-
silent: !process.env.CI,
88+
// Only print logs for uploading source maps in CI
89+
silent: !process.env.CI,
8990

90-
// For all available options, see:
91-
// https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
91+
// For all available options, see:
92+
// https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
9293

93-
// Upload a larger set of source maps for prettier stack traces (increases build time)
94-
widenClientFileUpload: true,
94+
// Upload a larger set of source maps for prettier stack traces (increases build time)
95+
widenClientFileUpload: true,
9596

96-
// Transpiles SDK to be compatible with IE11 (increases bundle size)
97-
transpileClientSDK: true,
97+
// Transpiles SDK to be compatible with IE11 (increases bundle size)
98+
transpileClientSDK: true,
9899

99-
// Route browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers.
100-
// This can increase your server load as well as your hosting bill.
101-
// Note: Check that the configured route will not match with your Next.js middleware, otherwise reporting of client-
102-
// side errors will fail.
103-
tunnelRoute: '/monitoring',
100+
// Route browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers.
101+
// This can increase your server load as well as your hosting bill.
102+
// Note: Check that the configured route will not match with your Next.js middleware, otherwise reporting of client-
103+
// side errors will fail.
104+
tunnelRoute: '/monitoring',
104105

105-
// Hides source maps from generated client bundles
106-
hideSourceMaps: true,
106+
// Hides source maps from generated client bundles
107+
hideSourceMaps: true,
107108

108-
// Automatically tree-shake Sentry logger statements to reduce bundle size
109-
disableLogger: true,
109+
// Automatically tree-shake Sentry logger statements to reduce bundle size
110+
disableLogger: true,
110111

111-
// Enables automatic instrumentation of Vercel Cron Monitors. (Does not yet work with App Router route handlers.)
112-
// See the following for more information:
113-
// https://docs.sentry.io/product/crons/
114-
// https://vercel.com/docs/cron-jobs
115-
automaticVercelMonitors: true,
116-
})
112+
// Enables automatic instrumentation of Vercel Cron Monitors. (Does not yet work with App Router route handlers.)
113+
// See the following for more information:
114+
// https://docs.sentry.io/product/crons/
115+
// https://vercel.com/docs/cron-jobs
116+
automaticVercelMonitors: true,
117+
}),
118+
{
119+
// For all available options, see:
120+
// https://www.npmjs.com/package/@sentry/webpack-plugin#options
121+
122+
org: 'mgates-llc',
123+
project: 'dotabod-frontend',
124+
125+
// Only print logs for uploading source maps in CI
126+
silent: !process.env.CI,
127+
128+
// For all available options, see:
129+
// https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
130+
131+
// Upload a larger set of source maps for prettier stack traces (increases build time)
132+
widenClientFileUpload: true,
133+
134+
// Automatically annotate React components to show their full name in breadcrumbs and session replay
135+
reactComponentAnnotation: {
136+
enabled: true,
137+
},
138+
139+
// Uncomment to route browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers.
140+
// This can increase your server load as well as your hosting bill.
141+
// Note: Check that the configured route will not match with your Next.js middleware, otherwise reporting of client-
142+
// side errors will fail.
143+
// tunnelRoute: "/monitoring",
144+
145+
// Automatically tree-shake Sentry logger statements to reduce bundle size
146+
disableLogger: true,
147+
148+
// Enables automatic instrumentation of Vercel Cron Monitors. (Does not yet work with App Router route handlers.)
149+
// See the following for more information:
150+
// https://docs.sentry.io/product/crons/
151+
// https://vercel.com/docs/cron-jobs
152+
automaticVercelMonitors: true,
153+
},
154+
)

sentry.client.config.ts

+1-3
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,6 @@ if (SENTRY_DSN) {
3131
tracesSampleRate: 0.1,
3232
// Capture errors based on environment
3333
release: process.env.NEXT_PUBLIC_VERCEL_GIT_COMMIT_SHA,
34-
// Automatically set user information from session when available
35-
autoSessionTracking: true,
3634

3735
// Setting this option to true will print useful information to the console while you're setting up Sentry.
3836
debug: false,
@@ -44,7 +42,7 @@ if (SENTRY_DSN) {
4442
* "0" so that we have manual control over session-based replays
4543
*/
4644
replaysSessionSampleRate: 0,
47-
replaysOnErrorSampleRate: 0,
45+
replaysOnErrorSampleRate: 1,
4846
integrations: [replay],
4947
})
5048

sentry.edge.config.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ if (SENTRY_DSN) {
1111
Sentry.init({
1212
dsn: SENTRY_DSN,
1313

14-
// Adjust this value in production, or use tracesSampler for greater control
14+
// Define how likely traces are sampled. Adjust this value in production, or use tracesSampler for greater control.
1515
tracesSampleRate: 1,
1616

1717
// Setting this option to true will print useful information to the console while you're setting up Sentry.

sentry.server.config.ts

+1-4
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,10 @@ if (SENTRY_DSN) {
1010
Sentry.init({
1111
dsn: SENTRY_DSN,
1212

13-
// Adjust this value in production, or use tracesSampler for greater control
13+
// Define how likely traces are sampled. Adjust this value in production, or use tracesSampler for greater control.
1414
tracesSampleRate: 1,
1515

1616
// Setting this option to true will print useful information to the console while you're setting up Sentry.
1717
debug: false,
18-
19-
// Uncomment the line below to enable Spotlight (https://spotlightjs.com)
20-
// spotlight: process.env.VERCEL_ENV === 'development',
2118
})
2219
}

src/instrumentation.ts

+3
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import * as Sentry from '@sentry/nextjs'
2+
13
export async function register() {
24
if (process.env.NEXT_RUNTIME === 'nodejs') {
35
await import('../sentry.server.config')
@@ -7,3 +9,4 @@ export async function register() {
79
await import('../sentry.edge.config')
810
}
911
}
12+
export const onRequestError = Sentry.captureRequestError

src/pages/_error.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -17,14 +17,14 @@
1717
*/
1818

1919
import * as Sentry from '@sentry/nextjs'
20-
import NextErrorComponent from 'next/error'
20+
import Error from 'next/error'
2121

2222
const CustomErrorComponent = (props) => {
2323
// If you're using a Nextjs version prior to 12.2.1, uncomment this to
2424
// compensate for https://github.com/vercel/next.js/issues/8592
2525
// Sentry.captureUnderscoreErrorException(props);
2626

27-
return <NextErrorComponent statusCode={props.statusCode} />
27+
return <Error statusCode={props.statusCode} />
2828
}
2929

3030
CustomErrorComponent.getInitialProps = async (contextData) => {
@@ -33,7 +33,7 @@ CustomErrorComponent.getInitialProps = async (contextData) => {
3333
await Sentry.captureUnderscoreErrorException(contextData)
3434

3535
// This will contain the status code of the response
36-
return NextErrorComponent.getInitialProps(contextData)
36+
return Error.getInitialProps(contextData)
3737
}
3838

3939
export default CustomErrorComponent

0 commit comments

Comments
 (0)