feat: add back sentry to new docs

.gitignore

@@ -26,3 +26,6 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+
+# Sentry
+.sentryclirc

next.config.js

@@ -1,3 +1,17 @@
+const { withSentryConfig } = require('@sentry/nextjs');
+
+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.
+};
+
 const withNextra = require('nextra')({
   theme: 'nextra-theme-docs',
   themeConfig: './theme.config.tsx',
@@ -20,6 +34,15 @@ const config = {
     // Disable type checking since eslint handles this
     ignoreBuildErrors: true,
   },
+  sentry: {
+    // Use `hidden-source-map` rather than `source-map` as the Webpack `devtool`
+    // for client-side builds. (This will be the default starting in
+    // `@sentry/nextjs` version 8.0.0.) See
+    // https://webpack.js.org/configuration/devtool/ and
+    // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/#use-hidden-source-map
+    // for more information.
+    hideSourceMaps: true,
+  },
   async redirects() {
     return [
       {
@@ -64,5 +87,8 @@ if (process.env.NODE_ENV === 'development') {
   const withBundleAnalyzer = require('@next/bundle-analyzer')({
     enabled: process.env.ANALYZE === 'true',
   });
-  module.exports = withBundleAnalyzer(withNextra(config));
+  module.exports = withSentryConfig(
+    withBundleAnalyzer(withNextra(config)),
+    sentryWebpackPluginOptions,
+  );
 }

package.json

@@ -13,6 +13,7 @@
     "@livepeer/react": "^2.0.0",
     "@rainbow-me/rainbowkit": "^0.8.0",
     "@reach/skip-nav": "^0.18.0",
+    "@sentry/nextjs": "^7.31.1",
     "@tanstack/react-query": "4.19.1",
     "@typescript-eslint/eslint-plugin": "^5.46.1",
     "aptos": "^1.4.0",

pages/_error.tsx

@@ -0,0 +1,39 @@
+/**
+ * NOTE: This requires `@sentry/nextjs` version 7.3.0 or higher.
+ *
+ * NOTE: If using this with `next` version 12.2.0 or lower, uncomment the
+ * penultimate line in `CustomErrorComponent`.
+ *
+ * This page is loaded by Nextjs:
+ *  - on the server, when data-fetching methods throw or reject
+ *  - on the client, when `getInitialProps` throws or rejects
+ *  - on the client, when a React lifecycle method throws or rejects, and it's
+ *    caught by the built-in Nextjs error boundary
+ *
+ * See:
+ *  - https://nextjs.org/docs/basic-features/data-fetching/overview
+ *  - https://nextjs.org/docs/api-reference/data-fetching/get-initial-props
+ *  - https://reactjs.org/docs/error-boundaries.html
+ */
+
+import * as Sentry from '@sentry/nextjs';
+import NextErrorComponent from 'next/error';
+
+const CustomErrorComponent = (props: any) => {
+  // If you're using a Nextjs version prior to 12.2.1, uncomment this to
+  // compensate for https://github.com/vercel/next.js/issues/8592
+  // Sentry.captureUnderscoreErrorException(props);
+
+  return <NextErrorComponent statusCode={props.statusCode} />;
+};
+
+CustomErrorComponent.getInitialProps = async (contextData: any) => {
+  // In case this is running in a serverless function, await this in order to give Sentry
+  // time to send the error before the lambda exits
+  await Sentry.captureUnderscoreErrorException(contextData);
+
+  // This will contain the status code of the response
+  return NextErrorComponent.getInitialProps(contextData);
+};
+
+export default CustomErrorComponent;