1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-23 01:39:36 +01:00

Change SignupForm for loading UserStore from top level app

This commit is contained in:
Brett Sun 2016-01-11 18:24:55 +01:00
parent 1c4ca0d152
commit d867a3d9c1
2 changed files with 28 additions and 38 deletions

View File

@ -44,8 +44,10 @@ let LoginForm = React.createClass({
}, },
render() { render() {
const { headerMessage, submitMessage, location: { query: { email: emailQuery } } } = this.props; const {
console.log(emailQuery); headerMessage,
location: { query: { email: emailQuery } },
submitMessage } = this.props;
return ( return (
<Form <Form

View File

@ -3,9 +3,6 @@
import React from 'react'; import React from 'react';
import { History } from 'react-router'; import { History } from 'react-router';
import UserStore from '../../stores/user_store';
import UserActions from '../../actions/user_actions';
import GlobalNotificationModel from '../../models/global_notification_model'; import GlobalNotificationModel from '../../models/global_notification_model';
import GlobalNotificationActions from '../../actions/global_notification_actions'; import GlobalNotificationActions from '../../actions/global_notification_actions';
@ -24,8 +21,12 @@ let SignupForm = React.createClass({
headerMessage: React.PropTypes.string, headerMessage: React.PropTypes.string,
submitMessage: React.PropTypes.string, submitMessage: React.PropTypes.string,
handleSuccess: React.PropTypes.func, handleSuccess: React.PropTypes.func,
children: React.PropTypes.element, location: React.PropTypes.object,
location: React.PropTypes.object children: React.PropTypes.oneOfType([
React.PropTypes.arrayOf(React.PropTypes.element),
React.PropTypes.element,
React.PropTypes.string
])
}, },
mixins: [History], mixins: [History],
@ -37,25 +38,9 @@ let SignupForm = React.createClass({
}; };
}, },
getInitialState() {
return UserStore.getState();
},
componentDidMount() {
UserStore.listen(this.onChange);
},
componentWillUnmount() {
UserStore.unlisten(this.onChange);
},
onChange(state) {
this.setState(state);
},
handleSuccess(response) { handleSuccess(response) {
if (response.user) { if (response.user) {
let notification = new GlobalNotificationModel(getLangText('Sign up successful'), 'success', 50000); const notification = new GlobalNotificationModel(getLangText('Sign up successful'), 'success', 50000);
GlobalNotificationActions.appendGlobalNotification(notification); GlobalNotificationActions.appendGlobalNotification(notification);
// Refactor this to its own component // Refactor this to its own component
@ -66,19 +51,21 @@ let SignupForm = React.createClass({
}, },
getFormData() { getFormData() {
if (this.props.location.query.token){ const { token } = this.props.location.query;
return {token: this.props.location.query.token}; return token ? { token } : null;
}
return null;
}, },
render() { render() {
let tooltipPassword = getLangText('Your password must be at least 10 characters') + '.\n ' + const {
children,
headerMessage,
location: { query: { email: emailQuery } },
submitMessage } = this.props;
const tooltipPassword = getLangText('Your password must be at least 10 characters') + '.\n ' +
getLangText('This password is securing your digital property like a bank account') + '.\n ' + getLangText('This password is securing your digital property like a bank account') + '.\n ' +
getLangText('Store it in a safe place') + '!'; getLangText('Store it in a safe place') + '!';
let email = this.props.location.query.email || null;
return ( return (
<Form <Form
className="ascribe-form-bordered" className="ascribe-form-bordered"
@ -88,15 +75,16 @@ let SignupForm = React.createClass({
handleSuccess={this.handleSuccess} handleSuccess={this.handleSuccess}
buttons={ buttons={
<button type="submit" className="btn btn-default btn-wide"> <button type="submit" className="btn btn-default btn-wide">
{this.props.submitMessage} {submitMessage}
</button>} </button>
}
spinner={ spinner={
<span className="btn btn-default btn-wide btn-spinner"> <span className="btn btn-default btn-wide btn-spinner">
<AscribeSpinner color="dark-blue" size="md" /> <AscribeSpinner color="dark-blue" size="md" />
</span> </span>
}> }>
<div className="ascribe-form-header"> <div className="ascribe-form-header">
<h3>{this.props.headerMessage}</h3> <h3>{headerMessage}</h3>
</div> </div>
<Property <Property
name='email' name='email'
@ -128,7 +116,7 @@ let SignupForm = React.createClass({
autoComplete="on" autoComplete="on"
required/> required/>
</Property> </Property>
{this.props.children} {children}
<Property <Property
name="terms" name="terms"
className="ascribe-property-collapsible-toggle" className="ascribe-property-collapsible-toggle"