Skip to content

Commit d7d8bfc

Browse files
author
riteshsangwan
committed
implement social auth0 login
1 parent 5b0654a commit d7d8bfc

File tree

9 files changed

+195
-82
lines changed

9 files changed

+195
-82
lines changed

‎config/default.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,4 +9,7 @@ module.exports = {
99
// below env variables are visible in frontend
1010
GOOGLE_API_KEY: process.env.GOOGLE_API_KEY || 'AIzaSyCrL-O319wNJK8kk8J_JAYsWgu6yo5YsDI',
1111
API_BASE_PATH: process.env.API_BASE_PATH || 'http://localhost:3500',
12+
REACT_APP_AUTH0_CLIENT_ID: process.env.REACT_APP_AUTH0_CLIENT_ID || 'h7p6V93Shau3SSvqGrl6V4xrATlkrVGm',
13+
REACT_APP_AUTH0_CLIENT_DOMAIN: process.env.REACT_APP_AUTH0_CLIENT_DOMAIN || 'spanhawk.auth0.com',
14+
AUTH0_CALLBACK: 'http://localhost:3000',
1215
};

‎package.json

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -55,18 +55,18 @@
5555
"rc-tooltip": "^3.4.2",
5656
"react": "^15.3.2",
5757
"react-breadcrumbs": "^1.5.1",
58-
"react-count-down": "^1.0.3",
5958
"react-click-outside": "^2.2.0",
59+
"react-count-down": "^1.0.3",
6060
"react-css-modules": "^3.7.10",
6161
"react-date-picker": "^5.3.28",
6262
"react-dom": "^15.3.2",
63+
"react-dropdown": "^1.2.0",
6364
"react-flexbox-grid": "^0.10.2",
6465
"react-google-maps": "^6.0.1",
65-
"react-modal": "^1.5.2",
66-
"react-dropdown": "^1.2.0",
66+
"react-highcharts": "^11.0.0",
6767
"react-icheck": "^0.3.6",
6868
"react-input-range": "^0.9.3",
69-
"react-highcharts": "^11.0.0",
69+
"react-modal": "^1.5.2",
7070
"react-redux": "^4.0.0",
7171
"react-redux-toastr": "^4.2.2",
7272
"react-router": "^2.8.1",
@@ -75,8 +75,8 @@
7575
"react-simple-dropdown": "^1.1.5",
7676
"react-slick": "^0.14.5",
7777
"react-star-rating-component": "^1.2.2",
78-
"react-timeago": "^3.1.3",
7978
"react-tabs": "^0.8.2",
79+
"react-timeago": "^3.1.3",
8080
"reactable": "^0.14.1",
8181
"redbox-react": "^1.2.10",
8282
"redux": "^3.0.0",
@@ -86,8 +86,8 @@
8686
"redux-logger": "^2.6.1",
8787
"redux-thunk": "^2.0.0",
8888
"sass-loader": "^4.0.0",
89-
"socket.io-client": "^1.7.1",
9089
"slick-carousel": "^1.6.0",
90+
"socket.io-client": "^1.7.1",
9191
"style-loader": "^0.13.0",
9292
"superagent": "^2.3.0",
9393
"superagent-promise": "^1.1.0",

‎src/api/User.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,14 +56,17 @@ class UserApi {
5656
})});
5757
}
5858

