diff --git a/src/components/TestForm/index.tsx b/src/components/TestForm/index.tsx index e98b471cefb78d1486d19cd1928456e98e3fe238..424bb411a1a3b5aee7362daa4679bc90ee9a2a91 100644 --- a/src/components/TestForm/index.tsx +++ b/src/components/TestForm/index.tsx @@ -26,17 +26,36 @@ export const Form: React.FC = () => { interface formData { email: string; password: string; + errors: Array<string>; } const defaultValues: formData = { email: '', password: '', + errors: [], }; const [formValues, setFormValues] = useState<formData>(defaultValues); + const isEmailValid: any = () => { + /** + * The following is the RFC 5322 valid email regex + * Hinted from question https://stackoverflow.com/questions/201323/how-to-validate-an-email-address-using-a-regular-expression + * More on http://emailregex.com/ + */ + // eslint-disable-next-line + const VALID_EMAIL_REGEX = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; + return VALID_EMAIL_REGEX.test(String(formValues.email).toLowerCase()); + }; + const handleSubmit: any = (event: any) => { event.preventDefault(); - console.log(formValues); + const errors: Array<string> = []; + if (!isEmailValid()) { + errors.push('email'); + console.log('Email address not valid'); + } else { + console.log(formValues); + } }; const classes = useStyles();