Merge pull request #2489 from jryans/auth-text-and-links

Update text and links in authentication flows

src/components/structures/MatrixChat.js

@@ -1955,7 +1955,6 @@ export default React.createClass({
                     customHsUrl={this.getCurrentHsUrl()}
                     customIsUrl={this.getCurrentIsUrl()}
                     onComplete={this.onLoginClick}
-                    onRegisterClick={this.onRegisterClick}
                     onLoginClick={this.onLoginClick} />
             );
         }

src/components/structures/auth/ForgotPassword.js

@@ -34,7 +34,6 @@ module.exports = React.createClass({
         customHsUrl: PropTypes.string,
         customIsUrl: PropTypes.string,
         onLoginClick: PropTypes.func,
-        onRegisterClick: PropTypes.func,
         onComplete: PropTypes.func.isRequired,
 
         // The default server name to use when the user hasn't specified
@@ -168,12 +167,6 @@ module.exports = React.createClass({
         this.props.onLoginClick();
     },
 
-    onRegisterClick: function(ev) {
-        ev.preventDefault();
-        ev.stopPropagation();
-        this.props.onRegisterClick();
-    },
-
     showErrorDialog: function(body, title) {
         const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
         Modal.createTrackedDialog('Forgot Password Error', '', ErrorDialog, {
@@ -195,7 +188,7 @@ module.exports = React.createClass({
             resetPasswordJsx = <Spinner />;
         } else if (this.state.progress === "sent_email") {
             resetPasswordJsx = (
-                <div className="mx_Login_prompt">
+                <div>
                     { _t("An email has been sent to %(emailAddress)s. Once you've followed the link it contains, " +
                         "click below.", { emailAddress: this.state.email }) }
                     <br />
@@ -205,7 +198,7 @@ module.exports = React.createClass({
             );
         } else if (this.state.progress === "complete") {
             resetPasswordJsx = (
-                <div className="mx_Login_prompt">
+                <div>
                     <p>{ _t('Your password has been reset') }.</p>
                     <p>{ _t('You have been logged out of all devices and will no longer receive push notifications. ' +
                         'To re-enable notifications, sign in again on each device') }.</p>
@@ -236,9 +229,9 @@ module.exports = React.createClass({
 
             resetPasswordJsx = (
             <div>
-                <div className="mx_Login_prompt">
+                <p>
                     { _t('To reset your password, enter the email address linked to your account') }:
-                </div>
+                </p>
                 <div>
                     <form onSubmit={this.onSubmitForm}>
                         <input className="mx_Login_field" ref="user" type="text"
@@ -263,11 +256,8 @@ module.exports = React.createClass({
                     </form>
                     { serverConfigSection }
                     { errorText }
-                    <a className="mx_Login_create" onClick={this.onLoginClick} href="#">
-                        { _t('Return to login screen') }
-                    </a>
-                    <a className="mx_Login_create" onClick={this.onRegisterClick} href="#">
-                        { _t('Create an account') }
+                    <a className="mx_Auth_changeFlow" onClick={this.onLoginClick} href="#">
+                        { _t('Sign in instead') }
                     </a>
                 </div>
             </div>
@@ -279,6 +269,7 @@ module.exports = React.createClass({
             <AuthPage>
                 <AuthHeader />
                 <AuthBody>
+                    <h2> { _t('Set a new password') } </h2>
                     {resetPasswordJsx}
                 </AuthBody>
             </AuthPage>

src/components/structures/auth/Login.js

@@ -526,7 +526,7 @@ module.exports = React.createClass({
         let loginAsGuestJsx;
         if (this.props.enableGuest) {
             loginAsGuestJsx =
-                <a className="mx_Login_create" onClick={this._onLoginAsGuestClick} href="#">
+                <a className="mx_Auth_changeFlow" onClick={this._onLoginAsGuestClick} href="#">
                     { _t('Try the app first') }
                 </a>;
         }
@@ -544,8 +544,6 @@ module.exports = React.createClass({
                 delayTimeMs={1000} />;
         }
 
-        const header = <h2>{ _t('Sign in') } { loader }</h2>;
-
         let errorTextSection;
         if (errorText) {
             errorTextSection = (
@@ -559,12 +557,15 @@ module.exports = React.createClass({
             <AuthPage>
                 <AuthHeader />
                 <AuthBody>
-                    { header }
+                    <h2>
+                        {_t('Sign in to your account')}
+                        {loader}
+                    </h2>
                     { errorTextSection }
                     { this.componentForStep(this.state.currentFlow) }
                     { serverConfig }
-                    <a className="mx_Login_create" onClick={this.onRegisterClick} href="#">
-                        { _t('Create an account') }
+                    <a className="mx_Auth_changeFlow" onClick={this.onRegisterClick} href="#">
+                        { _t('Create account') }
                     </a>
                     { loginAsGuestJsx }
                 </AuthBody>

src/components/structures/auth/Registration.js

@@ -457,7 +457,6 @@ module.exports = React.createClass({
 
         let errorText;
         const err = this.state.errorText || this.props.defaultServerDiscoveryError;
-        const header = <h2>{ _t('Create an account') }</h2>;
         if (err) {
             errorText = <div className="mx_Login_error">{ err }</div>;
         }
@@ -465,8 +464,8 @@ module.exports = React.createClass({
         let signIn;
         if (!this.state.doingUIAuth) {
             signIn = (
-                <a className="mx_Login_create" onClick={this.onLoginClick} href="#">
-                    { _t('I already have an account') }
+                <a className="mx_Auth_changeFlow" onClick={this.onLoginClick} href="#">
+                    { _t('Sign in instead') }
                 </a>
             );
         }
@@ -480,7 +479,7 @@ module.exports = React.createClass({
                         null}
                 />
                 <AuthBody>
-                    { header }
+                    <h2>{ _t('Create your account') }</h2>
                     { registerBody }
                     { signIn }
                     { errorText }