export function login(data) {

const endpoint = 'http://127.0.0.1:8000/api/auth/jwt/'
const csrfToken = cookie.load('csrftoken')
let thisComp = this
if (csrfToken !== undefined) {
  let lookupOptions = {
      method: "POST",
      headers: {
          'Content-Type': 'application/json'

      },
      body: JSON.stringify(data),
      credentials: 'include'
  }

  fetch(endpoint, lookupOptions)
  .then(function(response){
      return response.json()
  }).then(function(responseData){
      console.log(responseData)
      localStorage.token = responseData.token
      localStorage.expires = responseData.expires // Store the token
      console.log("Token Stored", localStorage.token)
      console.log("Token Expires", responseData.expires)
      refreshToken(localStorage.token)



    }).catch(function(error){

      console.log("error", error)
  })
 }

}

export class Login extends Component {

constructor(props){
 super(props)
 this.onSubmit = this.onSubmit.bind(this)
 this.handleInputChange = this.handleInputChange.bind(this)
 this.state = {
     username: null,
     password: null,

 }
 }

 onSubmit(event) {
  event.preventDefault()
  let data = this.state
  console.log(data)
  login(data)



  }

  handleInputChange(event){
   event.preventDefault()
   console.log(event.target.name, event.target.value)
   let key = event.target.name
   let value = event.target.value
   this.setState({
     [key]: value
  })
  }

  componentDidMount(){
   this.setState({
    username: null,
    password: null,

   })

   }

   render() {
      return (
        <div className="orderweb__432c603c" data-
         reactid=".ovvy6jmxvk.2">
            <h1 className="ccl-2a4b5924e2237093 ccl-21bead492ce4ada2
            ccl-99c566dc40a8a156 ccl-0338edd3d4c3a41b" data-
            reactid=".ovvy6jmxvk.2.0">Welcome back</h1>
            <form  noValidate data-reactid=".ovvy6jmxvk.2.1" onSubmit=
             {this.onSubmit}>
                <div className="ccl-b176b26fc7009752" data-
                 reactid=".ovvy6jmxvk.2.1.1">
                    <label className="ccl-19882374e640f487 ccl-
                     417df52a76832172 ccl-dfaaa1af6c70149c ccl-
                     9d0a5327c911d0f3 ccl-094acd7546498021 ccl-
                     b79f709a3ebf5895" htmlFor="login_email" data-
                     reactid=".ovvy6jmxvk.2.1.1.0">Email address</label>
                    <div className="orderweb__15cc2e48" data-
                    reactid=".ovvy6jmxvk.2.1.1.1"><input id='username'
                    name='username' className="orderweb__e9fe3b76"
                    placeholder="Username"  spellCheck="true"
                    autoCorrect="on" required aria-invalid="false" aria-
                    required="true" rows={1} data-
                    reactid=".ovvy6jmxvk.2.1.1.1.0" onChange=
                    {this.handleInputChange} /></div>
                </div>
                <div className="ccl-b176b26fc7009752" data-reactid=".ovvy6jmxvk.2.1.2">
                    <label className="ccl-19882374e640f487 ccl-417df52a76832172 ccl-dfaaa1af6c70149c ccl-9d0a5327c911d0f3 ccl-094acd7546498021 ccl-b79f709a3ebf5895" htmlFor="login_password" data-reactid=".ovvy6jmxvk.2.1.2.0">Password</label>
                    <div className="orderweb__15cc2e48" data-reactid=".ovvy6jmxvk.2.1.2.1"><input id='password' name='password' type="password" inputMode="password" className="orderweb__e9fe3b76" placeholder="Password" spellCheck="true" autoCorrect="on" required aria-invalid="false" aria-required="true" rows={1} data-reactid=".ovvy6jmxvk.2.1.2.1.0" onChange={this.handleInputChange}/></div>
                </div>
                <a href="/password_reset" className="orderweb__de36b0c3" data-reactid=".ovvy6jmxvk.2.1.3">Forgot password?</a><span className="ccl-67e0c7f3fe50cf69 ccl-a97a150ddadaa172 ccl-b176b26fc7009752" data-reactid=".ovvy6jmxvk.2.1.4"><button className="ccl-d0484b0360a2b432 ccl-233931c277401e86 ccl-ed9aadeaa18a9f19 ccl-a97a150ddadaa172" type="submit" tabIndex={0} data-reactid=".ovvy6jmxvk.2.1.4.0"><span className="ccl-cce251427bbe4ec4" data-reactid=".ovvy6jmxvk.2.1.4.0.1"><span data-reactid=".ovvy6jmxvk.2.1.4.0.1.1">Login</span></span></button></span>
                <p className="ccl-19882374e640f487 ccl-1daa0367dee37c3b ccl-dfaaa1af6c70149c ccl-b176b26fc7009752" data-reactid=".ovvy6jmxvk.2.1.5"><span data-reactid=".ovvy6jmxvk.2.1.5.0">Don't have an account yet?<br />Just place an order to create one.</span></p>
            </form>
        </div>
    );
}
}

export default Login