Update Sentry config (#911)

ooni · Mar 4, 2024 · da466cd · da466cd
1 parent 5130a14
commit da466cd
Show file tree

Hide file tree

Showing 12 changed files with 327 additions and 432 deletions.
diff --git a/.env.production b/.env.production
@@ -4,5 +4,5 @@
 
 NEXT_PUBLIC_OONI_API=https://api.ooni.io
 NEXT_PUBLIC_USER_FEEDBACK_API=https://api.ooni.io
-NEXT_PUBLIC_SENTRY_DSN=https://[email protected]/1427510
+NEXT_PUBLIC_SENTRY_DSN=https://[email protected].us.sentry.io/1427510
 NEXT_PUBLIC_EXPLORER_URL=https://explorer.ooni.org
diff --git a/.gitignore b/.gitignore
@@ -11,8 +11,5 @@ cypress/screenshots
 .yalc
 yalc.lock
 
-# Sentry
-.sentryclirc
-
-# Sentry
+# Sentry Config File
 .sentryclirc
diff --git a/components/FeedbackFloat.js b/components/FeedbackFloat.js
diff --git a/next.config.js b/next.config.js
@@ -7,13 +7,6 @@ const glob = require('glob')
 const { dirname, basename, resolve } = require('path')
 const { execSync } = require('child_process')
 
-const SentryWebpackPluginOptions = {
-  // https://github.com/getsentry/sentry-webpack-plugin#options
-  debug: process.env.NODE_ENV === 'development',
-  dryRun: process.env.NODE_ENV === 'development',
-  release: process.env.GIT_COMMIT_SHA,
-  silent: false,
-}
 
 const LANG_DIR = './public/static/lang/'
 const DEFAULT_LOCALE = 'en'
@@ -27,96 +20,126 @@ function getSupportedLanguages() {
   return [...supportedLanguages]
 }
 
-module.exports = withSentryConfig({
-  output: 'standalone',
-  async redirects() {
-    return [
-      {
-        source: '/experimental/mat',
-        destination: '/chart/mat',
-        permanent: true,
+module.exports = withSentryConfig(
+  {
+    output: 'standalone',
+    async redirects() {
+      return [
+        {
+          source: '/experimental/mat',
+          destination: '/chart/mat',
+          permanent: true,
+        },
+      ]
+    },
+    compiler: {
+      // see https://styled-components.com/docs/tooling#babel-plugin for more info on the options.
+      styledComponents: {
+        ssr: true,
       },
-    ]
-  },
-  compiler: {
-    // see https://styled-components.com/docs/tooling#babel-plugin for more info on the options.
-    styledComponents: {
-      ssr: true,
     },
+    i18n: {
+      locales: getSupportedLanguages(),
+      defaultLocale: DEFAULT_LOCALE,
+    },
+    webpack: (config, options) => {
+      const gitCommitSHAShort = process.env.RUN_GIT_COMMIT_SHA_SHORT ? execSync(process.env.RUN_GIT_COMMIT_SHA_SHORT) : ''
+      const gitCommitSHA = process.env.RUN_GIT_COMMIT_SHA ? execSync(process.env.RUN_GIT_COMMIT_SHA) : ''
+      const gitCommitRef = process.env.RUN_GIT_COMMIT_REF ? execSync(process.env.RUN_GIT_COMMIT_REF) : ''
+      const gitCommitTags = process.env.RUN_GIT_COMMIT_TAGS ? execSync(process.env.RUN_GIT_COMMIT_TAGS) : ''
+
+      config.plugins.push(
+        new options.webpack.DefinePlugin({
+          'process.env.GIT_COMMIT_SHA_SHORT': JSON.stringify(
+            gitCommitSHAShort.toString()
+          ),
+          'process.env.GIT_COMMIT_SHA': JSON.stringify(gitCommitSHA.toString()),
+          'process.env.GIT_COMMIT_REF': JSON.stringify(gitCommitRef.toString()),
+          'process.env.GIT_COMMIT_TAGS': JSON.stringify(
+            gitCommitTags.toString()
+          ),
+          'process.env.DEFAULT_LOCALE': DEFAULT_LOCALE,
+          'process.env.LOCALES': JSON.stringify(getSupportedLanguages()),
+          'process.env.WDYR': JSON.stringify(process.env.WDYR),
+        })
+      )
+
+      // SVG
+      // Grab the existing rule that handles SVG imports
+      const fileLoaderRule = config.module.rules.find((rule) =>
+        rule.test?.test?.('.svg'),
+      )
+
+      config.module.rules.push(
+        // Convert all *.svg imports to React components
+        {
+          test: /\.svg$/i,
+          issuer: /\.[jt]sx?$/,
+          use: ['@svgr/webpack'],
+        },
+      )
+
+      // Modify the file loader rule to ignore *.svg, since we have it handled
+      fileLoaderRule.exclude = /\.svg$/i
+
+      // whyDidYouRender
+      if (options.dev && !options.isServer) {
+        const originalEntry = config.entry
+        config.entry = async () => {
+          const wdrPath = resolve(__dirname, './scripts/wdyr.js')
+          const entries = await originalEntry()
+          if (entries['main.js'] && !entries['main.js'].includes(wdrPath)) {
+            entries['main.js'].unshift(wdrPath)
+          }
+          return entries
+        }
+      }
+
+      if (!options.isServer) {
+        config.resolve.fallback = {
+          ...config.resolve.fallback,  
+          fs: false,
+        }
+      }
+
+      return config
+    },
+    productionBrowserSourceMaps: true,
   },
-  i18n: {
-    locales: getSupportedLanguages(),
-    defaultLocale: DEFAULT_LOCALE,
+  {
+    // For all available options, see:
+    // https://github.com/getsentry/sentry-webpack-plugin#options
+    debug: process.env.NODE_ENV === 'development',
+    dryRun: process.env.NODE_ENV === 'development',
+    release: process.env.GIT_COMMIT_SHA,
+    // Suppresses source map uploading logs during build
+    silent: true,
+    org: "ooni",
+    project: "explorer",
   },
-  webpack: (config, options) => {
-    const gitCommitSHAShort = process.env.RUN_GIT_COMMIT_SHA_SHORT ? execSync(process.env.RUN_GIT_COMMIT_SHA_SHORT) : ''
-    const gitCommitSHA = process.env.RUN_GIT_COMMIT_SHA ? execSync(process.env.RUN_GIT_COMMIT_SHA) : ''
-    const gitCommitRef = process.env.RUN_GIT_COMMIT_REF ? execSync(process.env.RUN_GIT_COMMIT_REF) : ''
-    const gitCommitTags = process.env.RUN_GIT_COMMIT_TAGS ? execSync(process.env.RUN_GIT_COMMIT_TAGS) : ''
+  {
+    // For all available options, see:
+    // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
 
-    config.plugins.push(
-      new options.webpack.DefinePlugin({
-        'process.env.GIT_COMMIT_SHA_SHORT': JSON.stringify(
-          gitCommitSHAShort.toString()
-        ),
-        'process.env.GIT_COMMIT_SHA': JSON.stringify(gitCommitSHA.toString()),
-        'process.env.GIT_COMMIT_REF': JSON.stringify(gitCommitRef.toString()),
-        'process.env.GIT_COMMIT_TAGS': JSON.stringify(
-          gitCommitTags.toString()
-        ),
-        'process.env.DEFAULT_LOCALE': DEFAULT_LOCALE,
-        'process.env.LOCALES': JSON.stringify(getSupportedLanguages()),
-        'process.env.WDYR': JSON.stringify(process.env.WDYR),
-      })
-    )
-
-    // SVG
-    // Grab the existing rule that handles SVG imports
-    const fileLoaderRule = config.module.rules.find((rule) =>
-      rule.test?.test?.('.svg'),
-    )
+    // Upload a larger set of source maps for prettier stack traces (increases build time)
+    widenClientFileUpload: true,
 
-    config.module.rules.push(
-      // Convert all *.svg imports to React components
-      {
-        test: /\.svg$/i,
-        issuer: /\.[jt]sx?$/,
-        use: ['@svgr/webpack'],
-      },
-    )
+    // Transpiles SDK to be compatible with IE11 (increases bundle size)
+    transpileClientSDK: true,
 
-    // Modify the file loader rule to ignore *.svg, since we have it handled
-    fileLoaderRule.exclude = /\.svg$/i
+    // Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load)
+    tunnelRoute: "/monitoring",
 
-    // whyDidYouRender
-    if (options.dev && !options.isServer) {
-      const originalEntry = config.entry
-      config.entry = async () => {
-        const wdrPath = resolve(__dirname, './scripts/wdyr.js')
-        const entries = await originalEntry()
-        if (entries['main.js'] && !entries['main.js'].includes(wdrPath)) {
-          entries['main.js'].unshift(wdrPath)
-        }
-        return entries
-      }
-    }
+    // Hides source maps from generated client bundles
+    hideSourceMaps: true,
 
-    if (!options.isServer) {
-      config.resolve.fallback = {
-        ...config.resolve.fallback,  
-        fs: false,
-      }
-    }
+    // Automatically tree-shake Sentry logger statements to reduce bundle size
+    disableLogger: true,
 
-    return config
-  },
-  productionBrowserSourceMaps: true,
-  // disable the webpack plugins for client and server until the
-  // release mechanism is clear. At this point, there no need to
-  // upload sourcemaps for every single `next build` that happens
-  // e.g during E2E testing and vercel preview deployments.
-  sentry: {
-    disableClientWebpackPlugin: true,
-    disableServerWebpackPlugin: true
+    // Enables automatic instrumentation of Vercel Cron Monitors.
+    // See the following for more information:
+    // https://docs.sentry.io/product/crons/
+    // https://vercel.com/docs/cron-jobs
+    automaticVercelMonitors: true,
   }
-}, SentryWebpackPluginOptions)
+);
diff --git a/package.json b/package.json
@@ -15,7 +15,7 @@
     "@nivo/heatmap": "^0.80.0",
     "@nivo/line": "^0.80.0",
     "@nivo/tooltip": "0.80.0",
-    "@sentry/nextjs": "^7.93.0",
+    "@sentry/nextjs": "^7.104.0",
     "@tanstack/react-table": "^8.11.6",
     "axios": "^1.6.5",
     "buffer-from": "^1.1.2",
@@ -28,7 +28,7 @@
     "lodash.debounce": "^4.0.8",
     "lru-cache": "^10.1.0",
     "markdown-to-jsx": "^7.4.0",
-    "next": "^14.0.4",
+    "next": "^14.1.0",
     "nprogress": "^0.2.0",
     "ooni-components": "^0.6.0-alpha.5",
     "pretty-ms": "^8.0.0",

diff --git a/pages/_error.js b/pages/_error.js
@@ -1,5 +1,5 @@
-import NextErrorComponent from 'next/error'
 import * as Sentry from '@sentry/nextjs'
+import NextErrorComponent from 'next/error'
 
 const ErrorPage = (props) => (
   <NextErrorComponent statusCode={props.statusCode} title={props.error} />

diff --git a/sentry.client.config.js b/sentry.client.config.js
@@ -1,5 +1,5 @@
-// This file configures the initialization of Sentry on the browser.
-// The config you add here will be used whenever a page is visited.
+// This file configures the initialization of Sentry on the client.
+// The config you add here will be used whenever a users loads a page in their browser.
 // https://docs.sentry.io/platforms/javascript/guides/nextjs/
 
 import * as Sentry from '@sentry/nextjs'
@@ -13,11 +13,19 @@ Sentry.init({
     /^ResizeObserver loop completed with undelivered notifications.$/
   ],
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1.0,
-  replaysSessionSampleRate: 0.1,
+  tracesSampleRate: 1,
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
   replaysOnErrorSampleRate: 1.0,
-  // ...
-  // Note: if you want to override the automatic release value, do not set a
-  // `release` value here - use the environment variable `SENTRY_RELEASE`, so
-  // that it will also get attached to your source maps
+  // This sets the sample rate to be 10%. You may want this to be 100% while
+  // in development and sample at a lower rate in production
+  replaysSessionSampleRate: 0.1,
+  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
+  // integrations: [
+  //   Sentry.replayIntegration({
+  //     // Additional Replay configuration goes in here, for example:
+  //     maskAllText: true,
+  //     blockAllMedia: true,
+  //   }),
+  // ],
 })
diff --git a/sentry.edge.config.js b/sentry.edge.config.js
@@ -1,18 +1,16 @@
+// This file configures the initialization of Sentry for edge features (middleware, edge routes, and so on).
+// The config you add here will be used whenever one of the edge features is loaded.
+// Note that this config is unrelated to the Vercel Edge Runtime and is also required when running locally.
+// https://docs.sentry.io/platforms/javascript/guides/nextjs/
+
 import * as Sentry from '@sentry/nextjs'
 
 const SENTRY_DSN = process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN
 
 Sentry.init({
   dsn: SENTRY_DSN,
-
-  // Set tracesSampleRate to 1.0 to capture 100%
-  // of transactions for performance monitoring.
-  // We recommend adjusting this value in production
-  tracesSampleRate: 1.0,
-
-  // ...
-
-  // Note: if you want to override the automatic release value, do not set a
-  // `release` value here - use the environment variable `SENTRY_RELEASE`, so
-  // that it will also get attached to your source maps
-})
+  // Adjust this value in production, or use tracesSampler for greater control
+  tracesSampleRate: 1,
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
+})
diff --git a/sentry.properties b/sentry.properties
diff --git a/sentry.server.config.js b/sentry.server.config.js
@@ -9,9 +9,7 @@ const SENTRY_DSN = process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN
 Sentry.init({
   dsn: SENTRY_DSN,
   // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 1.0,
-  // ...
-  // Note: if you want to override the automatic release value, do not set a
-  // `release` value here - use the environment variable `SENTRY_RELEASE`, so
-  // that it will also get attached to your source maps
+  tracesSampleRate: 1,
+  // Setting this option to true will print useful information to the console while you're setting up Sentry.
+  debug: false,
 })