chore(deps): update sentry to v8

package.json

@@ -130,7 +130,7 @@
 		"@guardian/source": "^8.0.0",
 		"@guardian/source-development-kitchen": "^9.0.0",
 		"@okta/jwt-verifier": "^4.0.1",
-		"@sentry/browser": "^7.119.0",
+		"@sentry/browser": "^8.30.0",
 		"@smithy/node-http-handler": "^3.2.2",
 		"awesome-debounce-promise": "^2.1.0",
 		"body-parser": "^1.20.3",

src/client/lib/clientSideLogger.ts

@@ -3,7 +3,7 @@ import { LogLevel } from '@/shared/model/Logger';
 import {
 	captureException,
 	captureMessage,
-	startTransaction,
+	startInactiveSpan,
 	SeverityLevel,
 } from '@sentry/browser';
 
@@ -25,9 +25,9 @@ class ClientSideLogger extends BaseLogger {
 	log(level: LogLevel, message: string, error?: any, extra?: ExtraLogFields) {
 		// Wrap the log in a new Sentry transaction.
 		// Setting `sampled` to true ensures that it is logged every time.
-		const transaction = startTransaction({
+		const span = startInactiveSpan({
 			name: 'logger-event',
-			sampled: true,
+			forceTransaction: true,
 		});
 
 		if (
@@ -38,20 +38,20 @@ class ClientSideLogger extends BaseLogger {
 			typeof error.message === 'string'
 		) {
 			captureException(error, { extra });
-			return transaction?.finish();
+			return span?.end();
 		}
 
 		if (error) {
 			captureMessage(`${message} - ${error}`, {
 				level: getSentryLevel(level),
 				extra,
 			});
-			return transaction?.finish();
+			return span?.end();
 		}
 
 		// should it be needed, `extra` is a free-form object that we can use to add additional debug info to Sentry logs.
 		captureMessage(message, { level: getSentryLevel(level), extra });
-		return transaction?.finish();
+		return span?.end();
 	}
 
 	// eslint-disable-next-line

src/client/static/hydration.tsx

@@ -7,13 +7,14 @@ import { tests } from '@/shared/model/experiments/abTests';
 import { abSwitches } from '@/shared/model/experiments/abSwitches';
 import {
 	BrowserClient,
-	Breadcrumbs,
-	Dedupe,
+	breadcrumbsIntegration,
+	dedupeIntegration,
 	defaultStackParser,
-	getCurrentHub,
-	GlobalHandlers,
+	globalHandlersIntegration,
 	makeFetchTransport,
-	HttpContext,
+	httpContextIntegration,
+	withIsolationScope,
+	setCurrentClient,
 } from '@sentry/browser';
 import { ABProvider } from '@/client/components/ABReact';
 
@@ -34,21 +35,20 @@ export const hydrateApp = ({ routingConfig }: Props) => {
 			dsn,
 			environment: stage,
 			release: `gateway@${build}`,
-			// If you want to log something all the time, wrap your call to
-			// Sentry in a new Transaction and set `sampled` to true.
-			// An example of this is in clientSideLogger.ts
-			sampleRate: 0.2,
 			transport: makeFetchTransport,
 			stackParser: defaultStackParser,
 			integrations: [
-				new Breadcrumbs(),
-				new GlobalHandlers(),
-				new Dedupe(),
-				new HttpContext(),
+				breadcrumbsIntegration(),
+				globalHandlersIntegration(),
+				dedupeIntegration(),
+				httpContextIntegration(),
 			],
 		});
 
-		getCurrentHub().bindClient(client);
+		withIsolationScope(() => {
+			setCurrentClient(client);
+			client.init();
+		});
 	}
 
 	hydrateRoot(