v4.1: Overridden user details in Auth0Provider are ignored when retrieving user details with useUser()

[payamtrack]

Checklist

• The issue can be reproduced in the nextjs-auth0 sample app (or N/A).
• I have looked into the Readme, Examples, and FAQ and have not found a suitable solution or answer.
• I have looked into the API documentation and have not found a suitable solution or answer.
• I have searched the issues and have not found a suitable solution or answer.
• I have searched the Auth0 Community forums and have not found a suitable solution or answer.
• I agree to the terms within the Auth0 Code of Conduct.

Description

Hi,
In v3, we could easily override user details by updating the user prop within <UserProvider />. For example:

import { UserProvider } from '@auth0/nextjs-auth0/client'
import { headers } from 'next/headers'

export default async function RootLayout({
    children,
}: {
    children: React.ReactNode
}) {
    const headersList = headers()
    const sub = headersList.get('user-id') ?? ''
    const email = headersList.get('user-email') ?? ''
    const name = headersList.get('user-name') ?? ''

    return (
        <>
            <UserProvider user={{ sub, email, name }}>
                {children}
            </UserProvider>
        </>
    )
}

Then in client components, we could then access the overridden user details via useUser().

However, in v4, even though we set the user={{ sub, email, name }} prop in <Auth0Provider />, useUser() ignores these overridden details and instead returns the default session.user details.

Reproduction

1. In the root layout, set the user prop on Auth0Provider with test data:

<Auth0Provider user={{ sub: "test_id", email: "test@email.com", name: "test name" }}>
  {children}
</Auth0Provider>

2. In a client component, retrieve user details using useUser():

'use client'

import { useUser } from '@auth0/nextjs-auth0'

export default function ClientComponent() {
   const { user } = useUser()

    console.log('User details:', user)
    
    return (
      <>{user?.sub} - {user?.email} - {user?.name}</>
    )
}

Additional context

No response

nextjs-auth0 version

4.1.0

Next.js version

14.2.25

Node.js version

18.19.0

[frederikprijck]

Can you elaborate on the use-case for this? Why would you not be able to rely on the actual values, rather than override them?

[tusharpandey13]

Please see https://github.com/auth0/nextjs-auth0/blob/main/EXAMPLES.md#passing-an-initial-user-from-the-server

The loaded user will then be used as a fallback in useUser() hook.

V4 does not override, it provides a fallback. Is this similar to what you are facing?

[payamtrack]

That's correct, I was expecting it to behave like v3 and override the user, but I wasn't aware of the different behaviour in v4.
Thanks for pointing that out, @tusharpandey13!

[payamtrack]

@frederikprijck Apologies for the delayed response. We need to use our internal user ID instead of the Auth0 one, and then retrieve the rest of the user data from Auth0.

[frederikprijck]

We need to use our internal user ID instead of the Auth0 one, and then retrieve the rest of the user data from Auth0.

This is something to be solved in an action to enrich the token with whatever additional claim you want.