import React, {Component, useState} from 'react';
import { connect } from 'react-redux'
import { loginUsers } from '../redux'





class LoginUser extends Component {



    handleChange = e => {
        this.setState({
          [e.target.name]: e.target.value
        });
      }


     submitHandler = e => {
      //const {email_id, password_id} = useState('');


       e.preventDefault();
       let {email_id, password_id} = this.state
       try{
        console.log('done', email_id, password_id);
       this.props.loginUsers(email_id, password_id);


       }catch(error){
         console.log(error)


       }


     }
    render() {
      //const {title, body} = this.state
     // const { password_id, email_id, } = this.props;

      return (
        <div>
            <h2>
                Number of cake - {this.props.email_id}
            </h2>

          <form onSubmit={this.submitHandler}>
            <label>
              Person Name:
              <input type="text" name="email_id"  onChange={this.handleChange} />
            </label>
            <label>
              Person Name:
              <input type="text" name="password_id"  onChange={this.handleChange} />
            </label>
            <button type="submit" >Add</button>
          </form>
          <div>{this.errors}</div>
        </div>
      )
    }
  }




const mapStateToProps = state => {
    return {
        users: state.auth,


    }
}

const mapDispatchToProps = dispatch => {
    return {
      loginUsers: (email, pass, ) => dispatch(loginUsers( {email, pass}))
    }
  }

export default
connect(mapStateToProps,mapDispatchToProps)(LoginUser)