Validate mail (#829)

* changed emailRegex form so that it will except all type of email . in previous it wont accept email that having space after .com and yahoo.com

* changed emailRegex form so that it will except all type of email . in previous it wont accept email that having space after .com and yahoo.com

* added line cy.should('be.disabled'). as some test cases are failed . for more info visit Validate mail pull request

* added line cy.should('be.disabled'). as some test cases are failed . for more info visit Validate mail pull request

* Update forgotpassword.cy.js

---------

Co-authored-by: MOHAMMAD SARFRAZ ALAM <sarf.alam0206@gmail.com>

cypress/e2e/components/auth/forgotPassword/forgotpassword.cy.js

@@ -11,6 +11,7 @@ describe("Forgot Password Page | CodeLabz", () => {
     });
   });
 
+
   before(function () {
     indexedDB.deleteDatabase("firebaseLocalStorageDb");
   });
@@ -22,8 +23,7 @@ describe("Forgot Password Page | CodeLabz", () => {
 
   it("empty email ", function () {
     cy.visit(`${this.base_url}forgotpassword`);
-    cy.get("[data-testId=forgotPasswordButton]").click();
-    cy.contains("The email address is badly formatted.");
+    cy.get("[data-testId=forgotPasswordButton]").should('be.disabled');
   });
   it("successfull ", function () {
     cy.visit(`${this.base_url}forgotpassword`);

src/components/AuthPage/ForgotPassword/index.jsx

@@ -39,6 +39,7 @@ const ForgotPassword = ({
 	const [success, setSuccess] = useState(false);
 	const [email, setEmail] = useState("");
 	const [open, setOpen] = React.useState(true);
+	const [isValidEmail, setIsValidEmail] = useState(false);
 	const errorProps = useSelector(({ auth }) => auth.profile.error);
 	const loadingProps = useSelector(({ auth }) => auth.profile.loading);
 	const dispatch = useDispatch();
@@ -62,12 +63,20 @@ const ForgotPassword = ({
 		[dispatch]
 	);
 
+
 	const onSubmit = async (values) => {
 		values.preventDefault();
 		setError("");
 		await sendPasswordResetEmail(email)(firebase, dispatch);
 	};
 
+	const handleChange =(e)=>{
+		const enteredEmail = e.target.value;
+		setEmail(enteredEmail)
+		const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+\s*$/;
+		const isValid = emailRegex.test(enteredEmail);
+		setIsValidEmail(isValid);
+	  }
 	const classes = useStyles();
 
 	return (
@@ -115,7 +124,7 @@ const ForgotPassword = ({
 				<OutlinedInput
 					placeholder="Email"
 					autoComplete="email"
-					onChange={(e) => setEmail(e.target.value)}
+					onChange={handleChange} 
 					className="mb-32"
 					fullWidth
 					height="10rem"
@@ -134,7 +143,8 @@ const ForgotPassword = ({
 					className="mt-10"
 					type="submit"
 					fullWidth
-					data-testId="forgotPasswordButton">
+					data-testId="forgotPasswordButton"
+					disabled={!isValidEmail}>
 					{loading ? "Sending..." : "Send me the link"}
 				</Button>
 			</form>