53 lines
1.0 KiB
TypeScript
53 lines
1.0 KiB
TypeScript
|
import React from 'react';
|
||
|
|
import { useAuthorizer } from '@authorizerdev/authorizer-react';
|
||
|
|
|
||
|
|
export default function Dashboard() {
|
||
|
|
const [loading, setLoading] = React.useState(false);
|
||
|
|
const { user, setToken, graphQlRef } = useAuthorizer();
|
||
|
|
|
||
|
|
const onLogout = async () => {
|
||
|
|
setLoading(true);
|
||
|
|
await graphQlRef
|
||
|
|
.mutation(
|
||
|
|
`
|
||
|
|
mutation {
|
||
|
|
logout {
|
||
|
|
message
|
||
|
|
}
|
||
|
|
}
|
||
|
|
`
|
||
|
|
)
|
||
|
|
.toPromise();
|
||
|
|
setToken(null);
|
||
|
|
setLoading(false);
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div>
|
||
|
|
<h1>Hey 👋,</h1>
|
||
|
|
<p>Thank you for joining authorizer demo app.</p>
|
||
|
|
<p>
|
||
|
|
Your email address is{' '}
|
||
|
|
<a href={`mailto:${user?.email}`} style={{ color: '#3B82F6' }}>
|
||
|
|
{user?.email}
|
||
|
|
</a>
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<br />
|
||
|
|
{loading ? (
|
||
|
|
<h3>Processing....</h3>
|
||
|
|
) : (
|
||
|
|
<h3
|
||
|
|
style={{
|
||
|
|
color: '#3B82F6',
|
||
|
|
cursor: 'pointer',
|
||
|
|
}}
|
||
|
|
onClick={onLogout}
|
||
|
|
>
|
||
|
|
Logout
|
||
|
|
</h3>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|