fix: add sourcemaps build

.github/workflows/build.yml

@@ -28,4 +28,4 @@ jobs:
         run: yarn install --frozen-lockfile
 
       - name: Run build check
-        run: yarn build
+        run: yarn build 

Dockerfile

@@ -39,7 +39,9 @@ ARG VITE_APP_GEYSER_NOSTR_PUBKEY
 ARG VITE_APP_ENV
 ARG VITE_APP_AUTH_SERVICE_ENDPOINT
 ARG VITE_APP_BOLTZ_SWAP_DOMAIN
-RUN /bin/sh -c "printenv > .env && NODE_OPTIONS=--max-old-space-size=8192 yarn build"
+ARG CI
+ARG SENTRY_AUTH_TOKEN
+RUN /bin/sh -c "printenv > .env && NODE_OPTIONS=--max-old-space-size=8192 yarn build --sourcemap=true"
 RUN rm -rf ./src
 
 ###########################

ci/prod/cloudbuild.yaml

@@ -39,13 +39,15 @@ steps:
         --build-arg VITE_APP_GIPHY_API_KEY=$$GIPHY_API_KEY \
         --build-arg VITE_APP_GEYSER_NOSTR_PUBKEY=$$GEYSER_NOSTR_PUBKEY \
         --build-arg VITE_APP_ENV=${_VITE_APP_ENV} \
+        --build-arg SENTRY_AUTH_TOKEN=$$SENTRY_AUTH_TOKEN \
+        --build-arg CI=${_CI} \
         --cache-from us-central1-docker.pkg.dev/$PROJECT_ID/geyser-docker-repo/${_SERVICE_NAME}:dependencies \
         --cache-from us-central1-docker.pkg.dev/$PROJECT_ID/geyser-docker-repo/${_SERVICE_NAME}:latest . \
         && \
         docker push us-central1-docker.pkg.dev/$PROJECT_ID/geyser-docker-repo/${_SERVICE_NAME}:latest \
         && \
         docker push us-central1-docker.pkg.dev/$PROJECT_ID/geyser-docker-repo/${_SERVICE_NAME}:$COMMIT_SHA
-    secretEnv: ['FLODESK_API_KEY', 'GIPHY_API_KEY', 'GEYSER_NOSTR_PUBKEY']
+    secretEnv: ['FLODESK_API_KEY', 'GIPHY_API_KEY', 'GEYSER_NOSTR_PUBKEY', 'SENTRY_AUTH_TOKEN']
   # Deploy container image to Cloud Run
   - name: 'gcr.io/google.com/cloudsdktool/cloud-sdk'
     entrypoint: gcloud
@@ -73,4 +75,6 @@ availableSecrets:
       env: 'GIPHY_API_KEY'
     - versionName: projects/$PROJECT_ID/secrets/geyser-nostr-pubkey/versions/1
       env: 'GEYSER_NOSTR_PUBKEY'
+    - versionName: projects/$PROJECT_ID/secrets/sentry-auth-token/versions/1
+      env: 'SENTRY_AUTH_TOKEN'
 timeout: 1800s

ci/staging/cloudbuild.yaml

@@ -38,13 +38,15 @@ steps:
         --build-arg VITE_APP_GIPHY_API_KEY=$$GIPHY_API_KEY \
         --build-arg VITE_APP_GEYSER_NOSTR_PUBKEY=$$GEYSER_NOSTR_PUBKEY \
         --build-arg VITE_APP_ENV=${_VITE_APP_ENV} \
+        --build-arg SENTRY_AUTH_TOKEN=$$SENTRY_AUTH_TOKEN \
+        --build-arg CI=${_CI} \
         --cache-from us-central1-docker.pkg.dev/$PROJECT_ID/geyser-docker-repo/${_SERVICE_NAME}:dependencies \
         --cache-from us-central1-docker.pkg.dev/$PROJECT_ID/geyser-docker-repo/${_SERVICE_NAME}:latest . \
         && \
         docker push us-central1-docker.pkg.dev/$PROJECT_ID/geyser-docker-repo/${_SERVICE_NAME}:latest \
         && \
         docker push us-central1-docker.pkg.dev/$PROJECT_ID/geyser-docker-repo/${_SERVICE_NAME}:$COMMIT_SHA
-    secretEnv: ['FLODESK_API_KEY', 'GIPHY_API_KEY', 'GEYSER_NOSTR_PUBKEY']
+    secretEnv: ['FLODESK_API_KEY', 'GIPHY_API_KEY', 'GEYSER_NOSTR_PUBKEY', 'SENTRY_AUTH_TOKEN']
   # Deploy container image to Cloud Run
   - name: 'gcr.io/google.com/cloudsdktool/cloud-sdk'
     entrypoint: gcloud
@@ -70,4 +72,6 @@ availableSecrets:
       env: 'GIPHY_API_KEY'
     - versionName: projects/$PROJECT_ID/secrets/geyser-nostr-pubkey/versions/2
       env: 'GEYSER_NOSTR_PUBKEY'
