Setup Sentry with Cloudflare

packages/gitbook/package.json

@@ -25,6 +25,7 @@
         "@gitbook/react-openapi": "workspace:*",
         "@radix-ui/react-checkbox": "^1.0.4",
         "@radix-ui/react-popover": "^1.0.7",
+        "@sentry/cloudflare": "8.35.0",
         "@sentry/nextjs": "8.35.0",
         "@sindresorhus/fnv1a": "^3.1.0",
         "@tailwindcss/container-queries": "^0.1.1",

packages/gitbook/src/cloudflare-entrypoint.ts

@@ -1,13 +1,10 @@
 // @ts-ignore
 import nextOnPagesHandler from '@cloudflare/next-on-pages/fetch-handler';
+import { withSentry } from '@sentry/cloudflare';
 
 import { withMiddlewareHeadersStorage } from './lib/middleware';
 
-/**
- * We use a custom entrypoint until we can move to opennext (https://github.com/opennextjs/opennextjs-cloudflare/issues/92).
- * There is a bug in next-on-pages where headers can't be set on the response in the middleware for RSC requests (https://github.com/cloudflare/next-on-pages/issues/897).
- */
-export default {
+const exportedHandler = {
     async fetch(request, env, ctx) {
         const response = await withMiddlewareHeadersStorage(() =>
             nextOnPagesHandler.fetch(request, env, ctx),
@@ -15,4 +12,21 @@ export default {
 
         return response;
     },
-} as ExportedHandler<{ ASSETS: Fetcher }>;
+} satisfies ExportedHandler<{ ASSETS: Fetcher }>;
+
+const dsn = process.env.SENTRY_DSN;
+
+/**
+ * We use a custom entrypoint until we can move to opennext (https://github.com/opennextjs/opennextjs-cloudflare/issues/92).
+ * There is a bug in next-on-pages where headers can't be set on the response in the middleware for RSC requests (https://github.com/cloudflare/next-on-pages/issues/897).
+ */
+export default dsn
+    ? withSentry(
+          () => ({
+              dsn,
+              tracesSampleRate: 0,
+          }),
+          // @ts-ignore
+          exportedHandler,
+      )
+    : exportedHandler;

packages/gitbook/src/instrumentation.ts

@@ -1,15 +0,0 @@
-import * as Sentry from '@sentry/nextjs';
-import { Instrumentation } from 'next';
-
-export async function register() {
-    console.log('Instrumentation.register');
-    await import('./sentry');
-}
-
-export const onRequestError: Instrumentation.onRequestError = async (...args) => {
-    console.log('Instrumentation.onRequestError');
-    Sentry.captureRequestError(...args);
-    // There is an issue on Cloudflare that requires us to flush the events manually.
-    // https://github.com/getsentry/sentry-javascript/issues/14931#issuecomment-2577640023
-    await Sentry.flush();
-};

packages/gitbook/src/middleware.ts

@@ -97,9 +97,6 @@ export type LookupResult = PublishedContentWithCache & {
  * The middleware also takes care of persisting the visitor authentication state.
  */
 export async function middleware(request: NextRequest) {
-    // Instrumentation is not loaded correctly...
-    await import('./sentry');
-
     const { url, mode } = getInputURL(request);
 
     setTag('url', url.toString());

packages/gitbook/src/sentry.ts

@@ -1,11 +0,0 @@
-import * as Sentry from '@sentry/nextjs';
-
-const dsn = process.env.SENTRY_DSN;
-if (dsn) {
-    console.log('Initializing Sentry with DSN:', dsn);
-    Sentry.init({
-        dsn,
-        // Disable tracing as it creates additional requests in an env where subrequests are limited.
-        tracesSampleRate: 0,
-    });
-}