From 7d6985647ff57f435000b0d07860f8695e81fd0c Mon Sep 17 00:00:00 2001
From: Dessalines <tyhou13@gmx.com>
Date: Tue, 14 Jul 2020 13:17:51 -0400
Subject: [PATCH] Some password reset UI fixes. Fixes #955

---
 ui/src/components/comment-form.tsx |  5 ++++-
 ui/src/components/login.tsx        | 25 +++++++++++++++++--------
 ui/translations/en.json            |  1 +
 3 files changed, 22 insertions(+), 9 deletions(-)

diff --git a/ui/src/components/comment-form.tsx b/ui/src/components/comment-form.tsx
index 00b4fe1e..b9f1e815 100644
--- 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 eb1d0baf..4dd3821a 100644
--- 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 cb4347f1..90c4a995 100644
--- 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.",
-- 
2.44.1