feat(observability): add sentry monitoring

.gitignore

@@ -56,3 +56,6 @@ implementation_plan.md
 # PWA build artifacts (regenerated each build, hashes change)
 public/sw.js
 public/workbox-*.js
+
+# Sentry Config File
+.env.sentry-build-plugin

next.config.ts

@@ -1,3 +1,4 @@
+import { withSentryConfig } from "@sentry/nextjs";
 import type { NextConfig } from "next";
 import { withSerwist } from "@serwist/turbopack";
 
@@ -36,4 +37,15 @@ const nextConfig: NextConfig = {
   },
 };
 
-export default withSerwist(nextConfig);
+export default withSentryConfig(withSerwist(nextConfig), {
+  org: process.env.SENTRY_ORG ?? "shenzhen-banlv-zhidao-technolo",
+  project: process.env.SENTRY_PROJECT ?? "javascript-nextjs",
+  silent: !process.env.CI,
+  widenClientFileUpload: true,
+  webpack: {
+    automaticVercelMonitors: true,
+    treeshake: {
+      removeDebugLogging: true,
+    },
+  },
+});

package.json

@@ -19,6 +19,7 @@
   },
   "dependencies": {
     "@fingerprintjs/fingerprintjs": "^5.2.0",
+    "@sentry/nextjs": "^10.59.0",
     "@stripe/react-stripe-js": "^6.6.0",
     "@stripe/stripe-js": "^9.8.0",
     "@xstate/react": "^5",

sentry.edge.config.ts

@@ -0,0 +1,24 @@
+// This file configures the initialization of Sentry for edge features (middleware, edge routes, and so on).
+// The config you add here will be used whenever one of the edge features is loaded.
+// Note that this config is unrelated to the Vercel Edge Runtime and is also required when running locally.
+// https://docs.sentry.io/platforms/javascript/guides/nextjs/
+
+import * as Sentry from "@sentry/nextjs";
+
+const dsn = process.env.SENTRY_DSN ?? process.env.NEXT_PUBLIC_SENTRY_DSN;
+
+if (dsn) {
+  Sentry.init({
+    dsn,
+
+    tracesSampleRate: Number(
+      process.env.SENTRY_TRACES_SAMPLE_RATE ??
+        (process.env.NODE_ENV === "production" ? "0.1" : "1"),
+    ),
+
+    enableLogs: true,
+
+    // Chat content and auth data are sensitive; do not send default PII.
+    sendDefaultPii: false,
+  });
+}

sentry.server.config.ts

@@ -0,0 +1,23 @@
+// This file configures the initialization of Sentry on the server.
+// The config you add here will be used whenever the server handles a request.
+// https://docs.sentry.io/platforms/javascript/guides/nextjs/
+
+import * as Sentry from "@sentry/nextjs";
+
+const dsn = process.env.SENTRY_DSN ?? process.env.NEXT_PUBLIC_SENTRY_DSN;
+
+if (dsn) {
+  Sentry.init({
+    dsn,
+
+    tracesSampleRate: Number(
+      process.env.SENTRY_TRACES_SAMPLE_RATE ??
+        (process.env.NODE_ENV === "production" ? "0.1" : "1"),
+    ),
+
+    enableLogs: true,
+
+    // Chat content and auth data are sensitive; do not send default PII.
+    sendDefaultPii: false,
+  });
+}

src/instrumentation-client.ts

@@ -0,0 +1,33 @@
+// This file configures the initialization of Sentry on the client.
+// The added config here will be used whenever a users loads a page in their browser.
+// https://docs.sentry.io/platforms/javascript/guides/nextjs/
+
+import * as Sentry from "@sentry/nextjs";
+
+const dsn = process.env.NEXT_PUBLIC_SENTRY_DSN;
+
+if (dsn) {
+  Sentry.init({
+    dsn,
+
+    integrations: [Sentry.replayIntegration()],
+
+    tracesSampleRate: Number(
+      process.env.NEXT_PUBLIC_SENTRY_TRACES_SAMPLE_RATE ??
+        (process.env.NODE_ENV === "production" ? "0.1" : "1"),
+    ),
+    enableLogs: true,
+
+    replaysSessionSampleRate: Number(
+      process.env.NEXT_PUBLIC_SENTRY_REPLAY_SAMPLE_RATE ?? "0.05",
+    ),
+    replaysOnErrorSampleRate: Number(
+      process.env.NEXT_PUBLIC_SENTRY_REPLAY_ERROR_SAMPLE_RATE ?? "1",
+    ),
+
+    // Chat content and auth data are sensitive; do not send default PII.
+    sendDefaultPii: false,
+  });
+}
+
+export const onRouterTransitionStart = Sentry.captureRouterTransitionStart;

src/instrumentation.ts

@@ -0,0 +1,13 @@
+import * as Sentry from "@sentry/nextjs";
+
+export async function register() {
+  if (process.env.NEXT_RUNTIME === "nodejs") {
+    await import("../sentry.server.config");
+  }
+
+  if (process.env.NEXT_RUNTIME === "edge") {
+    await import("../sentry.edge.config");
+  }
+}
+
+export const onRequestError = Sentry.captureRequestError;