feat: sentry setup

.env.example

@@ -3,4 +3,5 @@ NEXT_PUBLIC_TRANSAK_ENVIRONMENT=""
 NEXT_PUBLIC_ARCHER_API_KEY=""
 NEXT_PUBLIC_CLOUDINARY_URL=""
 NEXT_PUBLIC_GOOGLE_ANALYTICS=""
-NEXT_PUBLIC_INTO_THE_BLOCK_API_KEY=""
+NEXT_PUBLIC_INTO_THE_BLOCK_API_KEY=""
+NEXT_PUBLIC_SENTRY_DSN=""

next.config.js

@@ -9,162 +9,183 @@ const withBundleAnalyzer = require('@next/bundle-analyzer')({
   enabled: process.env.ANALYZE === 'true',
 })
 
-module.exports = withBundleAnalyzer(
-  withPWA({
-    webpack: (config) => {
-      config.module.rules = [
-        ...config.module.rules,
-        {
-          resourceQuery: /raw-lingui/,
-          type: 'javascript/auto',
-        },
-      ]
+// This file sets a custom webpack configuration to use your Next.js app
+// with Sentry.
+// https://nextjs.org/docs/api-reference/next.config.js/introduction
+// https://docs.sentry.io/platforms/javascript/guides/nextjs/
 
-      return config
-    },
-    experimental: { esmExternals: true },
-    pwa: {
-      dest: 'public',
-      runtimeCaching,
-      disable: process.env.NODE_ENV === 'development',
-    },
-    images: {
-      domains: ['assets.sushi.com', 'res.cloudinary.com', 'raw.githubusercontent.com', 'logos.covalenthq.com'],
-    },
-    reactStrictMode: true,
-    async redirects() {
-      return [
-        {
-          source: '/',
-          destination: '/swap',
-          permanent: true,
-        },
-        {
-          source: '/zap',
-          destination: '/',
-          permanent: true,
-        },
-        {
-          source: '/yield',
-          destination: '/farm',
-          permanent: true,
-        },
-        {
-          source: '/bento',
-          destination: '/bentobox',
-          permanent: true,
-        },
-        {
-          source: '/bento/kashi',
-          destination: '/lend',
-          permanent: true,
-        },
-        // Analytics
-        {
-          source: '/analytics',
-          destination: '/analytics/dashboard',
-          permanent: true,
-        },
-        {
-          source: '/portfolio',
-          destination: '/analytics/portfolio',
-          permanent: true,
-        },
-      ]
-    },
-    async rewrites() {
-      return [
-        {
-          source: '/stake',
-          destination: '/bar',
-        },
-        {
-          source: '/add/:token*',
-          destination: '/exchange/add/:token*',
-        },
-        {
-          source: '/remove/:token*',
-          destination: '/exchange/remove/:token*',
-        },
-        {
-          source: '/create/:token*',
-          destination: '/exchange/add/:token*',
-        },
-        {
-          source: '/swap',
-          destination: '/exchange/swap',
-        },
-        {
-          source: '/swap/:token*',
-          destination: '/exchange/swap/:token*',
-        },
-        {
-          source: '/limit-order',
-          destination: '/exchange/limit-order',
-        },
-        {
-          source: '/limit-order/:token*',
-          destination: '/exchange/limit-order/:token*',
-        },
-        {
-          source: '/open-order',
-          destination: '/exchange/open-order',
-        },
-        {
-          source: '/migrate',
-          destination: '/exchange/migrate',
-        },
-        {
-          source: '/pool',
-          destination: '/exchange/pool',
-        },
-        {
-          source: '/find',
-          destination: '/exchange/find',
-        },
-        // Kashi
-        {
-          source: '/borrow',
-          destination: '/kashi/borrow',
-        },
-        {
-          source: '/borrow/:token*',
-          destination: '/kashi/borrow/:token*',
-        },
-        {
-          source: '/lend',
-          destination: '/kashi/lend',
-        },
-        {
-          source: '/lend/:token*',
-          destination: '/kashi/lend/:token*',
-        },
-        // Onsen
-        // {
-        //   source: '/farm',
-        //   destination: '/onsen',
-        // },
-        // {
-        //   source: '/farm/:type*',
-        //   destination: '/onsen/:type*',
-        // },
-        {
-          source: '/me',
-          destination: '/user',
-        },
-        {
-          source: '/balances',
-          destination: '/user/balances',
-        },
-      ]
-    },
-    i18n: {
-      localeDetection: true,
-      locales,
-      defaultLocale: sourceLocale,
-    },
-  })
-)
+const { withSentryConfig } = require('@sentry/nextjs')
+
+const nextConfig = {
+  webpack: (config) => {
+    config.module.rules = [
+      ...config.module.rules,
+      {
+        resourceQuery: /raw-lingui/,
+        type: 'javascript/auto',
+      },
+    ]
+
+    return config
+  },
+  experimental: { esmExternals: true },
+  pwa: {
+    dest: 'public',
+    runtimeCaching,
+    disable: process.env.NODE_ENV === 'development',
+  },
+  images: {
+    domains: ['assets.sushi.com', 'res.cloudinary.com', 'raw.githubusercontent.com', 'logos.covalenthq.com'],
+  },
+  reactStrictMode: true,
+  async redirects() {
+    return [
+      {
+        source: '/',
+        destination: '/swap',
+        permanent: true,
+      },
+      {
+        source: '/zap',
+        destination: '/',
+        permanent: true,
+      },
+      {
+        source: '/yield',
+        destination: '/farm',
+        permanent: true,
+      },
+      {
+        source: '/bento',
+        destination: '/bentobox',
+        permanent: true,
+      },
+      {
+        source: '/bento/kashi',
+        destination: '/lend',
+        permanent: true,
+      },
+      // Analytics
+      {
+        source: '/analytics',
+        destination: '/analytics/dashboard',
+        permanent: true,
+      },
+      {
+        source: '/portfolio',
+        destination: '/analytics/portfolio',
+        permanent: true,
+      },
+    ]
+  },
+  async rewrites() {
+    return [
+      {
+        source: '/stake',
+        destination: '/bar',
+      },
+      {
+        source: '/add/:token*',
+        destination: '/exchange/add/:token*',
+      },
+      {
+        source: '/remove/:token*',
+        destination: '/exchange/remove/:token*',
+      },
+      {
+        source: '/create/:token*',
+        destination: '/exchange/add/:token*',
+      },
+      {
+        source: '/swap',
+        destination: '/exchange/swap',
+      },
+      {
+        source: '/swap/:token*',
+        destination: '/exchange/swap/:token*',
+      },
+      {
+        source: '/limit-order',
+        destination: '/exchange/limit-order',
+      },
+      {
+        source: '/limit-order/:token*',
+        destination: '/exchange/limit-order/:token*',
+      },
+      {
+        source: '/open-order',
+        destination: '/exchange/open-order',
+      },
+      {
+        source: '/migrate',
+        destination: '/exchange/migrate',
+      },
+      {
+        source: '/pool',
+        destination: '/exchange/pool',
+      },
+      {
+        source: '/find',
+        destination: '/exchange/find',
+      },
+      // Kashi
+      {
+        source: '/borrow',
+        destination: '/kashi/borrow',
+      },
+      {
+        source: '/borrow/:token*',
+        destination: '/kashi/borrow/:token*',
+      },
+      {
+        source: '/lend',
+        destination: '/kashi/lend',
+      },
+      {
+        source: '/lend/:token*',
+        destination: '/kashi/lend/:token*',
+      },
+      // Onsen
+      // {
+      //   source: '/farm',
+      //   destination: '/onsen',
+      // },
+      // {
+      //   source: '/farm/:type*',
+      //   destination: '/onsen/:type*',
+      // },
+      {
+        source: '/me',
+        destination: '/user',
+      },
+      {
+        source: '/balances',
+        destination: '/user/balances',
+      },
+    ]
+  },
+  i18n: {
+    localeDetection: true,
+    locales,
+    defaultLocale: sourceLocale,
+  },
+}
+
+const SentryWebpackPluginOptions = {
+  // Additional config options for the Sentry Webpack plugin. Keep in mind that
+  // the following options are set automatically, and overriding them is not
+  // recommended:
+  //   release, url, org, project, authToken, configFile, stripPrefix,
+  //   urlPrefix, include, ignore
+
+  silent: true, // Suppresses all logs
+  // For all available options, see:
+  // https://github.com/getsentry/sentry-webpack-plugin#options.
+}
+
+// Make sure adding Sentry options is the last code to run before exporting, to
+// ensure that your source maps include changes from all other Webpack plugins
+module.exports = withSentryConfig(withPWA(nextConfig), SentryWebpackPluginOptions)
 
 // Don't delete this console log, useful to see the config in Vercel deployments
 console.log('next.config.js', JSON.stringify(module.exports, null, 2))

