refactor form component validation into class

js/components/forms/new_project.js

@@ -9,6 +9,39 @@ const VALIDATIONS = {
   showEmptyError: "environmentsHaveNames",
 }
 
+class Validator {
+  constructor(validations) {
+    this.validations = validations
+  }
+
+  errorList() {
+    let errors = {}
+    this.map((key) => {
+      errors[key] = false
+    })
+    return errors
+  }
+
+  map(callback) {
+    Object.keys(this.validations).map((k) => callback(k))
+  }
+
+  update(object) {
+    this.map((errName) => {
+      if (object[this.validations[errName]]()) {
+        object.errors[errName] = false
+      }
+    })
+  }
+
+  validate(object) {
+    this.map((errName) => {
+      object.errors[errName] = !object[this.validations[errName]]()
+    })
+    return Object.values(object.errors).every(e => e)
+  }
+}
+
 export default {
   name: 'new-project',
 
@@ -37,13 +70,11 @@ export default {
       : [""]
     ).map(createEnvironment)
 
-    let errors = {}
+    const validator = new Validator(VALIDATIONS)
-    Object.keys(VALIDATIONS).map((key) => {
-      errors[key] = false
-    })
 
     return {
-      errors,
+      validator,
+      errors: validator.errorList(),
       environments,
       name,
     }
@@ -54,12 +85,7 @@ export default {
   },
 
   updated: function() {
-    Object.keys(VALIDATIONS).map((errName) => {
+    this.validator.update(this)
-      const func = VALIDATIONS[errName]
-      if (this[func]()) {
-        this.errors[errName] = false
-      }
-    })
   },
 
   methods: {
@@ -102,13 +128,7 @@ export default {
         return newVal.showValid && previous
       }, true)
 
-      Object.keys(VALIDATIONS).map((errName) => {
+      isValid = this.validator.validate(this) && isValid
-        const func = VALIDATIONS[errName]
-        if (!this[func]()) {
-          isValid = false
-          this.errors[errName] = true
-        }
-      })
 
       if (isValid) {
         this.openModal(modalName)