2019-10-01 23:19:04 +02:00
|
|
|
import Layout from '../components/layout'
|
|
|
|
import { useFetchUser } from '../lib/user'
|
|
|
|
|
2022-06-29 13:00:13 +02:00
|
|
|
const Home = () => {
|
2019-10-01 23:19:04 +02:00
|
|
|
const { user, loading } = useFetchUser()
|
|
|
|
|
|
|
|
return (
|
|
|
|
<Layout user={user} loading={loading}>
|
|
|
|
<h1>Next.js and Auth0 Example</h1>
|
|
|
|
|
|
|
|
{loading && <p>Loading login info...</p>}
|
|
|
|
|
|
|
|
{!loading && !user && (
|
|
|
|
<>
|
|
|
|
<p>
|
|
|
|
To test the login click in <i>Login</i>
|
|
|
|
</p>
|
|
|
|
<p>
|
|
|
|
Once you have logged in you should be able to click in{' '}
|
|
|
|
<i>Profile</i> and <i>Logout</i>
|
|
|
|
</p>
|
|
|
|
</>
|
|
|
|
)}
|
|
|
|
|
|
|
|
{user && (
|
|
|
|
<>
|
|
|
|
<h4>Rendered user info on the client</h4>
|
2019-11-11 04:24:53 +01:00
|
|
|
<img src={user.picture} alt="user picture" />
|
2019-10-01 23:19:04 +02:00
|
|
|
<p>nickname: {user.nickname}</p>
|
|
|
|
<p>name: {user.name}</p>
|
|
|
|
</>
|
|
|
|
)}
|
|
|
|
</Layout>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
export default Home
|