59-
registerSocialUser(name, email) {
59+
registerSocialUser(name, email, token) {
6060
const url = `${this.basePath}/api/v1/login/social`;
6161

6262
return reqwest({
6363
url,
6464
method: 'post',
6565
type: 'json',
6666
contentType: 'application/json',
67+
headers: {
68+
Authorization: `Bearer ${token}`,
69+
},
6770
data: JSON.stringify({
6871
name,
6972
email,

‎src/config/index.js

Lines changed: 0 additions & 23 deletions
This file was deleted.

‎src/routes/Home/components/LoginModal/LoginModal.jsx

Lines changed: 33 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,8 @@ import TextField from 'components/TextField';
99
import styles from './LoginModal.scss';
1010
import APIService from '../../../../services/APIService';
1111
import {toastr} from 'react-redux-toastr';
12-
import {browserHistory} from 'react-router';
12+
import {defaultAuth0Service} from '../../../../services/AuthService';
13+
1314
/*
1415
* customStyles
1516
*/
@@ -89,16 +90,42 @@ class LogInModal extends React.Component {
8990
this.setState({showForgetPassword: true});
9091
}
9192

93+
/**
94+
* Login using google social network,
95+
* this method internally uses auth0 service
96+
*/
97+
googleLogin() {
98+
defaultAuth0Service.login({connection: 'google-oauth2'}, (error) => {
99+
if (error) {
100+
const message = error.message || 'something went wrong, please try again';
101+
toastr.error(message);
102+
}
103+
});
104+
}
105+
106+
/**
107+
* Login using facebook social network,
108+
* this method internally uses auth0 service
109+
*/
110+
facebookLogin() {
111+
defaultAuth0Service.login({connection: 'facebook'}, (error) => {
112+
if (error) {
113+
const message = error.message || 'something went wrong, please try again';
114+
toastr.error(message);
115+
}
116+
});
117+
}
118+
92119
/**
93120
* This method is invoked when reset password request is submitted
94121
*/
95122
handleForgetPassword(data) {
96-
APIService.forgotPassword({email: data.emailUp}).then((result) => {
123+
APIService.forgotPassword({email: data.emailUp}).then(() => {
97124
toastr.success('', 'Reset password link emailed to your email address');
98125
this.closeLoginModal();
99126
}).catch((reason) => {
100127
const message = reason.response.body.error || 'something went wrong, please try again';
101-
toastr.error(`${message}`);
128+
toastr.error(message);
102129
this.closeLoginModal();
103130
});
104131
}
@@ -128,14 +155,14 @@ class LogInModal extends React.Component {
128155
{this.state.showForgetPassword === false &&
129156
<form styleName="login-form" onSubmit={handleSubmit}>
130157
<div styleName="login-with-fb">
131-
<a href="javascript:;">
158+
<a href="javascript:;" onClick={this.facebookLogin.bind(this)}>
132159
<i styleName="icon-facebook" />
133160
<span>Log In with Facebook</span>
134161
</a>
135162
</div>
136163

137164
<div styleName="login-with-gplus">
138-
<a href="javascript:;">
165+
<a href="javascript:;" onClick={this.googleLogin.bind(this)}>
139166
<i styleName="icon-gplus" />
140167
<span>Log In with Google Plus</span>
141168
</a>
@@ -220,7 +247,7 @@ LogInModal.propTypes = {
220247

221248
const fields = ['remember', 'email', 'password', 'emailUp', 'passwordUp'];
222249

223-
const validate = (values, props) => {
250+
const validate = (values) => {
224251
const errors = {};
225252
if (!values.emailUp && !values.email) {
226253
errors.emailUp = 'Email is required';

‎src/routes/Home/components/SignupModal/SignupModal.jsx

Lines changed: 30 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ import Modal from 'react-modal';
66
import Button from 'components/Button';
77
import TextField from 'components/TextField';
88
import styles from './SignupModal.scss';
9+
import {defaultAuth0Service} from '../../../../services/AuthService';
10+
import {toastr} from 'react-redux-toastr';
911

1012
/*
1113
* customStyles
@@ -79,6 +81,32 @@ class SignupModal extends React.Component {
7981
}, 100);
8082
}
8183

84+
/**
85+
* Login using google social network,
86+
* this method internally uses auth0 service
87+
*/
88+
googleLogin() {
89+
defaultAuth0Service.login({connection: 'google-oauth2'}, (error) => {
90+
if (error) {
91+
const message = error.message || 'something went wrong, please try again';
92+
toastr.error(message);
93+
}
94+
});
95+
}
96+
97+
/**
98+
* Login using facebook social network,
99+
* this method internally uses auth0 service
100+
*/
101+
facebookLogin() {
102+
defaultAuth0Service.login({connection: 'facebook'}, (error) => {
103+
if (error) {
104+
const message = error.message || 'something went wrong, please try again';
105+
toastr.error(message);
106+
}
107+
});
108+
}
109+
82110
render() {
83111
const {handleSubmit, fields, handleSigned, signedUser, hasError, errorText} = this.props;
84112

@@ -103,14 +131,14 @@ class SignupModal extends React.Component {
103131

104132
<form styleName="login-form" onSubmit={handleSubmit}>
105133
<div styleName="login-with-fb">
106-
<a href="javascript:;">
134+
<a href="javascript:;" onClick={this.facebookLogin.bind(this)}>
107135
<i styleName="icon-facebook" />
108136
<span>Sign Up with Facebook</span>
109137
</a>
110138
</div>
111139

112140
<div styleName="login-with-gplus">
113-
<a href="javascript:;">
141+
<a href="javascript:;" onClick={this.googleLogin.bind(this)}>
114142
<i styleName="icon-gplus" />
115143
<span>Sign Up with Google Plus</span>
116144
</a>

‎src/routes/index.js

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import DroneDetailsRoute from './DroneDetails';
2020
import AvailablePackagesRoute from './AvailablePackages';
2121
import ProviderDetailsRoute from './ProviderDetails';
2222
import ResetPasswordRoute from './ResetPassword';
23+
import {defaultAuth0Service} from '../services/AuthService';
2324

2425
export const createRoutes = (store) => ({
2526
path: '/',
@@ -28,8 +29,15 @@ export const createRoutes = (store) => ({
2829
component: CoreLayout,
2930
indexRoute: {
3031
onEnter: (nextState, replace, cb) => {
31-
replace('/dashboard');
32-
cb();
32+
// parse the hash if present
33+
if (nextState.location.hash) {
34+
defaultAuth0Service.parseHash(nextState.location.hash);
35+
replace('/dashboard');
36+
cb();
37+
} else {
38+
replace('/dashboard');
39+
cb();
40+
}
3341
},
3442
},
3543
childRoutes: [

0 commit comments

Comments
 (0)