fix: deeper sentry next integration

.kontinuous/env/dev/templates/sentry.sealed-secret.yaml

@@ -0,0 +1 @@
+../../preprod/templates/sentry.sealed-secret.yaml

.kontinuous/env/preprod/templates/sentry.sealed-secret.yaml

@@ -0,0 +1,15 @@
+apiVersion: bitnami.com/v1alpha1
+kind: SealedSecret
+metadata:
+  annotations:
+    sealedsecrets.bitnami.com/cluster-wide: 'true'
+  name: sentry
+spec:
+  encryptedData:
+    SENTRY_AUTH_TOKEN: AgAEd5LQ7feLkFrw84LDXdC8QhLER0ZEOiNG9bPrYhqtWs7IZWAZJZU9pYn/sji/HvIk0p1DiyRjkVgYu9uoGE5hB1aeI2xXLAuSfIPYNMCLquQKl3HZRLG/X6dPCaNXsCEysGMbnG4jHvO7+Y0gQEUq+us7YdKLhS2eOLokYNMRLLmYoWlzQb+a6Xcck4HnF5btIB8ZXw8bQNkHL1ndFfa1Sm8X2w/fafhKziVKEZDA59W2Dar9Re4kjbsQ0pz4JElxSnyPLL/hmh8JL3flQa4hzyBMUrK9asnSen2eKOlCHLQVC7RYtUVgDZOeExialr02m515vMnsvjeYdhnJF5teFGi34l7Ejb3FaNiniz2ChxlAirHthqjyNeB2MaLhfqP5gFq4c10zcQGtq7vqTzF6QXWLTh0ZxDOc74yX/7DxvtO30ahzQ13Hy2Ne2UpvJYHrjPBd0+bVQooLgYopOkO3gwZkL6TwC2OF3xNkTKrHw5XbC7lVpps5i7D9Bu/q9Uy3Y0HfvCnYH/IQOIw92M15ceX3joaosbOdPM/eLhDOX629fQFK3Y/t3iaF8kUtiu3R11YPoma6Qa8/HHlxBDXa+BcQTweeINKhMCKngeUnn0hVQ+7ifMcZzdO91sHeIaa89EMokE7cd0ytKjbM9vrOUjxgg5Vsh8Vrc5qTR5hgQaPssroT+/p3oH6oFPvtOvVgucuaZhk/xIIX98BDVqKfpoxzGxpohKY2dUEQj33HMoU7MM0oWlcx5Cp0p65V+T+gC5+xQdvxYAueQNv8yP/65dVpMVi5gUpkKq3wtCl/7Hcwn9SY7iPZ3sPt/hsUbXJjQnAYMrc2Uc5q9GQuInBlH5totN1Cv3O4Dwm7KG/0PRlS1HSz5JQzM8/6TdOGyzdLEgiae0HO3hhfOZ7dtBOunP9ab0xrtAtSs1CJuzsL17ZGdZipEHn/2KFwxiccPogrxm/6KB996Q3moP1pR9y0HTpOyzNUU9yS9PluyXckyPDFm3KWIoOoTXh50p/27cEddOvxmS8G
+  template:
+    metadata:
+      annotations:
+        sealedsecrets.bitnami.com/cluster-wide: 'true'
+      name: sentry
+    type: Opaque

.kontinuous/env/prod/templates/sentry.sealed-secret.yaml

