[Login] Fix username error bug; Add pw error checks (#3067)

sillsdev · May 2, 2024 · dc301f3 · dc301f3
1 parent 63c6d71
commit dc301f3
Showing 1 changed file with 17 additions and 5 deletions.
diff --git a/src/components/Login/Signup.tsx b/src/components/Login/Signup.tsx
@@ -102,14 +102,24 @@ export default function Signup(props: SignupProps): ReactElement {
     dispatch(reset());
   }, [dispatch]);
 
-  const errorField = (field: SignupField): void => {
-    setFieldError((prev) => ({ ...prev, [field]: true }));
+  const errorField = (field: SignupField, error: boolean): void => {
+    setFieldError((prev) => ({ ...prev, [field]: error }));
   };
 
   const checkUsername = (): void => {
-    if (!meetsUsernameRequirements(fieldText[SignupField.Username])) {
-      errorField(SignupField.Username);
-    }
+    const username = fieldText[SignupField.Username].trim();
+    errorField(SignupField.Username, !meetsUsernameRequirements(username));
+  };
+
+  const checkPassword1 = (): void => {
+    const password1 = fieldText[SignupField.Password1].trim();
+    errorField(SignupField.Password1, !meetsPasswordRequirements(password1));
+  };
+
+  const checkPassword2 = (): void => {
+    const password1 = fieldText[SignupField.Password1].trim();
+    const password2 = fieldText[SignupField.Password2].trim();
+    errorField(SignupField.Password2, password1 !== password2);
   };
 
   const updateField = (
@@ -213,6 +223,7 @@ export default function Signup(props: SignupProps): ReactElement {
               helperText={t("login.passwordRequirements")}
               id={SignupId.FieldPassword1}
               label={t("login.password")}
+              onBlur={() => checkPassword1()}
               onChange={(e) => updateField(e, SignupField.Password1)}
               type="password"
               value={fieldText[SignupField.Password1]}
@@ -230,6 +241,7 @@ export default function Signup(props: SignupProps): ReactElement {
               }
               id={SignupId.FieldPassword2}
               label={t("login.confirmPassword")}
+              onBlur={() => checkPassword2()}
               onChange={(e) => updateField(e, SignupField.Password2)}
               type="password"
               value={fieldText[SignupField.Password2]}