blob: 9201c09a67e2ea19514611fdc08eac1368d46a51 (
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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
import PropTypes from 'prop-types'
import React from 'react'
import GoogleLogin from 'react-google-login'
import { connect } from 'react-redux'
import { logIn } from '../../actions/auth'
class LoginContainer extends React.Component {
static propTypes = {
visible: PropTypes.bool.isRequired,
onLogin: PropTypes.func.isRequired,
}
onAuthResponse(response) {
this.props.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,
})
}
onAuthFailure(error) {
console.error(error)
}
render() {
if (!this.props.visible) {
return <span />
}
return (
<GoogleLogin
clientId={window.$$env['OAUTH_CLIENT_ID']}
onSuccess={this.onAuthResponse.bind(this)}
onFailure={this.onAuthFailure.bind(this)}
render={(renderProps) => (
<span onClick={renderProps.onClick} className="login btn btn-primary">
<span className="fa fa-google"/> Login with Google
</span>
)}
/>
)
}
}
const mapStateToProps = (state, ownProps) => {
return {
visible: ownProps.visible,
}
}
const mapDispatchToProps = (dispatch) => {
return {
onLogin: (payload) => dispatch(logIn(payload)),
}
}
const Login = connect(mapStateToProps, mapDispatchToProps)(LoginContainer)
export default Login
|
