Sentry within Next.js (App router) - how do I "setUser" for server/client components? Missing in logs

[cpotey]

Hi there,

I'm trying to set up Sentry on my Next v14/App router. I've got it correctly logging errors to my Sentry installation, but I'm trying to add some user identifiers to the errors, so I can reference them to users in my DB.

I have used this successfully in the past on my _app.tsx file:

Sentry.setUser({
    id: currentUser.id.toString() ?? undefined,
});

This worked on the Pages router, but it seems in App router (with RSC and all that) it doesn't work, and add the user to the error?

I have done a request to get the userId in my Layout RSC, and trying to attach it to the RootLayout at /app/layout.tsx as follows:

export default async function RootLayout({ children }: { children: React.ReactNode }) {
const currentUser = await fetchUserData();

if (currentUser) {
    Sentry.setUser({
      id: currentUser.id,
    });
  } 
...

But it doesn't seem to carry through this id to the error that's logged within Sentry.

Is it because of server components somehow, and how they are now different to client components? Just trying to get my head around this, and how to keep the code clean - and how best to tackle this for errors within both server and client components!

Thanks!

[dlibis]

im also struggling with this:

flows is a client component, so it have the user context.

[lforst]

As of now, you would have to call Sentry.setUser() in each server component individually. That is because server components are separated logically.

[lforst]

To add to my comment here: #10019 (reply in thread)

Server and client components are also separated logically. Meaning that when you call setUser() on the server, it is not propagated to the client. On the client you would also have to call the method.

[jimydavis]

1. Understood that setUser should be on every server component.
2. For setUser on client components, is it:

• Set it one time somewhere (where?) and let it propagate?
• We must use useEffect() ?

Thanks

[lforst]

For the client you generally only have to set it once per pageload, so you can set it somewhere pretty high in a layout or something. And yes I would use useEffect for it. I do it like this in my side-project so that the user value gets updated when let's say somebody switches accounts:

useEffect(() => {
  Sentry.setUser({ id: userId })
}, [userId])

[jimydavis]

Thank you!