{"size": 2118, "ext": "js", "max_stars_repo_path": "src/Login.js", "max_stars_repo_name": "manoj-makkuboy/front-feed-ninja", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/Login.js", "max_issues_repo_name": "manoj-makkuboy/front-feed-ninja", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/Login.js", "max_forks_repo_name": "manoj-makkuboy/front-feed-ninja", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 25.5180722892, "max_line_length": 113, "alphanum_fraction": 0.6142587347}
import React, { Component } from 'react'
import ArticleGrid from './ArticleGrid.js'

async function loginUser (bindedSetState, username, password) {
  let init = {
    mode: 'cors',
    headers: {
      'Accept': 'application/json',
      'Content-Type': 'application/json'
    },
    method: 'POST',
    body: JSON.stringify({'username': username, 'password': password})
  }
  try {
    let response = await fetch('http://localhost:8000/rest-auth/login/', init)
    let responseJson = await response.json()
    if (response.ok) {
      let jwtToken = responseJson['token']
      localStorage.setItem('JWT', jwtToken)
      bindedSetState({ jwt: jwtToken })
    } else {
      console.log('User Authentication Failed')
    }
  } catch (error) {
    console.error(error)
  }
}

class Login extends Component {
  constructor () {
    super()
    this.state = {username: '', password: '', jwt: null}

    this.handleSubmit = this.handleSubmit.bind(this)
    this.handleInputChange = this.handleInputChange.bind(this)
  }

  handleSubmit (event) {
    event.preventDefault()
    loginUser(this.setState.bind(this), this.state.username, this.state.password)
  }

  handleInputChange (event) {
    const target = event.target
    const value = target.value
    const name = target.name
    this.setState({
      [name]: value
    })
  }

  logoutUser () {
    localStorage.removeItem('JWT')

    console.log(this,'user logout succesful')
    this.setState({ jwt: null })
  }

  render () {
    if (this.state.jwt) {
      return (<ArticleGrid logoutFunction={this.logoutUser.bind(this)} />)
    }
    return (
      <form onSubmit={this.handleSubmit}>
        <label>
          username :
          <input type='text' onChange={this.handleInputChange} value={this.state.username} name='username' />
        </label>
        <br />
        <br />
        <label>
          password :
          <input type='password' name='password' onChange={this.handleInputChange} value={this.state.password} />
        </label>
        <br />
        <input type='submit' value='Submit' />
      </form>
    )
  }
}

export default Login
