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)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy