{"size": 1054, "ext": "js", "max_stars_repo_path": "src/pages/login.js", "max_stars_repo_name": "alexticovschi/gatsby-lofter-blog", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/pages/login.js", "max_issues_repo_name": "alexticovschi/gatsby-lofter-blog", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/pages/login.js", "max_forks_repo_name": "alexticovschi/gatsby-lofter-blog", "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": 29.2777777778, "max_line_length": 132, "alphanum_fraction": 0.6499051233}
import React, { useContext, useState } from "react"
import { FirebaseContext } from "../components/Firebase"

import "./login.scss";

const Login = () => {
  const [ formValues, setFormValues ] = useState({ email: '', password: '' });
  const { firebase } = useContext(FirebaseContext);

  const handleSubmit = (e) => {
    e.preventDefault();

    firebase.login({ email: formValues.email, password: formValues.password });
  }

  const handleInputChange = (e) => {
    e.persist();

    setFormValues(currentValues => ({
      ...currentValues,
      [e.target.name] : e.target.value
    }))
  }

  return (
    <section className="login">
      <form className="login__form" onSubmit={handleSubmit}>
        <input value={formValues.email} name="email" onChange={handleInputChange} placeholder="email" type="email"/>
        <input value={formValues.password} name="password" onChange={handleInputChange} placeholder="password" type="password"/>    
        <button type="submit">Login</button>
      </form>
    </section>
  )
}

export default Login