55560e0c58
Converted auth0 example over to TypeScript to match the Contribution guidelines, and got rid of the `tslib` dependency. Note: You must copy `.env.local.example` to `.env.local`, or you will encounter "TypeError: "secret" is required" at build time. ## Documentation / Examples - [X] Make sure the linting passes by running `pnpm lint` - [X] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples) Co-authored-by: Balázs Orbán <18369201+balazsorban44@users.noreply.github.com>
37 lines
862 B
TypeScript
37 lines
862 B
TypeScript
import Layout from '../components/layout'
|
|
import { useFetchUser } from '../lib/user'
|
|
|
|
const Home = () => {
|
|
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>
|
|
<img src={user.picture} alt="user picture" />
|
|
<p>nickname: {user.nickname}</p>
|
|
<p>name: {user.name}</p>
|
|
</>
|
|
)}
|
|
</Layout>
|
|
)
|
|
}
|
|
|
|
export default Home
|