{
  "Rohn": {
                "age": "30",
                 "city": "Mexico",
                 "occupation": "service",
                },
"Max": {
                "age": "32",
                 "city": "Colorado",
                 "occupation": "Business",
                },

}

import React from "react";
import Header from "./header";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { createLogIn } from "../actions/action";

const axios = require("axios");
import config from "../config/config";

class Login extends React.Component {
  constructor() {
    super();
    this.state = {
      account : { user:'', password: ''},
      authorizationError: false,
      UserData: ""
    };

 componentDidMount () {
    var currentUserJwt = config[this.state.account.user];
    console.log(currentUserJwt);
  }


  handleAccountChange = ({ target: input}) => {
    const account = {...this.state.account}
    account[input.name] = input.value
    this.setState({ account})
  };


  handleLoginForm = (e) => {
    e.preventDefault();
    let postLoginData = {};

    // call to action
    this.props.dispatch(createLogIn(postLoginData));

    this.props.history.push('/intro');
    this.setState({ authorizationError: false });

  };

  render() {
    const {account} = this.state;
    return (
      <div className="intro">
        <form onSubmit={this.handleLoginForm}>
        <div className="content container">
          <div className="row">
            <div className="logo-wrap">
              <div className="logo intro-logo">
              </div>
            </div>
          </div>
          <div className="row">
            <div className="col-xs-12">
              <input
                type="text"
                autoFocus
                placeholder="username"
                name="user"
                value={account.user}
                onChange={this.handleAccountChange}
              />
              <input
                type="password"
                placeholder="password"
                name="password"
                value={account.password}
                onChange={this.handleAccountChange}
              />
              <button className="lg-cta">
                <span>Sign in</span>
              </button>
            </div>
          </div>
        </div>
        </form>
      </div>
    );
  }
}

const mapStateToProps = state => ({
  logIn: state.logIn
});

export default connect(mapStateToProps)(Login);