Posthog + Sentry integration in Next.js

Question

currently I'm trying to implement the Posthog Sentry Next.js (Pages router) integration, mentioned here: https://posthog.com/docs/libraries/sentry These are the package versions I'm running:

"@sentry/nextjs": "^7.95.0"
"posthog-js": "^1.102.1"
"next": "13.4.10"

Both Posthog and Sentry are working fine separately.

Instead of initializing Posthog in the _app.tsx File, for now, I initialized Posthog together with Sentry in the sentry.client.config.js, which works fine, I can see the incoming events in Posthog, als well as catch errors in Sentry. This is the modified sentry.client.config.js file I have right now, initially created using the Sentry Next.js Wizard.

// This file configures the initialization of Sentry on the client.
// The config you add 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";
import posthog from "posthog-js"

posthog.init(process.env.NEXT_PUBLIC_POSTHOG_KEY!, {
  api_host: process.env.NEXT_PUBLIC_POSTHOG_HOST || 'https://eu.posthog.com',
})


Sentry.init({
  dsn: <my-sentry-dsn>,

  // Adjust this value in production, or use tracesSampler for greater control
  tracesSampleRate: 1,

  // Setting this option to true will print useful information to the console while you're setting up Sentry.
  debug: true,

  replaysOnErrorSampleRate: 1.0,

  // 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,

  integrations: [
    new posthog.SentryIntegration(posthog, "my-sentry-organization-id", project-id),

    new Sentry.Replay({
      // Additional Replay configuration goes in here, for example:
      maskAllText: true,
      blockAllMedia: true,
    }),
  ],

});

This is a simplified version of my _app.tsx file.

import "../styles/globals.css";
import type { AppProps } from "next/app";
import posthog from "posthog-js"
import { PostHogProvider } from 'posthog-js/react'

function MyApp({ Component, pageProps }: AppProps) {

  return (
    <>
      <PostHogProvider client={posthog}>
        <Component {...pageProps} />
      </PostHogProvider>
    </>
  );
}

export default MyApp;

I double checked the Sentry organization id and the project id, so that's not the issue. As mentioned, both services work independently with this setup. Thanks in advance in case someone knows how to fix this.