User from useAuth0 is undefined

Ready to post? :mag: First, try searching for your answer.

I initialized the provider

<Auth0Provider
    domain="domain"
    clientId="id"
    authorizationParams={{
      redirect_uri: "http://localhost:3000/dashboard"
    }}>
    <App />
  </Auth0Provider>

And log in with google

function App() {
  const { loginWithRedirect } = useAuth0();

  return (
    <Router>
      <Routes>
        <Route path="/" element={
          <button onClick={() => loginWithRedirect({
            authorizationParams: {
              connection: 'google-oauth2',
              redirect_uri: 'http://localhost:3000/dashboard'
            }
          })}>
            Login with Google
          </button>
        }/>
        <Route path="/dashboard" element={<Dashboard />} />
      </Routes>
    </Router>
  );
}

However, the user is undefined after logging to dashboard component, what went wrong?

function Dashboard() {
  const { user, logout, isAuthenticated } = useAuth0();
  console.log(user);
  return isAuthenticated ? (
    <div>
      <h1>Welcome, {user.name}!</h1>
      <button onClick={() => logout({ returnTo: window.location.origin })}>
        Logout
      </button>
    </div>
  ) : (
    <div>Loading...</div>
  );
}

Here is the repo for the code: GitHub - weijia-yu/auth0_test