lay the ground work for sentry integration

client/.gitignore

@@ -40,3 +40,6 @@ __ENV.js
 
 # next-sitemap
 sitemap*.xml
+
+# sentry
+.sentryclirc

client/next.config.js

@@ -1,5 +1,6 @@
 const { version } = require('../package.json');
 const { i18n } = require('./next-i18next.config');
+const { withSentryConfig } = require('@sentry/nextjs');
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
@@ -15,6 +16,11 @@ const nextConfig = {
     domains: ['cdn.rxresu.me', 'www.gravatar.com'],
   },
 
+  sentry: {
+    hideSourceMaps: true,
+    widenClientFileUpload: true,
+  },
+
   // Hack to make Tailwind darkMode 'class' strategy with CSS Modules
   // Ref: https://github.com/tailwindlabs/tailwindcss/issues/3258#issuecomment-968368156
   webpack: (config) => {
@@ -47,4 +53,10 @@ const nextConfig = {
   },
 };
 
-module.exports = nextConfig;
+/** @type {import('@sentry/nextjs').SentryWebpackPluginOptions} */
+const sentryConfig = {
+  silent: true,
+  dryRun: process.env.NODE_ENV !== 'production',
+};
+
+module.exports = withSentryConfig(nextConfig, sentryConfig);

client/package.json

@@ -24,6 +24,7 @@
     "@next/env": "^13.0.5",
     "@react-oauth/google": "^0.5.0",
     "@reduxjs/toolkit": "^1.9.0",
+    "@sentry/nextjs": "^7.21.1",
     "axios": "^1.2.0",
     "clsx": "^1.2.1",
     "dayjs": "^1.11.6",

client/pages/_error.tsx

@@ -0,0 +1,14 @@
+import * as Sentry from '@sentry/nextjs';
+import type { NextPage } from 'next';
+import type { ErrorProps } from 'next/error';
+import NextErrorComponent from 'next/error';
+
+const CustomErrorComponent: NextPage<ErrorProps> = (props) => <NextErrorComponent statusCode={props.statusCode} />;
+
+CustomErrorComponent.getInitialProps = async (contextData) => {
+  await Sentry.captureUnderscoreErrorException(contextData);
+
+  return NextErrorComponent.getInitialProps(contextData);
+};
+
+export default CustomErrorComponent;

client/sentry.client.config.ts

@@ -0,0 +1,14 @@
+import env from '@beam-australia/react-env';
+import * as Sentry from '@sentry/nextjs';
+
+const SENTRY_DSN = env('CLIENT_SENTRY_DSN');
+
+console.log(SENTRY_DSN);
+
+if (SENTRY_DSN) {
+  Sentry.init({
+    dsn: SENTRY_DSN,
+    tracesSampleRate: 1.0,
+    enabled: process.env.NODE_ENV === 'production',
+  });
+}

client/sentry.properties

@@ -0,0 +1,3 @@
+defaults.url=https://sentry.io/
+defaults.org=reactive-resume
+defaults.project=client

client/sentry.server.config.ts

@@ -0,0 +1,12 @@
+import env from '@beam-australia/react-env';
+import * as Sentry from '@sentry/nextjs';
+
+const SENTRY_DSN = env('CLIENT_SENTRY_DSN');
+
+if (SENTRY_DSN) {
+  Sentry.init({
+    dsn: SENTRY_DSN,
+    tracesSampleRate: 1.0,
+    enabled: process.env.NODE_ENV === 'production',
+  });
+}