feat(sentry): add new required config changes, disable trace

Author: johnshift

next.config.mjs

@@ -23,47 +23,33 @@ const nextConfig = {
       },
     ],
   },
+  webpack: (config, { webpack }) => {
+    config.plugins.push(
+      new webpack.DefinePlugin({
+        __SENTRY_DEBUG__: false,
+        __SENTRY_TRACING__: false,
+        __RRWEB_EXCLUDE_IFRAME__: true,
+        __RRWEB_EXCLUDE_SHADOW_DOM__: true,
+        __SENTRY_EXCLUDE_REPLAY_WORKER__: true,
+      }),
+    );
+
+    // return the modified config
+    return config;
+  },
 };
 
 export default withSentryConfig(withBundleAnalyzer(nextConfig), {
-  // For all available options, see:
-  // https://github.com/getsentry/sentry-webpack-plugin#options
-
   org: 'jobstash',
   project: 'ecosystemvision',
-
-  // Only print logs for uploading source maps in CI
   silent: !process.env.CI,
-
-  // For all available options, see:
-  // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
-
-  // Upload a larger set of source maps for prettier stack traces (increases build time)
   widenClientFileUpload: true,
-
-  // Automatically annotate React components to show their full name in breadcrumbs and session replay
   reactComponentAnnotation: {
     enabled: true,
   },
-
-  // Route browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers.
-  // This can increase your server load as well as your hosting bill.
-  // Note: Check that the configured route will not match with your Next.js middleware, otherwise reporting of client-
-  // side errors will fail.
-  tunnelRoute: '/monitoring',
-
-  // Hides source maps from generated client bundles
+  tunnelRoute: '/sentry-tunnel',
   hideSourceMaps: true,
-
-  // Automatically tree-shake Sentry logger statements to reduce bundle size
   disableLogger: true,
-
-  // Enables automatic instrumentation of Vercel Cron Monitors. (Does not yet work with App Router route handlers.)
-  // See the following for more information:
-  // https://docs.sentry.io/product/crons/
-  // https://vercel.com/docs/cron-jobs
-  automaticVercelMonitors: true,
-
   sourcemaps: {
     deleteSourcemapsAfterUpload: true,
   },

package.json

@@ -4,7 +4,6 @@
   "private": true,
   "scripts": {
     "dev": "next dev",
-    "prebuild": "node tools/scripts/generate-sitemap.js",
     "build": "next build",
     "start": "next start",
     "lint": "eslint ./src",
@@ -28,7 +27,7 @@
     "@heroui/react": "2.6.14",
     "@next/bundle-analyzer": "^14.2.5",
     "@next/third-parties": "^15.0.3",
-    "@sentry/nextjs": "^9.1.0",
+    "@sentry/nextjs": "^9.14.0",
     "@splinetool/react-spline": "^4.0.0",
     "@splinetool/runtime": "^1.9.28",
     "@tanstack/react-query": "^5.66.7",

pnpm-lock.yaml

@@ -0,0 +1,35 @@
+const SENTRY_HOST = 'o4504495959703552.ingest.us.sentry.io';
+const SENTRY_PROJECT_IDS = ['4504526099447808'];
+
+export const POST = async (req: Request) => {
+  try {
+    const envelopeBytes = await req.arrayBuffer();
+    const envelope = new TextDecoder().decode(envelopeBytes);
+    const piece = envelope.split('\n')[0];
+    const header = JSON.parse(piece);
+    const dsn = new URL(header['dsn']);
+    const project_id = dsn.pathname?.replace('/', '');
+
+    if (dsn.hostname !== SENTRY_HOST) {
+      throw new Error(`Invalid sentry hostname: ${dsn.hostname}`);
+    }
+
+    if (!project_id || !SENTRY_PROJECT_IDS.includes(project_id)) {
+      throw new Error(`Invalid sentry project id: ${project_id}`);
+    }
+
+    const upstream_sentry_url = `https://${SENTRY_HOST}/api/${project_id}/envelope/`;
+    await fetch(upstream_sentry_url, {
+      method: 'POST',
+      body: envelopeBytes,
+    });
+
+    return Response.json({}, { status: 200 });
+  } catch (e) {
+    console.error('error tunneling to sentry', e);
+    return Response.json(
+      { error: 'error tunneling to sentry' },
+      { status: 500 },
+    );
+  }
+};

sentry.client.config.ts

@@ -0,0 +1,49 @@
+import {
+  breadcrumbsIntegration,
+  browserApiErrorsIntegration,
+  BrowserClient,
+  captureRouterTransitionStart,
+  dedupeIntegration,
+  defaultStackParser,
+  eventFiltersIntegration,
+  getCurrentScope,
+  globalHandlersIntegration,
+  httpClientIntegration,
+  httpContextIntegration,
+  linkedErrorsIntegration,
+  makeFetchTransport,
+} from '@sentry/nextjs';
+
+const client = new BrowserClient({
+  dsn: 'https://d9c07cf404c1777bcf744cb901dfc7c2@o4504495959703552.ingest.us.sentry.io/4504526099447808',
+  tunnel: '/sentry-tunnel',
+  tracesSampleRate: 0,
+  replaysSessionSampleRate: 0,
+  replaysOnErrorSampleRate: 0,
+  debug: false,
+  transport: makeFetchTransport,
+  stackParser: defaultStackParser,
+  integrations: [
+    eventFiltersIntegration(),
+    breadcrumbsIntegration(),
+    globalHandlersIntegration(),
+    linkedErrorsIntegration(),
+    dedupeIntegration(),
+    browserApiErrorsIntegration(),
+    httpClientIntegration(),
+    httpContextIntegration(),
+  ],
+
+  denyUrls: [/extensions\//i, /^chrome:\/\//i, /^chrome-extension:\/\//i],
+  beforeSend(event) {
+    const hasStack = event.exception?.values?.some((e) => e.stacktrace);
+    return hasStack ? event : null;
+  },
+});
+
+if (process.env.NODE_ENV === 'production') {
+  getCurrentScope().setClient(client);
+  client.init();
+}
+
+export const onRouterTransitionStart = captureRouterTransitionStart;

sentry.edge.config.ts

@@ -1,9 +1,28 @@
+import * as Sentry from '@sentry/nextjs';
+
+const SENTRY_DSN =
+  'https://0d295254822c41989ea49baec3c31a6d@o4504495959703552.ingest.us.sentry.io/4504526099447808';
+
 export async function register() {
-  if (process.env.NEXT_RUNTIME === 'nodejs') {
-    await import('../sentry.server.config');
-  }
+  if (process.env.NODE_ENV !== 'production') return;
+
+  Sentry.init({
+    dsn: SENTRY_DSN,
+    tracesSampleRate: 1,
+    debug: false,
+    denyUrls: [/extensions\//i, /^chrome:\/\//i, /^chrome-extension:\/\//i],
+    beforeSend(event) {
+      const hasStackTrace = event?.exception?.values?.some(
+        (exceptionValue) => exceptionValue.stacktrace,
+      );
 
-  if (process.env.NEXT_RUNTIME === 'edge') {
-    await import('../sentry.edge.config');
-  }
+      if (!hasStackTrace) {
+        return null;
+      }
+
+      return event;
+    },
+  });
 }
+
+export const onRequestError = Sentry.captureRequestError;