import React from 'react';
import { signIn } from '../auth/auth';
import {History} from 'react-router';

let Login = React.createClass({
  mixins: [History],
  handleOnClick(event) {
    event.preventDefault();

    signIn(this.refs.login.value, this.refs.password.value)
      .then(result => {
        this.history.pushState(null, '/admin');
      })
      .catch(error => {
        console.log(error);
      });
  },
  render() {
    return(
      <form className="pure-form pure-form-stacked">
        <label htmlFor="login">Login</label>
        <input id="login" type="text" placeholder="Login" ref="login" />
        <label htmlFor="password">Password</label>
        <input id="password" type="password" ref="password" />
        <button className="pure-button pure-button-primary" onClick={this.handleOnClick}>Sign in</button>
      </form>
    );
  }
});

export default Login ;
