title: If user's email and password doesn't match the other codes won't run and return an error. But if does, then it will work fine in google firebase
body: <p>I've been trying to show the error if user's email and password doesn't match. But can't figure out what I've been doing wrong. When I login with the wrong password it takes me straight to the home page. But what I am trying to do is: if password doesn't match then it won't take me anywhere.</p>
  <pre><code>import React, { useEffect, useState } from 'react';
  import { Button, Form } from 'react-bootstrap';
  import { useLocation, useNavigate } from 'react-router-dom';
  import { useSignInWithGoogle, useSignInWithEmailAndPassword, useSendPasswordResetEmail } from 
  'react-firebase-hooks/auth';
  import { FcGoogle } from 'react-icons/fc';
  import auth from '../../firebase.init';
  import './Login.css';
  import LoadingSpinner from '../Loadingspinner/LoadingSpinner';
  import toast from 'react-hot-toast';
  import axios from 'axios';
  const Login = () =&gt; {
      const location = useLocation();
      const navigate = useNavigate();
      // let the user go where he came from if he logged in
      const from = location.state?.from?.pathname || &quot;/&quot;;
      // handle google sign in
      const [signInWithGoogle, googleUser, googleLoading, googleError] = useSignInWithGoogle(auth);
      useEffect(() =&gt; {
          if (googleUser) {
              // console.log(googleUser.user);
              navigate(from, { replace: true });
          };
      }, [navigate, googleUser, from]);
      if (googleLoading) {
          &lt;LoadingSpinner&gt;&lt;/LoadingSpinner&gt;
      };
  
      // handle email sign in
      const [
          signInWithEmailAndPassword,
          emailUser,
          emailLoading,
          emailError,
      ] = useSignInWithEmailAndPassword(auth);
  
      useEffect(() =&gt; {
          if (emailUser) {
              // navigate(from, { replace: true });
          }
      }, [emailUser, navigate, from]);
      // if (emailError) {
      //     console.log(emailError.message)
      // };
      /*     if (emailLoading) {
              &lt;LoadingSpinner&gt;&lt;/LoadingSpinner&gt;
          }; */
      // get user infos
      const [userInfo, setUserInfo] = useState({
          email: &quot;&quot;,
          password: &quot;&quot;,
      });
      // set errors
      const [errors, setErrors] = useState({
          email: &quot;&quot;,
          password: &quot;&quot;,
          others: &quot;&quot;
      });
  
      // send password reset email
      const [sendPasswordResetEmail, sending, error] = useSendPasswordResetEmail(
          auth
      );
      // handle password reset mail
      const handleResetPass = async () =&gt; {
          if (userInfo.email) {
              await sendPasswordResetEmail(userInfo.email);
              toast.success('Reset email has been sent.')
          }
          else {
              toast.error('Please try again')
          }
      }
  
  
      // get email
      const handleEmailChange = e =&gt; {
          const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
          if (emailRegex.test(e.target.value)) {
              setUserInfo({ ...userInfo, email: e.target.value });
              setErrors({ ...errors, email: '' });
          } else {
              setErrors({ ...errors, email: 'Please Provide a valid email' });
              setUserInfo({ ...userInfo, email: '' });
          }
      };
  
  
  
      // get password
      const handlePasswordChange = e =&gt; {
          setUserInfo({ ...userInfo, password: e.target.value })
      };
  
      // handle login
      const handleLogin = async e =&gt; {
          e.preventDefault();
  
          // console.log(email);
          await signInWithEmailAndPassword(userInfo.email, userInfo.password);
          const email = userInfo.email;
          const { data } = await axios.post('http://localhost:5000/token', { email });
          // console.log(data);
          localStorage.setItem('accessToken', data.token);
          navigate(from, { replace: true });
  
      };
      // handle google sign in
      const handleGoogleSignin = () =&gt; {
          signInWithGoogle();
      };
  
  
      return (
          &lt;div className=&quot;mt-5&quot;&gt;
              &lt;div className=&quot;w-50 mx-auto mt-5 login-form p-5&quot;&gt;
                  &lt;h3 className=&quot;text-center mb-3 login-title&quot;&gt;Log in&lt;/h3&gt;
                  &lt;Form onSubmit={handleLogin}&gt;
                      &lt;Form.Group className=&quot;mb-3&quot; controlId=&quot;formBasicEmail&quot;&gt;
                          &lt;Form.Label&gt;Email address&lt;/Form.Label&gt;
                          &lt;Form.Control onChange={handleEmailChange} type=&quot;email&quot; placeholder=&quot;Enter email&quot; /&gt;
                          {errors?.email &amp;&amp; &lt;p className='text-danger'&gt;{errors.email}&lt;/p&gt;}
                      &lt;/Form.Group&gt;
  
                      &lt;Form.Group className=&quot;mb-3&quot; controlId=&quot;formBasicPassword&quot;&gt;
                          &lt;Form.Label&gt;Password&lt;/Form.Label&gt;
                          &lt;Form.Control onChange={handlePasswordChange} type=&quot;password&quot; placeholder=&quot;Password&quot; /&gt;
                      &lt;/Form.Group&gt;
  
                      &lt;Button variant=&quot;danger&quot; type=&quot;submit&quot; className=&quot;w-100&quot;&gt;
                          Login
                      &lt;/Button&gt;
                  &lt;/Form&gt;
                  &lt;Button onClick={handleGoogleSignin} variant=&quot;&quot; type=&quot;submit&quot; className=&quot;w-100 my-2 google-btn mt-4&quot;&gt;
                      &lt;FcGoogle className='g-icon'&gt;&lt;/FcGoogle&gt; Sign in with Google
                  &lt;/Button&gt;
                  &lt;button onClick={handleResetPass} className=&quot;btn btn-link&quot;&gt;Forgot password?&lt;/button&gt;
                  &lt;p&gt;Don't have an account? &lt;button onClick={() =&gt; navigate('/signup')} className=&quot;btn btn-link&quot;&gt;Create an account&lt;/button&gt;&lt;/p&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      );
  };
  
  export default Login;
  </code></pre>