Whitelabel login form

- also make some changes to signup form
This commit is contained in:
Tim Daubenschütz 2016-03-07 14:04:34 +01:00
parent 6301c0fe46
commit bc3093d4d7
4 changed files with 21 additions and 19 deletions

View File

@ -22,7 +22,8 @@ let LoginForm = React.createClass({
propTypes: {
headerMessage: React.PropTypes.string,
submitMessage: React.PropTypes.string,
location: React.PropTypes.object
location: React.PropTypes.object,
whitelabelName: React.PropTypes.string
},
mixins: [History],
@ -46,7 +47,8 @@ let LoginForm = React.createClass({
render() {
const { headerMessage,
location: { query: { email: emailQuery } },
submitMessage } = this.props;
submitMessage,
whitelabelName } = this.props;
return (
<Form
@ -67,7 +69,7 @@ let LoginForm = React.createClass({
</span>
}>
<div className="ascribe-form-header">
<h3>{headerMessage}</h3>
<h3>{whitelabelName ? `Welcome to ${whitelabelName}` : headerMessage}</h3>
</div>
<Property
name='email'

View File

@ -29,7 +29,7 @@ let SignupForm = React.createClass({
React.PropTypes.element,
React.PropTypes.string
]),
whitelabel: React.PropTypes.object
whitelabelName: React.PropTypes.string
},
mixins: [History],
@ -63,11 +63,7 @@ let SignupForm = React.createClass({
headerMessage,
location: { query: { email: emailQuery } },
submitMessage,
whitelabel: { name: whitelabelName} } = 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('Store it in a safe place') + '!';
whitelabelName } = this.props;
return (
<Form
@ -101,18 +97,16 @@ let SignupForm = React.createClass({
</Property>
<Property
name='password'
label={getLangText('Password')}
tooltip={tooltipPassword}>
label={getLangText('Password')}>
<input
type="password"
placeholder={getLangText('Use a combination of minimum 10 chars and numbers')}
placeholder={getLangText('Use a combination of minimum 10 characters and numbers')}
autoComplete="on"
required/>
</Property>
<Property
name='password_confirm'
label={getLangText('Confirm Password')}
tooltip={tooltipPassword}>
label={getLangText('Confirm Password')}>
<input
type="password"
placeholder={getLangText('Enter your password once again')}

View File

@ -20,13 +20,18 @@ let LoginContainer = React.createClass({
},
render() {
const { whitelabel: { name: whitelabelName },
location } = this.props;
setDocumentTitle(getLangText('Log in'));
return (
<div className="ascribe-login-wrapper">
<LoginForm location={this.props.location} />
<LoginForm
location={location}
whitelabelName={whitelabelName} />
<div className="ascribe-login-text">
{getLangText('Not an ascribe user')}&#63; <Link to="/signup">{getLangText('Sign up')}...</Link><br/>
{getLangText(`Not a ${whitelabelName || 'ascribe'} user`)}&#63; <Link to="/signup">{getLangText('Sign up')}...</Link><br/>
{getLangText('Forgot my password')}&#63; <Link to="/password_reset">{getLangText('Rescue me')}...</Link>
</div>
</div>

View File

@ -34,7 +34,8 @@ let SignupContainer = React.createClass({
},
render() {
const { location, whitelabel } = this.props;
const { location,
whitelabel: { name: whitelabelName } } = this.props;
const { message, submitted } = this.state;
setDocumentTitle(getLangText('Sign up'));
@ -53,10 +54,10 @@ let SignupContainer = React.createClass({
<div className="ascribe-login-wrapper">
<SignupForm
handleSuccess={this.handleSuccess}
whitelabel={whitelabel}
whitelabelName={whitelabelName}
location={location}/>
<div className="ascribe-login-text">
{getLangText(`Already a ${whitelabel.name || 'ascribe'} user`)}&#63; <Link to="/login">{getLangText('Log in')}...</Link><br/>
{getLangText(`Already a ${whitelabelName || 'ascribe'} user`)}&#63; <Link to="/login">{getLangText('Log in')}...</Link><br/>
</div>
</div>