@@ -0,0 +1,16 @@
+apiVersion: bitnami.com/v1alpha1
+kind: SealedSecret
+metadata:
+  annotations:
+    sealedsecrets.bitnami.com/namespace-wide: 'true'
+  name: sentry
+  namespace: egapro
+spec:
+  encryptedData:
+    SENTRY_AUTH_TOKEN: AgADQ4ukYI/OCa5aKbWvm3vvDVTS3nSh40dPsV2LbnX6jgeRJ7dhsFw3U3d5AunMPn2n7o4oN/OQoP88GxyVleJgO8Gf59IW+aIJve6CoiqXtf7UNMyshFlNr4N4I74GNANKPk1vUgMUSxL35wMQHLsaqQOsehGo/a4Lz+pVRB3fPtlaSMDdtFUF0SmrNpjRqU/WKt9GU+xK3O76xA7pdCV6NNAIv+2JP2fjby1eH3nERBSwb2oDHS2nCKBuwz6qmeqn2THPBtsi7zy+Uvj7AUAuuq9quoqeW2PJm8Yl96/mx7n2FQdSFgdWACoZxFpC0TZMfg454HgZAbRXrkFY6IcztgSyl6FsU2mihDLipiQMonKMRzDlMqu3EPKn41alppL69xhVYjkEV/cScn/9N0eViva8jUwFEMrs3q1X0cBtCCuNoEMDYF8a3Q3wcB86a6Rc1NIJYXANkrPz5W9AG+8j+GpiVZnskP+AU9dlvbxswKbBK073C2McJpyp4Wo/YvjEOlBNVPrfctYPAuHn04UJn31f/HGAdosOzktnQ8aWsg/34CA2cY/L/mnCQue/hBqo5xzdrnp1NBOhG717mAHaQDeeYelwOF9c+K79mY5dED/hPF144GjWx1QRsZI5kbSAD+baNxhZx9iFte+SFye6J0VIb8L9B5oIqGXj3LK+m/HbSmztkLlbKjxa/Q5HewqYp+fPFauwOAsusBBX5EYERYk9qBJUJYxm7UJlI/JtDTQGptLSdPYX8ZpDAIi6X1Vk3dlc+wdod/b4GDawZqjJ+ooX+Q04W+E+A6SJrLmvZv8Y1Y3nAw4JB04fl6Kee9teCwDYf/9mPqESGShELMogj9HSS7xkptgWNg7BUVjMkQkMTOmJOjTH3yYE+1RxHOjzUKUes2YEUQIHyqmEXiO9tDuW27cuhfXolPxbTS8/ThjMNwNPOR/7DB/yT9LNSsNd1M5NYKbAYorEJiOlF1qQCqGpBI+eQDG6iM957SvSB5kRDWj2WNmQrg4gKJl52EqKEDQCEn3L
+  template:
+    metadata:
+      annotations:
+        sealedsecrets.bitnami.com/namespace-wide: 'true'
+      name: sentry
+    type: Opaque

.kontinuous/values.yaml

@@ -226,6 +226,13 @@ jobs:
           NEXTAUTH_URL: "https://{{ .Values.global.host }}/api/auth"
           NEXT_PUBLIC_GITHUB_SHA: "{{ $.Values.global.shortSha }}"
           EGAPRO_ENV: "{{ .Values.global.env }}"
+          SENTRY_ORG: incubateur
+          SENTRY_PROJECT: egapro-next
+          SENTRY_URL: https://sentry.fabrique.social.gouv.fr
+        secrets:
+          sentry_auth_token:
+            secretName: sentry
+            secretKey: SENTRY_AUTH_TOKEN
 
     build-api:
       use: build

packages/app/Dockerfile

@@ -3,6 +3,17 @@ ARG NODE_VERSION=20-alpine
 # Builder
 FROM node:$NODE_VERSION AS builder
 
+
+WORKDIR /app
+
+COPY yarn.lock .yarnrc.yml ./
+COPY .yarn .yarn
+RUN yarn fetch workspaces focus app
+
+COPY packages/app/ ./packages/app/
+
+ENV NODE_OPTIONS="--max-old-space-size=8192"
+
 ARG NEXT_PUBLIC_API_URL
 ENV NEXT_PUBLIC_API_URL $NEXT_PUBLIC_API_URL
 ARG NEXT_PUBLIC_API_V2_URL
@@ -14,17 +25,16 @@ ENV EGAPRO_ENV $EGAPRO_ENV
 ARG NEXTAUTH_URL
 ENV NEXTAUTH_URL $NEXTAUTH_URL
 
-WORKDIR /app
+ARG SENTRY_URL
+ARG SENTRY_ORG
+ARG SENTRY_PROJECT
+ENV SENTRY_URL=$SENTRY_URL
+ENV SENTRY_ORG=$SENTRY_ORG
+ENV SENTRY_PROJECT=$SENTRY_PROJECT
 
