From bc3093d4d7218286b21e69a3505a8a334596d14e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= <tim@ascribe.io>
Date: Mon, 7 Mar 2016 14:04:34 +0100
Subject: [PATCH] Whitelabel login form

- also make some changes to signup form
---
 js/components/ascribe_forms/form_login.js  |  8 +++++---
 js/components/ascribe_forms/form_signup.js | 16 +++++-----------
 js/components/login_container.js           |  9 +++++++--
 js/components/signup_container.js          |  7 ++++---
 4 files changed, 21 insertions(+), 19 deletions(-)

diff --git a/js/components/ascribe_forms/form_login.js b/js/components/ascribe_forms/form_login.js
index 062b4709..2e04e450 100644
--- a/js/components/ascribe_forms/form_login.js
+++ b/js/components/ascribe_forms/form_login.js
@@ -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'
diff --git a/js/components/ascribe_forms/form_signup.js b/js/components/ascribe_forms/form_signup.js
index 73a4ad3f..b52eaf6c 100644
--- a/js/components/ascribe_forms/form_signup.js
+++ b/js/components/ascribe_forms/form_signup.js
@@ -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')}
diff --git a/js/components/login_container.js b/js/components/login_container.js
index 00c89328..c66d0b21 100644
--- a/js/components/login_container.js
+++ b/js/components/login_container.js
@@ -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>
diff --git a/js/components/signup_container.js b/js/components/signup_container.js
index 8585cfb1..7fea7ff5 100644
--- a/js/components/signup_container.js
+++ b/js/components/signup_container.js
@@ -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>