format

frontend/src/Commons/Forms/InputModules/FieldsAndSoil/FieldsAndSoil.tsx

@@ -36,7 +36,10 @@ const FieldsAndSoilComponent: React.FC<InputModuleProps> = ({ farmDetails, updat
 
   const validationSchema = Yup.object().shape({
     FieldName: Yup.string().max(24).required('Required'),
-    Area: Yup.number().min(1, 'Area should be higher than 1').max(100, 'Area should be lower than 100').required('Required'),
+    Area: Yup.number()
+      .min(1, 'Area should be higher than 1')
+      .max(100, 'Area should be lower than 100')
+      .required('Required'),
     Comments: Yup.string().max(200, 'Comments should be lower than 200'),
   });
   /**

frontend/src/Commons/Input/ErrorMessage.css

@@ -1,4 +1,4 @@
-.errorMessage{
-    color:red;
-    font-size: 12px;
+.errorMessage {
+  color: red;
+  font-size: 12px;
 }

frontend/src/Commons/Input/Field/CustomField.tsx

@@ -23,7 +23,10 @@ const CustomField: FC<CustomFieldProps> = ({ name, id, type, label, width = '100
       id={id}
       type={type}
     />
-    <ErrorMessage name={id} render={(msg) => <div className="errorMessage">{msg}</div>} />
+    <ErrorMessage
+      name={id}
+      render={(msg) => <div className="errorMessage">{msg}</div>}
+    />
   </StyledField>
 );
 

frontend/src/Commons/Input/TextArea/CustomTextArea.tsx

@@ -32,7 +32,10 @@ const CustomTextArea: FC<CustomTextAreaProps> = ({
       name={name}
       id={id}
     />
-    <ErrorMessage name={id} render={(msg) => <div className="errorMessage">{msg}</div>} />
+    <ErrorMessage
+      name={id}
+      render={(msg) => <div className="errorMessage">{msg}</div>}
+    />
   </StyledField>
 );