package.json

@@ -57,6 +57,7 @@
     "@ramp-network/ramp-instant-sdk": "^2.4.6",
     "@reach/dialog": "^0.15.2",
     "@reduxjs/toolkit": "^1.6.0",
+    "@sentry/nextjs": "^6.11.0",
     "@sushiswap/chainlink-whitelist": "0.2.2",
     "@sushiswap/core": "2.0.0-canary.0",
     "@sushiswap/default-token-list": "14.1.0",
@@ -142,6 +143,7 @@
     "redux-localstorage-simple": "^2.4.1",
     "redux-persist": "^6.0.0",
     "serve": "^12.0.0",
+    "sharp": "^0.29.0",
     "start-server-and-test": "1.13.1",
     "styled-components": "^5.3.0",
     "swr": "^0.5.6",

sentry.client.config.js

@@ -0,0 +1,17 @@
+// This file configures the initialization of Sentry on the browser.
+// The config you add here will be used whenever a page is visited.
+// 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,
+  // 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
+})

sentry.properties

@@ -0,0 +1,5 @@
+defaults.url=https://sentry.io/
+defaults.org=sushi-j9
+defaults.project=sushiswap-interface
+auth.token=7e784089c5ee4f03a278173c6922948ec810f334403f4353a515a637621098c7
+cli.executable=../.npm/_npx/a8388072043b4cbc/node_modules/@sentry/cli/bin/sentry-cli