Registration form: Client side validation + better display of server validation errors

Fixes validation errors during registration, previously errors from BE haven't been parsed and displayed to user as json

Before

After

Screen_Recording_2018-12-05_at_19.32.37

src/components/registration/registration.js

 import oauthApi from '../../services/new_api/oauth.js'
+import { humanizeErrors } from '../../modules/errors'
 
 const registration = {
   data: () => ({
     user: {},
-    error: false,
+    errors: [],
     registering: false
   }),
   created () {
@@ -37,7 +38,8 @@ const registration = {
                   app,
                   instance: data.instance,
                   username: this.user.username,
-                  password: this.user.password})
+                  password: this.user.password
+                })
                 .then((result) => {
                   this.$store.commit('setToken', result.access_token)
                   this.$store.dispatch('loginUser', result.access_token)
@@ -47,10 +49,10 @@ const registration = {
           } else {
             this.registering = false
             response.json().then((data) => {
-              this.error = data.error
+              this.errors = humanizeErrors(JSON.parse(data.error))
             })
           }
-        }
+        },
       )
     }
   }