From 2946f0df15ba719c5e1ccc305fb86839e3a91c2b Mon Sep 17 00:00:00 2001
From: Isabelle Lavandero <30595954+thefifthisa@users.noreply.github.com>
Date: Thu, 12 Jul 2018 16:27:02 -0400
Subject: [PATCH] Update signup error messages (#10483)

* prints first error message only

* update signup error messages, missing password not working (wip)

* remove alerts, show notEmpty, first error only per param, update unit test

* move changes to client side
---
 website/client/app.vue                        | 22 ++++++++++++++++++-
 .../components/auth/registerLoginReset.vue    |  5 -----
 website/client/components/static/home.vue     |  5 -----
 website/server/controllers/api-v3/auth.js     | 20 ++++++++++-------
 4 files changed, 33 insertions(+), 19 deletions(-)

diff --git a/website/client/app.vue b/website/client/app.vue
index 342de7a146..21f4e09fb0 100644
--- a/website/client/app.vue
+++ b/website/client/app.vue
@@ -331,9 +331,29 @@ export default {
         ];
         if (notificationNotFoundMessage.indexOf(errorMessage) !== -1) snackbarTimeout = true;
 
+        let errorsToShow = [];
+        let usernameCheck = false;
+        let emailCheck = false;
+        let passwordCheck = false;
+        // show only the first error for each param
+        for (let e of errorData.errors) {
+          if (!usernameCheck && e.param === 'username') {
+            errorsToShow.push(e.message);
+            usernameCheck = true;
+          }
+          if (!emailCheck && e.param === 'email') {
+            errorsToShow.push(e.message);
+            emailCheck = true;
+          }
+          if (!passwordCheck && e.param === 'password') {
+            errorsToShow.push(e.message);
+            passwordCheck = true;
+          }
+        }
+        // dispatch as one snackbar notification
         this.$store.dispatch('snackbars:add', {
           title: 'Habitica',
-          text: errorMessage,
+          text: errorsToShow.join(' '),
           type: 'error',
           timeout: snackbarTimeout,
         });
diff --git a/website/client/components/auth/registerLoginReset.vue b/website/client/components/auth/registerLoginReset.vue
index e6dec1f27e..77d1c92cce 100644
--- a/website/client/components/auth/registerLoginReset.vue
+++ b/website/client/components/auth/registerLoginReset.vue
@@ -402,11 +402,6 @@ export default {
       window.location.href = redirectTo;
     },
     async login () {
-      if (!this.username) {
-        alert('Email is required');
-        return;
-      }
-
       await this.$store.dispatch('auth:login', {
         username: this.username,
         // email: this.email,
diff --git a/website/client/components/static/home.vue b/website/client/components/static/home.vue
index 7b14b09173..7482c9eba4 100644
--- a/website/client/components/static/home.vue
+++ b/website/client/components/static/home.vue
@@ -616,11 +616,6 @@
       },
       // @TODO this is totally duplicate from the registerLogin component
       async register () {
-        if (this.password !== this.passwordConfirm) {
-          alert('Passwords must match');
-          return;
-        }
-
         let groupInvite = '';
         if (this.$route.query && this.$route.query.p) {
           groupInvite = this.$route.query.p;
diff --git a/website/server/controllers/api-v3/auth.js b/website/server/controllers/api-v3/auth.js
index 62b3009c28..760a9f584b 100644
--- a/website/server/controllers/api-v3/auth.js
+++ b/website/server/controllers/api-v3/auth.js
@@ -101,21 +101,25 @@ api.registerLocal = {
     let existingUser = res.locals.user; // If adding local auth to social user
 
     req.checkBody({
-      email: {
-        notEmpty: {errorMessage: res.t('missingEmail')},
-        isEmail: {errorMessage: res.t('notAnEmail')},
-      },
       username: {
-        notEmpty: {errorMessage: res.t('missingUsername')},
-        isLength: {options: {min: USERNAME_LENGTH_MIN, max: USERNAME_LENGTH_MAX}, errorMessage: res.t('usernameWrongLength')},
+        notEmpty: true,
+        errorMessage: res.t('missingUsername'),
         // TODO use the constants in the error message above
+        isLength: {options: {min: USERNAME_LENGTH_MIN, max: USERNAME_LENGTH_MAX}, errorMessage: res.t('usernameWrongLength')},
         matches: {options: /^[-_a-zA-Z0-9]+$/, errorMessage: res.t('usernameBadCharacters')},
       },
+      email: {
+        notEmpty: true,
+        errorMessage: res.t('missingEmail'),
+        isEmail: {errorMessage: res.t('notAnEmail')},
+      },
       password: {
-        notEmpty: {errorMessage: res.t('missingPassword')},
+        notEmpty: true,
+        errorMessage: res.t('missingPassword'),
         equals: {options: [req.body.confirmPassword], errorMessage: res.t('passwordConfirmationMatch')},
       },
     });
+
     let validationErrors = req.validationErrors();
     if (validationErrors) throw validationErrors;
 
@@ -476,7 +480,7 @@ api.updateUsername = {
         notEmpty: {errorMessage: res.t('missingPassword')},
       },
       username: {
-        notEmpty: { errorMessage: res.t('missingUsername') },
+        notEmpty: {errorMessage: res.t('missingUsername')},
       },
     });