feat: added sentry

.eslintrc.js

@@ -19,4 +19,5 @@ module.exports = {
   rules: {
     'react-hooks/rules-of-hooks': 'error',
   },
+  ignorePatterns: ['next.config.js'],
 };

.github/workflows/ci.yml

@@ -59,7 +59,7 @@ jobs:
 
       - name: Set up QEMU
         uses: docker/setup-qemu-action@v3
-      
+
       - name: Set up Docker Buildx
         uses: docker/setup-buildx-action@v3
 
@@ -88,6 +88,12 @@ jobs:
           platforms: ${{ github.ref == 'refs/heads/main' && 'linux/amd64,linux/arm64' ||  'linux/amd64'  }}
           tags: ${{ steps.docker_meta.outputs.tags }}
           labels: ${{ steps.docker_meta.outputs.labels }}
+          secrets: |
+            "sentry_auth_token=${{ secrets.SENTRY_AUTH_TOKEN }}"
+          build-args: |
+            RELEASE_TAG_NAME=${{ steps.semantic.outputs.new_release_version }}
+            NEXT_PUBLIC_SENTRY_DSN=${{ secrets.NEXT_PUBLIC_SENTRY_DSN }}
+            SENTRY_AUTH_TOKEN=${{ secrets.SENTRY_AUTH_TOKEN }}
 
       - name: Deployment Info
         run: 'echo "::warning::Will deploy docker tag/digest: ${{ steps.docker_meta.outputs.version }}/${{ steps.docker_push.outputs.digest }}"'

.gitignore

@@ -1,8 +1,9 @@
 dist/
 out/
 node_modules/
-tests/screenshots/*
+.env
 .env.local
+tests/screenshots/*
 .next
 .idea
 .DS_Store
@@ -15,7 +16,6 @@ yalc.lock
 .vercel
 yarn-error.log
 coverage
-.env
 
 # Sentry
 .sentryclirc

Dockerfile

@@ -1,22 +1,14 @@
+# First stage.  This stage is responsible for installing dependencies and building the application.
+# The output of this stage is a built version of your Next.js app, which includes all the static assets and optimized files that will be served to users.
 FROM node:18-alpine AS build
 
-ARG REDIS_URL
-ARG SENTRY_AUTH_TOKEN
-ARG SENTRY_DSN
-ARG SENTRY_LOG_LEVEL=warn
-ARG NODE_ENV=production
-ARG X_API_KEY
-ARG CMS_URL
 ARG RELEASE_TAG_NAME
+ENV NEXT_PUBLIC_RELEASE_TAG_NAME=${RELEASE_TAG_NAME}
 
-# Build args for browser variables
-ARG NEXT_PUBLIC_MAINNET_API_SERVER
-ARG NEXT_PUBLIC_TESTNET_API_SERVER
-ARG NEXT_PUBLIC_LEGACY_EXPLORER_API_SERVER
-ARG NEXT_PUBLIC_DEPLOYMENT_URL
-ARG NEXT_PUBLIC_MAINNET_ENABLED
-ARG NEXT_PUBLIC_DEFAULT_POLLING_INTERVAL
+ARG NEXT_PUBLIC_SENTRY_DSN
+ENV NEXT_PUBLIC_SENTRY_DSN=${NEXT_PUBLIC_SENTRY_DSN}
 
+ARG SENTRY_AUTH_TOKEN
 WORKDIR /app
 
 COPY . .
@@ -25,24 +17,17 @@ RUN npm install -g [email protected]
 RUN pnpm i
 RUN pnpm build
 
+# This stage creates the final Docker image that will be used in production. It only contains the necessary runtime environment and the built application files from the first stage.
 FROM node:18-alpine
 
-ARG REDIS_URL
-ARG SENTRY_AUTH_TOKEN
-ARG SENTRY_DSN
-ARG SENTRY_LOG_LEVEL=warn
 ARG NODE_ENV=production
-
-# Set ENVs so they persist after image is built
-ENV NEXT_SHARP_PATH=/tmp/node_modules/sharp
-ENV REDIS_URL=${REDIS_URL}
-ENV SENTRY_AUTH_TOKEN=${SENTRY_AUTH_TOKEN}
-ENV SENTRY_DSN=${SENTRY_DSN}
-ENV SENTRY_LOG_LEVEL=${SENTRY_LOG_LEVEL}
 ENV NODE_ENV=${NODE_ENV}
-ENV X_API_KEY=${X_API_KEY}
-ENV CMS_URL=${CMS_URL}
-ENV RELEASE_TAG_NAME=${RELEASE_TAG_NAME}
+
+ARG RELEASE_TAG_NAME
+ENV NEXT_PUBLIC_RELEASE_TAG_NAME=${RELEASE_TAG_NAME}
+
+ARG NEXT_PUBLIC_SENTRY_DSN
+ENV NEXT_PUBLIC_SENTRY_DSN=${NEXT_PUBLIC_SENTRY_DSN}
 
 WORKDIR /app
 

next.config.js

@@ -1,6 +1,7 @@
 const withBundleAnalyzer = require('@next/bundle-analyzer')({
   enabled: process.env.ANALYZE === 'true',
 });
+const { withSentryConfig } = require('@sentry/nextjs');
 
 const nextConfig = {
   output: 'standalone',
@@ -36,4 +37,45 @@ const nextConfig = {
   },
 };
 
-module.exports = withBundleAnalyzer(nextConfig);
+module.exports = withSentryConfig(withBundleAnalyzer(nextConfig), {
+  // For all available options, see:
+  // https://github.com/getsentry/sentry-webpack-plugin#options
+
+  org: 'hirosystems',
+  project: 'explorer',
+
+  uploadSourceMaps: true,
+
+  // Only print logs for uploading source maps in CI
+  // silent: !process.env.CI,
+  silent: false,
+
+  // 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,
+
+  // Uncomment to 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
+  // Does NOT prevent source maps from being generated or uploaded to Sentry.
+  hideSourceMaps: false,
+
+  // 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,
+
+  experimental: {
+    instrumentationHook: true,
+  },
+});

package.json

@@ -44,6 +44,7 @@
     "@react-spectrum/utils": "3.10.1",
     "@react-stately/toggle": "3.6.1",
     "@reduxjs/toolkit": "1.9.7",
+    "@sentry/nextjs": "8.26.0",
     "@stacks/auth": "6.15.0",
     "@stacks/blockchain-api-client": "7.12.0",
     "@stacks/common": "6.15.1-pr.0bcf867e.0+0bcf867e",