Some password reset UI fixes. Fixes #955

diff --git a/ui/src/components/comment-form.tsx b/ui/src/components/comment-form.tsx
index 00b4fe1ef703c4a7060e6ae7d17da1f2a7f0a65b..b9f1e815b66c661bb1f5e60d9e12e630470f32be 100644 (file)
--- a/ui/src/components/comment-form.tsx
+++ b/ui/src/components/comment-form.tsx
@@ -258,7 +258,10 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
               <use xlinkHref="#icon-alert-triangle"></use>
             </svg>
             <T i18nKey="must_login" class="d-inline">
-              #<Link to="/login">#</Link>
+              #
+              <Link class="alert-link" to="/login">
+                #
+              </Link>
             </T>
           </div>
         )}

diff --git a/ui/src/components/login.tsx b/ui/src/components/login.tsx
index eb1d0bafc7069f784d0019b61e7e34befe543324..4dd3821a3a3b6cc1fa9e1abe0aa87da86a641e97 100644 (file)
--- a/ui/src/components/login.tsx
+++ b/ui/src/components/login.tsx
@@ -120,14 +120,15 @@ export class Login extends Component<any, State> {
                 class="form-control"
                 required
               />
-              <button
-                type="button"
-                disabled={!validEmail(this.state.loginForm.username_or_email)}
-                onClick={linkEvent(this, this.handlePasswordReset)}
-                className="btn p-0 btn-link d-inline-block float-right text-muted small font-weight-bold"
-              >
-                {i18n.t('forgot_password')}
-              </button>
+              {validEmail(this.state.loginForm.username_or_email) && (
+                <button
+                  type="button"
+                  onClick={linkEvent(this, this.handlePasswordReset)}
+                  className="btn p-0 btn-link d-inline-block float-right text-muted small font-weight-bold"
+                >
+                  {i18n.t('forgot_password')}
+                </button>
+              )}
             </div>
           </div>
           <div class="form-group row">
@@ -186,6 +187,14 @@ export class Login extends Component<any, State> {
               onInput={linkEvent(this, this.handleRegisterEmailChange)}
               minLength={3}
             />
+            {!validEmail(this.state.registerForm.email) && (
+              <div class="mt-2 mb-0 alert alert-light" role="alert">
+                <svg class="icon icon-inline mr-2">
+                  <use xlinkHref="#icon-alert-triangle"></use>
+                </svg>
+                {i18n.t('no_password_reset')}
+              </div>
+            )}
           </div>
         </div>
 

diff --git a/ui/translations/en.json b/ui/translations/en.json
index cb4347f1ceeacb1c408662e5d55a2356d62f0d53..90c4a9959cb58a82560511ac2ebd465cbde28154 100644 (file)
--- a/ui/translations/en.json
+++ b/ui/translations/en.json
@@ -253,6 +253,7 @@
       "Couldn't find that username or email.",
     "password_incorrect": "Password incorrect.",
     "passwords_dont_match": "Passwords do not match.",
+    "no_password_reset": "You will not be able to reset your password without an email.",
     "invalid_username": "Invalid username.",
     "admin_already_created": "Sorry, there's already an admin.",
     "user_already_exists": "User already exists.",