input validation

Author: daria-z

src/js/main.js

@@ -6,21 +6,17 @@ const view = createView();
 
 view.bindInputChange((value) => {
   model.updateInputValue(value);
-  const errors = model.getErrors();
-  view.renderErrors(errors);
+  view.renderErrors(null);
 });
 
-view.bindAddFeed((value) => {
-  model.addRssFeed(value);
+view.bindAddFeed(() => {
+  model.validateInput()
+    .then((value) => {
+      model.addRssFeed(value);
+      view.renderErrors(null);
+      model.updateInputValue("");
+    })
+    .catch(() => {
+      view.renderErrors(model.getErrors());
+    });
 });
-
-
-
-
-
-
-
-
-
-
-

src/js/model.js

@@ -16,52 +16,43 @@ const schema = yup
   .url("Ссылка должна быть валидным URL")
   .required("Обязательное поле")
   .test(
+    "no-duplicate",
     "Эта лента уже добавлена",
     (value) => !state.rssFeed.includes(value)
   );
 
-const validateInput = (value) => {
-  try {
-    schema.validateSync(value, { abortEarly: false });
-    return true;
-  } catch (error) {
-    if (error instanceof yup.ValidationError) {
-      state.errors = error.errors;
-      return false;
-    }
-    throw error;
-  }
-};
-
 
 export const createModel = () => {
+  const validateInput = (value) => {
+    return schema
+      .validate(value)
+      .then((validatedValue) => {
+        state.errors = null;
+        return validatedValue;
+      })
+      .catch((error) => {
+        if (error instanceof yup.ValidationError) {
+          state.errors = error.errors;
+        }
+        throw error;
+      });
+  };
+
   const updateInputValue = (value) => {
     state.inputValue = value;
     state.errors = null;
   };
 
   const addRssFeed = () => {
-    if (validateInput(state.inputValue)) {
-      state.rssFeed = [...state.rssFeed, state.inputValue];
-      console.log("обновлён список rss", state.rssFeed);
-      state.errors = null;
-    } else {
-      console.log("не прошёл валидацию:", state.errors);
-    }
+    state.rssFeed = [...state.rssFeed, state.inputValue];
+    state.errors = null;
   };
 
   const getErrors = () => {
     return state.errors;
   };
 
   return {
-    updateInputValue, addRssFeed, getErrors
-  }
-}
-
-
-
-
-
-
-
+    updateInputValue, validateInput, addRssFeed, getErrors
+  };
+};

src/js/view.js

@@ -6,13 +6,14 @@ export const createView = () => {
   const bindInputChange = (handler) => {
     input.addEventListener('input', (e) => {
       handler(e.target.value);
+      console.log('input changes');
     })
   };
 
   const bindAddFeed = (handler) => {
     form.addEventListener('submit', (e) => {
       e.preventDefault();
-      handler()
+      handler();
     })
   };
 
@@ -39,9 +40,3 @@ export const createView = () => {
     renderErrors
   }
 };
-
-
-
-
-
-