I am facing a little issue showing user.name if anyone can solve this!

when i show in react like this {isAuthenticated &&

Hi {user?.name}

}
first time name load perfectly but when i reload page it keeps Loading…
here is my full code:
import { useAuth0 } from “@auth0/auth0-react”;
import { useEffect } from “react”;
import { Button } from “…/styles/element.styled”;

export default function Taskivent() {
const { logout, user, isAuthenticated, isLoading } = useAuth0();

useEffect(() => {
// Check if the authentication status is loading
// and if the user is authenticated
// If not, you can redirect to the login page or perform any other action
if (!isLoading && !isAuthenticated) {
// Redirect or perform an action
// For example, you can redirect to the homepage
window.location.href = “/”;
}
}, [isLoading, isAuthenticated]);

if (isLoading) {
// You can show a loading state while checking the authentication status
return

Loading…
;
}

return (


<Button
onClick={() =>
logout({ logoutParams: { returnTo: window.location.origin } })
}
>
Log Out

{isAuthenticated &&

Hi {user?.name}

}

);
}