Merge pull request #190 from GSG-G8/189-fixFullNameValidation

189 fix full name validation
GSG-G8 · Jun 9, 2020 · 1b26636 · 1b26636
2 parents c13379a + 4ee3b1a
commit 1b26636
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 12 deletions.
diff --git a/client/src/components/application/NonlinearStepper/GeneralInfo.js b/client/src/components/application/NonlinearStepper/GeneralInfo.js
@@ -12,7 +12,7 @@ import Typography from '../../common/Typography';
 import selectBoxQuestions from './questions';
 import { GeneralInfoStyles } from './style';
 
-const GereralInfos = ({ handleFormInput, formValues, errorMsg }) => {
+const GeneralInfos = ({ handleFormInput, formValues, errorMsg }) => {
   const classes = GeneralInfoStyles();
   const {
     GazaAreas,
@@ -61,20 +61,18 @@ const GereralInfos = ({ handleFormInput, formValues, errorMsg }) => {
         label="Full Name"
         name="fullName"
         onChange={handleFormInput}
-        isError={errorMsg.includes('Full Name is required')}
+        isError={
+          (formValues.fullName.length > 0 && formValues.fullName.length < 5) ||
+          errorMsg.includes('Full Name is required')
+        }
         message="ex:- Sam Smith"
       />
 
       <TextareaAutosize
         className={` nonlinearSelect ${classes.textArea}`}
         label="Motivation"
         name="motivation"
-        placeholder="What is your motivation for joining the Code Academy?        
-        - Tell us 
-        - in your own words 
-        - about your background and why you want to be considered for this program.             
-        - This is your opportunity to tell your story and make your application unique.                          
-        - Please write at least 5 sentences"
+        placeholder="Tell us - in your own words - about your background and why you want to be considered for this program. This is your opportunity to tell your story and make your application unique. Please write at least 5 sentences."
         aria-label="minimum height"
         onChange={handleFormInput}
         rowsMin={11}
@@ -177,12 +175,12 @@ const GereralInfos = ({ handleFormInput, formValues, errorMsg }) => {
   );
 };
 
-GereralInfos.defaultProps = {
+GeneralInfos.defaultProps = {
   handleFormInput: () => {},
   formValues: '',
   errorMsg: [],
 };
-GereralInfos.propTypes = {
+GeneralInfos.propTypes = {
   handleFormInput: PropTypes.func,
   formValues: PropTypes.shape({
     gender: PropTypes.string,
@@ -202,4 +200,4 @@ GereralInfos.propTypes = {
   errorMsg: PropTypes.arrayOf(PropTypes.string),
 };
 
-export default GereralInfos;
+export default GeneralInfos;
diff --git a/client/src/components/pages/application/Signup/index.js b/client/src/components/pages/application/Signup/index.js
@@ -138,6 +138,7 @@ class SignUp extends React.Component {
                       message.includes('You must add only Letters')
                     }
                     message={
+                      (fullName.length > 0 && fullName.length < 5) ||
                       message.includes('Enter your First Name')
                         ? 'You must enter at least 5 characters'
                         : message.includes('You must add only Letters')

diff --git a/client/src/utils/application/nLinearStepperValidation.js b/client/src/utils/application/nLinearStepperValidation.js
@@ -2,7 +2,14 @@ import * as yup from 'yup';
 
 const generalInfosSchema = yup.object().shape({
   gender: yup.string().required('Gender is required'),
-  fullName: yup.string().required('Full Name is required').trim(),
+  fullName: yup
+    .string()
+    .matches(
+      /^[A-Za-z\s]{5,}$/,
+      'You must add only letters, at least 5 characters'
+    )
+    .trim()
+    .required('Enter your First Name'),
   mobileNumber: yup
     .string()
     .matches(/^(05)[0-9]{8}$/, 'Error Mobile Number')