title: display error if email is not exits in django database and display error if password is incorrect?
body: <p>I am a beginer in react and django and this code note showing the error if login password is incorrect or email does not exist in data base. help me to figure this out and review my code.  am calling login api on login button api is call if password and email match if emails not exist in data data base its shows tha error in network. i want to display error in front end if email is already exist or password does'nt match.</p>
  <pre><code>import React, { Component } from &quot;react&quot;;
  import { withRouter } from &quot;react-router-dom&quot;;
  import { FcGoogle } from &quot;react-icons/fc&quot;;
  import { BsPersonCircle } from &quot;react-icons/bs&quot;;
  import {
    Container,
    FormWrap,
    FormContent,
    Form,
    LogInIcon,
    FormInput,
    FormH1,
    FormLabel,
    ForgetBtn,
    ForgetBtnLink,
    FormButton,
    Underline,
    GoogleButton,
    FormCreat,
    SignUpButton,
  } from &quot;./SigninElements&quot;;
  
  class SignIn extends Component {
    constructor(props) {
      super(props);
      this.login = this.login.bind(this);
    }
  
    state = {
      credentials: { email: &quot;&quot;, password: &quot;&quot; },
    };
  
    login = (event) =&gt; {
      let path = `/signup`;
      console.log(this.state.credentials);
      fetch(&quot;http://127.0.0.1:8000/login/&quot;, {
        method: &quot;POST&quot;,
        headers: {
          &quot;Content-Type&quot;: &quot;application/json&quot;,
          Accept: &quot;application/json&quot;,
        },
        body: JSON.stringify(this.state.credentials),
      })
        .then((data) =&gt; data.json())
        .then((data) =&gt; {
          console.log(data.token);
        })
        .catch((error) =&gt; console.error(error));
  
      if (this.state.credentials.email === &quot;&quot;) {
        return false;
      }
      if (this.state.credentials.password === &quot;&quot;) {
        return false;
      }
      return this.props.history.push(path);
    };
  
    inputChanged = (event) =&gt; {
      const cred = this.state.credentials;
      cred[event.target.name] = event.target.value;
      this.setState({ credentials: cred });
    };
  
    forgetPass = () =&gt; {
      let path = `/forgetpassword`;
      this.props.history.push(path);
    };
    creatAccount = () =&gt; {
      let path = `/signup`;
      this.props.history.push(path);
    };
    render() {
      return (
        &lt;&gt;
          &lt;Container&gt;
            &lt;FormWrap&gt;
              &lt;FormContent&gt;
                &lt;Form action=&quot;#&quot;&gt;
                  &lt;LogInIcon style={{ fontSize: 80, opacity: 0.5 }}&gt;
                    &lt;BsPersonCircle /&gt;
                  &lt;/LogInIcon&gt;
                  &lt;FormH1&gt;Log In To Your RFXme Account&lt;/FormH1&gt;
                  &lt;FormLabel htmlFor=&quot;for&quot;&gt;Enter Your Email&lt;/FormLabel&gt;
                  &lt;FormInput
                    placeholder=&quot;name@example.com&quot;
                    type=&quot;email&quot;
                    name=&quot;email&quot;
                    htmlFor=&quot;email&quot;
                    value={this.state.credentials.email}
                    onChange={this.inputChanged}
                    required
                  /&gt;
                  &lt;FormLabel htmlFor=&quot;for&quot;&gt;Enter Your Password&lt;/FormLabel&gt;
                  &lt;FormInput
                    placeholder=&quot;********&quot;
                    type=&quot;password&quot;
                    htmlFor=&quot;password&quot;
                    name=&quot;password&quot;
                    value={this.state.credentials.password}
                    onChange={this.inputChanged}
                    required
                  /&gt;
                  &lt;ForgetBtn&gt;
                    &lt;ForgetBtnLink onClick={this.forgetPass}&gt;
                      Forget password?
                    &lt;/ForgetBtnLink&gt;
                  &lt;/ForgetBtn&gt;
                  &lt;FormButton type=&quot;submit&quot; onClick={this.login}&gt;
                    Login
                  &lt;/FormButton&gt;
                  &lt;Underline&gt;
                    &lt;hr style={{ width: 120 }} /&gt;
                    &lt;span style={{ opacity: 0.5 }}&gt;or&lt;/span&gt;
                    &lt;hr style={{ width: 120 }} /&gt;
                  &lt;/Underline&gt;
                  &lt;GoogleButton&gt;
                    &lt;FcGoogle /&gt;
                  &lt;/GoogleButton&gt;
                  &lt;FormCreat&gt;
                    Don't have an accpount?
                    &lt;SignUpButton onClick={this.creatAccount}&gt;
                      {&quot; &quot;}
                      Create an account{&quot; &quot;}
                    &lt;/SignUpButton&gt;
                  &lt;/FormCreat&gt;
                &lt;/Form&gt;
              &lt;/FormContent&gt;
            &lt;/FormWrap&gt;
          &lt;/Container&gt;
        &lt;/&gt;
      );
    }
  }
  
  export default withRouter(SignIn);
  </code></pre>