text: import React from 'react';
  import ListErrors from './ListErrors';
  import agent from '../agent';
  import { connect } from 'react-redux';
  
  const mapStateToProps = state => ({
    ...state.auth
  });
  
  const mapDispatchToProps = dispatch => ({
    onChangeEmail: value =>
      dispatch({ type: 'UPDATE_FIELD_AUTH', key: 'email', value }),
    onChangePassword: value =>
      dispatch({ type: 'UPDATE_FIELD_AUTH', key: 'password', value }),
    onSubmit: (email, password) =>
      dispatch({ type: 'LOGIN', payload: agent.Auth.login(email, password) }),
    onUnload: () => dispatch({ type: 'LOGIN_PAGE_UNLOADED' })
  });
  
  class Login extends React.Component {
    constructor() {
      super();
  
      this.changeEmail = event => this.props.onChangeEmail(event.target.value);
      this.changePassword = event =>
        this.props.onChangePassword(event.target.value);
      this.submitForm = (email, password) => event => {
        event.preventDefault();
        this.props.onSubmit(email, password);
      };
    }
    componentWillUnmount() {
      this.props.onUnload();
    }
  
    render() {
      const { email, password } = this.props;
  
      return (
        <div className="auth-page">
          <div className="container page">
            <div className="row">
              <div className="col-md-6 offset-md-3 col-xs-12">
                <h1 className="text-xs-center">Iniciar Sesión</h1>
                <p className="text-xs-center">
                  <a>¿Necesito una cuenta?</a>
                </p>
  
                <ListErrors errors={this.props.errors} />
  
                <form onSubmit={this.submitForm(email, password)}>
                  <fieldset>
                    <fieldset className="form-group">
                      <input
                        className="form-control form-control-lg"
                        type="email"
                        placeholder="Correo Electrónico"
                        value={email}
                        onChange={this.changeEmail}
                      />
                    </fieldset>
  
                    <fieldset className="form-group">
                      <input
                        className="form-control form-control-lg"
                        type="password"
                        placeholder="Contraseña"
                        value={password}
                        onChange={this.changePassword}
                      />
                    </fieldset>
  
                    <button
                      className="btn btn-lg btn-primary pull-xs-right"
                      type="submit"
                      disabled={this.props.inProgress}
                    >
                      Iniciar Sesión
                    </button>
                  </fieldset>
                </form>
              </div>
            </div>
          </div>
        </div>
      );
    }
  }
  
  export default connect(mapStateToProps, mapDispatchToProps)(Login);
  