mirror of
https://github.com/ascribe/onion.git
synced 2024-12-22 17:33:14 +01:00
Whitelabel login form
- also make some changes to signup form
This commit is contained in:
parent
6301c0fe46
commit
bc3093d4d7
@ -22,7 +22,8 @@ let LoginForm = React.createClass({
|
|||||||
propTypes: {
|
propTypes: {
|
||||||
headerMessage: React.PropTypes.string,
|
headerMessage: React.PropTypes.string,
|
||||||
submitMessage: React.PropTypes.string,
|
submitMessage: React.PropTypes.string,
|
||||||
location: React.PropTypes.object
|
location: React.PropTypes.object,
|
||||||
|
whitelabelName: React.PropTypes.string
|
||||||
},
|
},
|
||||||
|
|
||||||
mixins: [History],
|
mixins: [History],
|
||||||
@ -46,7 +47,8 @@ let LoginForm = React.createClass({
|
|||||||
render() {
|
render() {
|
||||||
const { headerMessage,
|
const { headerMessage,
|
||||||
location: { query: { email: emailQuery } },
|
location: { query: { email: emailQuery } },
|
||||||
submitMessage } = this.props;
|
submitMessage,
|
||||||
|
whitelabelName } = this.props;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Form
|
<Form
|
||||||
@ -67,7 +69,7 @@ let LoginForm = React.createClass({
|
|||||||
</span>
|
</span>
|
||||||
}>
|
}>
|
||||||
<div className="ascribe-form-header">
|
<div className="ascribe-form-header">
|
||||||
<h3>{headerMessage}</h3>
|
<h3>{whitelabelName ? `Welcome to ${whitelabelName}` : headerMessage}</h3>
|
||||||
</div>
|
</div>
|
||||||
<Property
|
<Property
|
||||||
name='email'
|
name='email'
|
||||||
|
@ -29,7 +29,7 @@ let SignupForm = React.createClass({
|
|||||||
React.PropTypes.element,
|
React.PropTypes.element,
|
||||||
React.PropTypes.string
|
React.PropTypes.string
|
||||||
]),
|
]),
|
||||||
whitelabel: React.PropTypes.object
|
whitelabelName: React.PropTypes.string
|
||||||
},
|
},
|
||||||
|
|
||||||
mixins: [History],
|
mixins: [History],
|
||||||
@ -63,11 +63,7 @@ let SignupForm = React.createClass({
|
|||||||
headerMessage,
|
headerMessage,
|
||||||
location: { query: { email: emailQuery } },
|
location: { query: { email: emailQuery } },
|
||||||
submitMessage,
|
submitMessage,
|
||||||
whitelabel: { name: whitelabelName} } = this.props;
|
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') + '!';
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Form
|
<Form
|
||||||
@ -101,18 +97,16 @@ let SignupForm = React.createClass({
|
|||||||
</Property>
|
</Property>
|
||||||
<Property
|
<Property
|
||||||
name='password'
|
name='password'
|
||||||
label={getLangText('Password')}
|
label={getLangText('Password')}>
|
||||||
tooltip={tooltipPassword}>
|
|
||||||
<input
|
<input
|
||||||
type="password"
|
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"
|
autoComplete="on"
|
||||||
required/>
|
required/>
|
||||||
</Property>
|
</Property>
|
||||||
<Property
|
<Property
|
||||||
name='password_confirm'
|
name='password_confirm'
|
||||||
label={getLangText('Confirm Password')}
|
label={getLangText('Confirm Password')}>
|
||||||
tooltip={tooltipPassword}>
|
|
||||||
<input
|
<input
|
||||||
type="password"
|
type="password"
|
||||||
placeholder={getLangText('Enter your password once again')}
|
placeholder={getLangText('Enter your password once again')}
|
||||||
|
@ -20,13 +20,18 @@ let LoginContainer = React.createClass({
|
|||||||
},
|
},
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
const { whitelabel: { name: whitelabelName },
|
||||||
|
location } = this.props;
|
||||||
|
|
||||||
setDocumentTitle(getLangText('Log in'));
|
setDocumentTitle(getLangText('Log in'));
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="ascribe-login-wrapper">
|
<div className="ascribe-login-wrapper">
|
||||||
<LoginForm location={this.props.location} />
|
<LoginForm
|
||||||
|
location={location}
|
||||||
|
whitelabelName={whitelabelName} />
|
||||||
<div className="ascribe-login-text">
|
<div className="ascribe-login-text">
|
||||||
{getLangText('Not an ascribe user')}? <Link to="/signup">{getLangText('Sign up')}...</Link><br/>
|
{getLangText(`Not a ${whitelabelName || 'ascribe'} user`)}? <Link to="/signup">{getLangText('Sign up')}...</Link><br/>
|
||||||
{getLangText('Forgot my password')}? <Link to="/password_reset">{getLangText('Rescue me')}...</Link>
|
{getLangText('Forgot my password')}? <Link to="/password_reset">{getLangText('Rescue me')}...</Link>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -34,7 +34,8 @@ let SignupContainer = React.createClass({
|
|||||||
},
|
},
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { location, whitelabel } = this.props;
|
const { location,
|
||||||
|
whitelabel: { name: whitelabelName } } = this.props;
|
||||||
const { message, submitted } = this.state;
|
const { message, submitted } = this.state;
|
||||||
|
|
||||||
setDocumentTitle(getLangText('Sign up'));
|
setDocumentTitle(getLangText('Sign up'));
|
||||||
@ -53,10 +54,10 @@ let SignupContainer = React.createClass({
|
|||||||
<div className="ascribe-login-wrapper">
|
<div className="ascribe-login-wrapper">
|
||||||
<SignupForm
|
<SignupForm
|
||||||
handleSuccess={this.handleSuccess}
|
handleSuccess={this.handleSuccess}
|
||||||
whitelabel={whitelabel}
|
whitelabelName={whitelabelName}
|
||||||
location={location}/>
|
location={location}/>
|
||||||
<div className="ascribe-login-text">
|
<div className="ascribe-login-text">
|
||||||
{getLangText(`Already a ${whitelabel.name || 'ascribe'} user`)}? <Link to="/login">{getLangText('Log in')}...</Link><br/>
|
{getLangText(`Already a ${whitelabelName || 'ascribe'} user`)}? <Link to="/login">{getLangText('Log in')}...</Link><br/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user