feat(contribution-form): show form errors when a field is touched and…

… invalid
dis-moi · Aug 4, 2019 · 04ba976 · 04ba976
1 parent f4f5bf9
commit 04ba976
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 16 deletions.
diff --git a/...content/App/Contribute/ContributeScreen/SubmitContributionForm/SubmitContributionForm.tsx b/...content/App/Contribute/ContributeScreen/SubmitContributionForm/SubmitContributionForm.tsx
@@ -26,7 +26,7 @@ class SubmitContributionForm extends Component<SubmitContributionFormProps> {
   }
 
   render() {
-    const { handleSubmit, submitting, error, dirty } = this.props;
+    const { handleSubmit, submitting, error, anyTouched } = this.props;
     return (
       <Form onSubmit={handleSubmit}>
         <Field name="url" type="hidden" component={InputField} />
@@ -59,7 +59,7 @@ class SubmitContributionForm extends Component<SubmitContributionFormProps> {
           </BorderButton>
         </CenterContainer>
 
-        {dirty && error && <Error>{error}</Error>}
+        {anyTouched && error && <Error>{error}</Error>}
       </Form>
     );
   }

diff --git a/src/app/lmem/contribution/validate.ts b/src/app/lmem/contribution/validate.ts
@@ -14,23 +14,22 @@ export default (contribution: Contribution): Errors => {
   });
 
   const { contributor } = contribution;
-  if (contributor) {
-    errors.contributor = {};
-    if (!contributor.name) {
-      errors.contributor.name = requiredFieldMessage;
-    }
 
-    if (!contributor.email) {
-      errors.contributor.email = requiredFieldMessage;
-    }
+  errors.contributor = {};
+  if (!contributor || !contributor.name) {
+    errors.contributor.name = requiredFieldMessage;
+  }
 
-    if (contributor.email && !isEmail(contributor.email)) {
-      errors.contributor.email = "L'email n'est pas valide";
-    }
+  if (!contributor || !contributor.email) {
+    errors.contributor.email = requiredFieldMessage;
+  }
 
-    if (Object.keys(errors.contributor).length === 0) {
-      delete errors.contributor;
-    }
+  if (contributor && contributor.email && !isEmail(contributor.email)) {
+    errors.contributor.email = "L'email n'est pas valide";
+  }
+
+  if (Object.keys(errors.contributor).length === 0) {
+    delete errors.contributor;
   }
 
   return errors;