2018-01-12 22:58:21 +01:00
|
|
|
import Inferno from 'inferno';
|
2018-02-22 07:47:39 +01:00
|
|
|
import { Component } from 'inferno';
|
2018-01-12 22:58:21 +01:00
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
import store from 'store';
|
2018-06-25 06:16:10 +02:00
|
|
|
import swal from 'sweetalert2';
|
2018-01-12 22:58:21 +01:00
|
|
|
|
|
|
|
import { Modal } from '../../structure/Modal';
|
2018-01-13 19:57:14 +01:00
|
|
|
import { LoginForm } from './LoginForm';
|
2018-03-10 18:42:12 +01:00
|
|
|
import { MyAccount } from './MyAccount';
|
2018-01-12 22:58:21 +01:00
|
|
|
|
2018-05-19 00:21:14 +02:00
|
|
|
import { DEFAULT_USER_DATA } from '../../../Constants';
|
2018-01-13 20:09:15 +01:00
|
|
|
import { request } from '../../../Helpers';
|
2018-01-12 22:58:21 +01:00
|
|
|
|
|
|
|
export class AccountManager extends Component {
|
|
|
|
constructor (props) {
|
|
|
|
super(props);
|
|
|
|
|
|
|
|
PropTypes.checkPropTypes({
|
|
|
|
updater: PropTypes.object.isRequired,
|
|
|
|
}, props, 'prop', 'AccountManager');
|
|
|
|
|
2018-03-10 00:31:27 +01:00
|
|
|
const userData = store.get('LexicongaUserData');
|
|
|
|
|
2018-01-12 22:58:21 +01:00
|
|
|
this.state = {
|
|
|
|
isLoggedIn: false,
|
2018-03-10 00:31:27 +01:00
|
|
|
userData: {
|
2018-06-17 23:24:18 +02:00
|
|
|
email: userData && userData.hasOwnProperty('email') ? userData.email : DEFAULT_USER_DATA.email,
|
|
|
|
publicName: userData && userData.hasOwnProperty('publicName') ? userData.publicName : DEFAULT_USER_DATA.publicName,
|
|
|
|
allowEmails: userData && userData.hasOwnProperty('allowEmails') ? userData.allowEmails : DEFAULT_USER_DATA.allowEmails,
|
2018-03-10 00:31:27 +01:00
|
|
|
},
|
|
|
|
userDictionaries: [],
|
2018-01-12 22:58:21 +01:00
|
|
|
};
|
2018-03-10 00:31:27 +01:00
|
|
|
|
|
|
|
this.getDictionaryNames();
|
2018-01-12 22:58:21 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
logIn (email, password) {
|
2018-06-25 07:03:37 +02:00
|
|
|
return request('login', { email, password }, response => this.handleResponse(response, userData => {
|
|
|
|
const nameGreeting = userData.hasOwnProperty('publicName') && userData.publicName !== '' ? ', ' + userData.publicName : '';
|
|
|
|
swal({
|
|
|
|
title: `Welcome back${nameGreeting}!`,
|
|
|
|
text: 'You have been logged in successfully.',
|
|
|
|
type: 'success',
|
|
|
|
confirmButtonClass: 'button',
|
|
|
|
buttonsStyling: false,
|
|
|
|
});
|
|
|
|
}));
|
2018-01-12 22:58:21 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
logOut () {
|
|
|
|
store.remove('LexicongaToken');
|
2018-03-10 00:31:27 +01:00
|
|
|
store.remove('LexicongaUserData');
|
|
|
|
this.setState({
|
|
|
|
isLoggedIn: false,
|
2018-05-19 00:21:14 +02:00
|
|
|
userData: Object.assign({}, DEFAULT_USER_DATA),
|
2018-03-10 00:31:27 +01:00
|
|
|
userDictionaries: [],
|
2018-06-25 06:16:10 +02:00
|
|
|
}, () => {
|
|
|
|
swal({
|
|
|
|
title: 'Logged Out',
|
|
|
|
text: 'You have been logged out. Your work will not be synced to your account until you log in again.',
|
|
|
|
type: 'success',
|
|
|
|
confirmButtonClass: 'button',
|
|
|
|
buttonsStyling: false,
|
|
|
|
});
|
2018-03-10 00:31:27 +01:00
|
|
|
});
|
2018-01-12 22:58:21 +01:00
|
|
|
}
|
|
|
|
|
2018-01-21 22:22:31 +01:00
|
|
|
signUp (email, password, userData) {
|
|
|
|
request('create-account', {
|
|
|
|
email,
|
|
|
|
password,
|
|
|
|
userData,
|
2018-06-25 07:03:37 +02:00
|
|
|
}, response => this.handleResponse(response, () => {
|
|
|
|
const nameGreeting = userData.hasOwnProperty('publicName') && userData.publicName !== '' ? ', ' + userData.publicName : '';
|
|
|
|
swal({
|
|
|
|
title: `Welcome${nameGreeting}!`,
|
|
|
|
text: 'Your account was created successfully! We hope you enjoy what a Lexiconga account can provide for you!',
|
|
|
|
type: 'success',
|
|
|
|
confirmButtonClass: 'button',
|
|
|
|
buttonsStyling: false,
|
|
|
|
});
|
|
|
|
}));
|
2018-01-21 22:22:31 +01:00
|
|
|
}
|
|
|
|
|
2018-06-25 06:06:03 +02:00
|
|
|
updateUserData (token, userData, callback = () => {}) {
|
|
|
|
store.set('LexicongaToken', token);
|
|
|
|
store.set('LexicongaUserData', userData);
|
|
|
|
this.setState({
|
|
|
|
isLoggedIn: true,
|
|
|
|
userData,
|
|
|
|
}, () => {
|
|
|
|
callback();
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2018-06-25 07:03:37 +02:00
|
|
|
handleResponse (response, successCallback = () => {}) {
|
2018-01-21 22:22:31 +01:00
|
|
|
const { data, error } = response;
|
|
|
|
if (error) {
|
|
|
|
console.error(data);
|
|
|
|
} else {
|
2018-06-25 06:06:03 +02:00
|
|
|
this.updateUserData(data.token, data.user, () => {
|
2018-06-25 07:03:37 +02:00
|
|
|
successCallback(data.user);
|
2018-03-10 00:31:27 +01:00
|
|
|
this.getDictionaryNames();
|
2018-01-21 22:22:31 +01:00
|
|
|
this.props.updater.sync();
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2018-06-25 06:06:03 +02:00
|
|
|
sendUserData (newUserData, callback = () => {}) {
|
2018-03-10 00:31:27 +01:00
|
|
|
const token = store.get('LexicongaToken');
|
|
|
|
|
|
|
|
if (token) {
|
|
|
|
store.set('LexicongaUserData', newUserData);
|
|
|
|
this.setState({ userData: newUserData }, () => {
|
|
|
|
request('set-user-data', { token, userData: newUserData }, (response) => {
|
|
|
|
const {data, error} = response;
|
|
|
|
if (error) {
|
|
|
|
console.error(data);
|
|
|
|
} else {
|
|
|
|
console.log(data);
|
2018-06-25 06:06:03 +02:00
|
|
|
this.updateUserData(data.token, data.userData, callback);
|
2018-03-10 00:31:27 +01:00
|
|
|
}
|
|
|
|
})
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
getDictionaryNames () {
|
|
|
|
const token = store.get('LexicongaToken');
|
|
|
|
|
|
|
|
if (token) {
|
|
|
|
return request('get-all-dictionary-names', { token }, (response) => {
|
|
|
|
const {data, error} = response;
|
|
|
|
if (error) {
|
|
|
|
console.error(data);
|
|
|
|
} else {
|
|
|
|
this.setState({ userDictionaries: data });
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2018-01-12 22:58:21 +01:00
|
|
|
render () {
|
|
|
|
const token = store.get('LexicongaToken');
|
|
|
|
|
|
|
|
if (token) {
|
2018-03-10 00:31:27 +01:00
|
|
|
const { userData } = this.state;
|
|
|
|
|
2018-01-12 22:58:21 +01:00
|
|
|
return (
|
|
|
|
<div>
|
2018-03-10 00:31:27 +01:00
|
|
|
<Modal buttonText='Account' title='My Account' onShow={ this.getDictionaryNames.bind(this) }>
|
2018-03-10 18:42:12 +01:00
|
|
|
<MyAccount
|
2018-03-10 00:31:27 +01:00
|
|
|
email={ userData.email }
|
2018-06-23 21:30:04 +02:00
|
|
|
// username={ userData.username }
|
2018-03-10 00:31:27 +01:00
|
|
|
publicName={ userData.publicName }
|
|
|
|
allowEmails={ userData.allowEmails }
|
2018-03-10 18:42:12 +01:00
|
|
|
userDictionaries={ this.state.userDictionaries }
|
2018-06-25 06:06:03 +02:00
|
|
|
sendUserData={ this.sendUserData.bind(this) }
|
2018-03-10 18:42:12 +01:00
|
|
|
changeDictionary={ () => {} } />
|
2018-01-12 22:58:21 +01:00
|
|
|
</Modal>
|
|
|
|
<a className='button' onClick={this.logOut.bind(this)}>
|
|
|
|
Log Out
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
return (
|
|
|
|
<Modal buttonText='Log In/Sign Up' title='Log In/Sign Up'>
|
2018-01-21 22:22:31 +01:00
|
|
|
<LoginForm logIn={this.logIn.bind(this)} signUp={this.signUp.bind(this)} />
|
2018-01-12 22:58:21 +01:00
|
|
|
</Modal>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|