-COPY yarn.lock .yarnrc.yml ./
-COPY .yarn .yarn
-RUN yarn fetch workspaces focus app
-
-COPY packages/app/ ./packages/app/
-
-ENV NODE_OPTIONS="--max-old-space-size=8192"
+RUN --mount=type=secret,id=sentry_auth_token export SENTRY_AUTH_TOKEN=$(cat /run/secrets/sentry_auth_token); \
+  yarn workspace app build
 
-RUN yarn workspace app build
 RUN yarn workspaces focus app --production && yarn cache clean
 RUN mkdir -p ./packages/app/node_modules
 
@@ -43,6 +53,7 @@ COPY --from=builder /app/packages/app/.env.development .
 COPY --from=builder /app/packages/app/public ./public
 COPY --from=builder /app/node_modules ./node_modules
 COPY --from=builder /app/packages/app/node_modules ./packages/app/node_modules
+COPY --from=builder /app/packages/app/sentry.*.ts .
 COPY --from=builder --chown=node:node /app/packages/app/.next ./.next
 
 USER 1000

packages/app/next.config.js

@@ -84,10 +84,12 @@ module.exports = withSentryConfig(
     // https://github.com/getsentry/sentry-webpack-plugin#options
 
     // Suppresses source map uploading logs during build
-    silent: true,
-    org: "incubateur",
-    project: "egapro-next",
-    url: "https://sentry.fabrique.social.gouv.fr/",
+    // silent: true,
+
+    org: process.env.SENTRY_ORG,
+    project: process.env.SENTRY_PROJECT,
+    url: process.env.SENTRY_URL,
+    authToken: process.env.SENTRY_AUTH_TOKEN,
   },
   {
     // For all available options, see:

packages/app/package.json

@@ -25,7 +25,7 @@
     "@json2csv/node": "^7.0.1",
     "@octokit/rest": "^20.0.2",
     "@react-pdf/renderer": "^3.1.12",
-    "@sentry/nextjs": "^7.92.0",
+    "@sentry/nextjs": "^7.106.0",
     "@socialgouv/matomo-next": "^1.8.0",
     "chart.js": "^4.3.0",
     "chartjs-plugin-datalabels": "^2.2.0",

packages/app/sentry.client.config.ts

@@ -3,27 +3,57 @@
 // https://docs.sentry.io/platforms/javascript/guides/nextjs/
 
 import * as Sentry from "@sentry/nextjs";
+import { Replay } from "@sentry/replay";
+
+const ENVIRONMENT = process.env.EGAPRO_ENV || "development";
+const IS_PRODUCTION = ENVIRONMENT === "production";
 
 Sentry.init({
   dsn: "https://[email protected]/99",
-  environment: process.env.EGAPRO_ENV || "dev",
-  // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 0.1,
-
-  // Setting this option to true will print useful information to the console while you're setting up Sentry.
-  debug: false,
+  environment: ENVIRONMENT,
 
+  // Optimal sample rates based on environment
+  tracesSampleRate: IS_PRODUCTION ? 0.1 : 1.0,
   replaysOnErrorSampleRate: 1.0,
+  replaysSessionSampleRate: IS_PRODUCTION ? 0.1 : 0.5,
+
+  debug: !IS_PRODUCTION,
+
+  // Enable performance monitoring through traces
+  enableTracing: true,
+
+  // Track releases for better error monitoring
+  release: process.env.NEXT_PUBLIC_GITHUB_SHA || "development",
+
+  beforeSend(event) {
+    // Filter out non-error events in production
+    if (IS_PRODUCTION && !event.exception) return null;
+
+    // Filter out known unnecessary errors
+    const ignoreErrors = [
+      "ResizeObserver loop limit exceeded",
+      "Network request failed",
+      /^Loading chunk .* failed/,
+      /^Loading CSS chunk .* failed/,
+    ];
+
+    if (
+      event.exception &&
+      ignoreErrors.some(pattern => {
+        if (typeof pattern === "string") {
+          return event.exception?.values?.[0]?.value?.includes(pattern);
+        }
+        return pattern.test(event.exception?.values?.[0]?.value || "");
+      })
+    ) {
+      return null;
+    }
 
-  // This sets the sample rate to be 10%. You may want this to be 100% while
-  // in development and sample at a lower rate in production
-  replaysSessionSampleRate: 0.1,
+    return event;
+  },
 
-  // You can remove this option if you're not planning to use the Sentry Session Replay feature:
   integrations: [
-    // eslint-disable-next-line import/namespace
-    new Sentry.Replay({
-      // Additional Replay configuration goes in here, for example:
+    new Replay({
       maskAllText: true,
       blockAllMedia: true,
     }),

packages/app/sentry.edge.config.ts

@@ -5,12 +5,49 @@
 
 import * as Sentry from "@sentry/nextjs";
 
+const ENVIRONMENT = process.env.EGAPRO_ENV || "dev";
+const IS_PRODUCTION = ENVIRONMENT === "production";
+
 Sentry.init({
   dsn: "https://[email protected]/99",
-  environment: process.env.EGAPRO_ENV || "dev",
-  // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 0.1,
+  environment: ENVIRONMENT,
+
+  // Optimal sample rates based on environment
+  tracesSampleRate: IS_PRODUCTION ? 0.1 : 1.0,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+
+  // Enable performance monitoring through traces
+  enableTracing: true,
+
+  // Track releases for better error monitoring
+  release: process.env.NEXT_PUBLIC_GITHUB_SHA || ENVIRONMENT,
+
+  beforeSend(event) {
+    // Filter out non-error events in production
+    if (IS_PRODUCTION && !event.exception) return null;
+
+    // Filter out known unnecessary errors
+    const ignoreErrors = [
+      "ResizeObserver loop limit exceeded",
+      "Network request failed",
+      /^Loading chunk .* failed/,
+      /^Loading CSS chunk .* failed/,
+    ];
+
+    if (
+      event.exception &&
+      ignoreErrors.some(pattern => {
+        if (typeof pattern === "string") {
+          return event.exception?.values?.[0]?.value?.includes(pattern);
+        }
+        return pattern.test(event.exception?.values?.[0]?.value || "");
+      })
+    ) {
+      return null;
+    }
+
+    return event;
+  },
 });

packages/app/sentry.server.config.ts

@@ -4,13 +4,53 @@
 
 import * as Sentry from "@sentry/nextjs";
 
+const ENVIRONMENT = process.env.EGAPRO_ENV || "dev";
+const IS_PRODUCTION = ENVIRONMENT === "production";
+
 Sentry.init({
   dsn: "https://[email protected]/99",
-  environment: process.env.EGAPRO_ENV || "dev",
+  environment: ENVIRONMENT,
 
-  // Adjust this value in production, or use tracesSampler for greater control
-  tracesSampleRate: 0.1,
+  // Optimal sample rates based on environment
+  tracesSampleRate: IS_PRODUCTION ? 0.1 : 1.0,
 
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+
+  // Enable performance monitoring through traces
+  enableTracing: true,
+
+  // Track releases for better error monitoring
+  release: process.env.NEXT_PUBLIC_GITHUB_SHA || ENVIRONMENT,
+
+  beforeSend(event) {
+    // Filter out non-error events in production
+    if (IS_PRODUCTION && !event.exception) return null;
+
+    // Filter out known unnecessary errors
+    const ignoreErrors = [
+      "ResizeObserver loop limit exceeded",
+      "Network request failed",
+      /^Loading chunk .* failed/,
+      /^Loading CSS chunk .* failed/,
+      /^ECONNREFUSED/,
+      /^ECONNRESET/,
+      /^ETIMEDOUT/,
+      "Database connection timeout",
+    ];
+
+    if (
+      event.exception &&
+      ignoreErrors.some(pattern => {
+        if (typeof pattern === "string") {
+          return event.exception?.values?.[0]?.value?.includes(pattern);
+        }
+        return pattern.test(event.exception?.values?.[0]?.value || "");
+      })
+    ) {
+      return null;
+    }
+
+    return event;
+  },
 });

packages/app/src/app/global-error.jsx

@@ -1,13 +1,17 @@
 "use client";
 
-import * as Sentry from "@sentry/nextjs";
+import { captureError } from "@common/error";
 import Error from "next/error";
 import { useEffect } from "react";
 
 // eslint-disable-next-line import/no-default-export
 export default function GlobalError({ error }) {
   useEffect(() => {
-    Sentry.captureException(error);
+    captureError(error, {
+      type: "client",
+      url: window.location.href,
+      path: window.location.pathname,
+    });
   }, [error]);
 
   return (