User details not accesible when scope is defined

I am trying to build a Gatsby app. I am wrapping my root component in the following was:

<Auth0Provider
      domain={process.env.GATSBY_AUTH0_DOMAIN}
      clientId={process.env.GATSBY_AUTH0_CLIENTID}
      authorizationParams={{
        redirect_uri: window.location.origin,
        audience: audience,
        scope: "read:current_user update:current_user_metadata"
      }}
      onRedirectCallback={onRedirectCallback}
      useRefreshTokens={true}
      cacheLocation="localstorage"
    >
      {element}
    </Auth0Provider>

Later on I access the username like this:

const {
    isAuthenticated,
    logout,
    user,
  } = useAuth0();

return isAuthenticated && (
    <>
      <p className='text-xl' >Hi {user.email}</p>
</>
 );

Whenever I am not specifying a scope, this works perfectly fine. When I am specifying a scope (which I need to access the management api to change the user metadata), the only information I am getting from the user object is the user.sub. I searched up and down the web and cannot find a solution to this.
Is anyone facing a similar issue and can tell me what I am missing here?

Of course a really dumb mistake. The default scope namely openid profile and email also needs to be passed. I was not able to find the default scope in the docu however, but only in the migration guide https://github.com/auth0/auth0-react/blob/master/MIGRATION_GUIDE.md#changes-to-default-scopes

scope: "openid profile email read:current_user update:current_user_metadata"

Hope that helps anyone facing the same problem.

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.