function Login()

in microservices/adp_ui/src/components/Login.js [37:152]
88 lines of code
6 McCabe index (conditional complexity)

function Login() {
  // React States
  const [errorMessages, setErrorMessages] = useState({});
  const [isSubmitted, setIsSubmitted] = useState(false);

  // To sign with the other email accounts
  const handleSubmit = async (event) => {
    //Prevent page reload
    event.preventDefault();

    var { uname, pass } = document.forms[0];
    try {
      const user = await signInWithEmailAndPassword(
        auth,
        uname.value,
        pass.value
      );
      console.log(user);
      if (user) {
        setIsSubmitted(true);
        console.log("User signedin success");
        localStorage.setItem('login', true);
        localStorage.setItem('user', user.user.email);
        window.location = "/";
      }
    } catch (error) {
      console.log(error.message);
      setErrorMessages({ name: "uname", message: error.message });
    }
  };


  // Generate JSX code for error message login
  const renderErrorMessage = (name) =>
    name === errorMessages.name && (
      <div className="error">{errorMessages.message}</div>
    );

  // JSX code for login form
  const renderForm = (
    <div>
    <div className="form">
      <form onSubmit={handleSubmit}>
        <div className="input-container">
          <Row>
            <h5 style={{fontWeight:'bolder'}}>Sign In</h5>
          </Row>
          <Row>
            <Col className="col-4" style={{marginTop: '0.6em'}}>
            <label>Email </label>
            </Col>

            <Col className="col-8">
            <input type="text" name="uname" style={{width:'100%'}} placeholder="Please enter email" className="loginInput" required />
          {renderErrorMessage("uname")}
            </Col>

          </Row>
        </div>
        <div className="input-container">

        <Row>
            <Col className="col-4"style={{marginTop: '0.6em'}}>
            <label>Password </label>
            </Col>

            <Col className="col-8">
            <input type="password" name="pass" style={{width:'100%'}} placeholder="Please enter password" className="loginInput" required />
          {renderErrorMessage("pass")}
            </Col>

          </Row>
        
        </div>
        <div className="input-container">
        <Row>
          <Col className="col-4">
          </Col>
          <Col className="col-8">
          <input type="submit" style={{width:'100%'}} value="Sign In"/>
          </Col>
        </Row>
          
          
          
        </div>
        
      </form>

 
    </div>
         
   </div>
  );

  return (
    <div className="logindiv">
      <div className="login-form">
      <Image src={imgFile} width='260px' height='70px' style={{display: 'block',
    margin: '0 auto'}}/>
      <h4 className="loginTitle">Automated Document Processing</h4> <br/>
        {isSubmitted ? <Redirect to="/" /> : renderForm}
      </div>
      <div className="register-container">
       
         <FcGoogle className="googleImg" />
       <Button variant="success" onClick={signInWithGoogle} className="signInGoogle">        
       Sign in with Google</Button>            
  
  
   </div>
    </div>
  );


}