-timeout: 1800s
+    - versionName: projects/$PROJECT_ID/secrets/sentry-auth-token/versions/1
+      env: 'SENTRY_AUTH_TOKEN'
+timeout: 3600s

package.json

@@ -42,7 +42,7 @@
     "@remirror/react": "^2.0.28",
     "@remirror/react-components": "^2.1.12",
     "@remirror/react-editors": "^1.0.33",
-    "@sentry/react": "^7.50.0",
+    "@sentry/react": "^8.3.0",
     "@types/yup": "^0.32.0",
     "@vulpemventures/secp256k1-zkp": "^3.2.1",
     "bech32": "^2.0.0",
@@ -126,6 +126,7 @@
     "@graphql-codegen/typescript-react-apollo": "^4.3.0",
     "@graphql-codegen/typescript-resolvers": "^4.0.6",
     "@parcel/watcher": "^2.4.1",
+    "@sentry/vite-plugin": "^2.17.0",
     "@storybook/addon-essentials": "^8.0.4",
     "@storybook/addon-interactions": "^8.0.4",
     "@storybook/addon-links": "^8.0.4",

src/config/routes/routes.tsx

@@ -1,4 +1,4 @@
-import { createBrowserRouter, Navigate, RouteObject } from 'react-router-dom'
+import { Navigate, RouteObject } from 'react-router-dom'
 
 import { App } from '../../App'
 import { AppLayout } from '../../AppLayout'
@@ -466,7 +466,7 @@ export const platformRoutes: RouteObject[] = [
   },
 ]
 
-export const router = createBrowserRouter([
+export const routes: RouteObject[] = [
   {
     path: '/',
     Component: App,
@@ -480,4 +480,4 @@ export const router = createBrowserRouter([
       },
     ],
   },
-])
+]

src/main.tsx

@@ -4,39 +4,43 @@ import { ColorModeScript } from '@chakra-ui/react'
 import * as Sentry from '@sentry/react'
 import React from 'react'
 import ReactDOM from 'react-dom/client'
-import { createRoutesFromChildren, matchRoutes, RouterProvider, useLocation, useNavigationType } from 'react-router-dom'
+import {
+  createBrowserRouter,
+  createRoutesFromChildren,
+  matchRoutes,
+  RouterProvider,
+  useLocation,
+  useNavigationType,
+} from 'react-router-dom'
 
-import { GlobalStyles, router } from './config'
+import { GlobalStyles, routes } from './config'
 import { __production__, __staging__ } from './constants'
 
 const SENTRY_DSN = 'https://2355dca8304c4e32b35bf421d3cf4d87@o4504351883984896.ingest.sentry.io/4505088829292544'
 
+let createRouter = createBrowserRouter
+
 if (__production__ || __staging__) {
   Sentry.init({
     release: `geyser-app@${import.meta.env.PACKAGE_VERSION}`,
     dsn: SENTRY_DSN,
     environment: import.meta.env.VITE_APP_ENV,
     integrations: [
-      new Sentry.BrowserTracing({
-        // Browser tracing integration creates a new transaction for each page load and navigation event, and creates a child span for every XMLHttpRequest or fetch request that occurs while those transactions are open.
-        routingInstrumentation: Sentry.reactRouterV6Instrumentation(
-          React.useEffect,
-          useLocation,
-          useNavigationType,
-          createRoutesFromChildren,
-          matchRoutes,
-        ),
+      Sentry.reactRouterV6BrowserTracingIntegration({
+        useEffect: React.useEffect,
+        useLocation,
+        useNavigationType,
+        createRoutesFromChildren,
+        matchRoutes,
       }),
-      new Sentry.Replay(),
     ],
-    // Performance Monitoring
-    tracesSampleRate: 1.0, // Capture 100% of the transactions, reduce in production!
-    // Session Replay
-    replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production.
-    replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.
+    tracesSampleRate: 1.0,
   })
+  createRouter = Sentry.wrapCreateBrowserRouter(createBrowserRouter)
 }
 
+const router = createRouter(routes)
+
 // Needed for the nodejs modules that is used by the dependencies that are used for generating keypairs
 if (typeof window !== 'undefined') {
   const { Buffer } = await import('buffer/')

vite.config.ts

@@ -1,4 +1,5 @@
 /* eslint-disable camelcase */
+import { sentryVitePlugin } from '@sentry/vite-plugin'
 import react from '@vitejs/plugin-react-swc'
 import { defineConfig, loadEnv, PluginOption } from 'vite'
 import mkcert from 'vite-plugin-mkcert'
@@ -119,6 +120,19 @@ export default defineConfig(({ command, mode }) => {
     plugins.push(mkcert())
   }
 
+  if (env.CI) {
+    plugins.push(
+      sentryVitePlugin({
+        authToken: env.SENTRY_AUTH_TOKEN,
+        org: 'geyser',
+        project: 'geyser-app',
+        sourcemaps: {
+          filesToDeleteAfterUpload: ['./dist/**/*.js.map'],
+        },
+      }),
+    )
+  }
+
   return {
     plugins,
     server,