blob: b0da0d0e9e437623cb5e844fdf20b31484133fd4 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
|
import React from 'react'
import GoogleLogin from 'react-google-login'
import { useDispatch } from 'react-redux'
import { logIn } from '../../redux/actions/auth'
import { Button } from 'reactstrap'
function Login({ visible, className }) {
const dispatch = useDispatch()
const onLogin = (payload) => dispatch(logIn(payload))
const onAuthResponse = (response) => {
onLogin({
email: response.getBasicProfile().getEmail(),
givenName: response.getBasicProfile().getGivenName(),
familyName: response.getBasicProfile().getFamilyName(),
googleId: response.googleId,
authToken: response.getAuthResponse().id_token,
expiresAt: response.getAuthResponse().expires_at,
})
}
const onAuthFailure = (error) => {
// TODO Show error alert
console.error(error)
}
if (!visible) {
return <span />
}
return (
<GoogleLogin
clientId={process.env.NEXT_PUBLIC_OAUTH_CLIENT_ID}
onSuccess={onAuthResponse}
onFailure={onAuthFailure}
render={(renderProps) => (
<Button color="primary" onClick={renderProps.onClick} className={className}>
<span aria-hidden className="fa fa-google" /> Login with Google
</Button>
)}
/>
)
}
export default Login
|