login.js 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. import { useMutation } from '@apollo/react-hooks'
  2. import { Formik, Form } from 'formik'
  3. import { USER_LOGIN, CURRENT_USER } from '../../lib/graphql'
  4. import { TextInput } from '../../lib/forms'
  5. const LoginAdoption = adopt({
  6. login: ({ render }) => (
  7. <Mutation mutation={USER_LOGIN} refetchQueries={[{ query: CURRENT_USER }]}>
  8. {(login, { data, error, loading }) =>
  9. render({ login, data, error, loading })
  10. }
  11. </Mutation>
  12. ),
  13. form: ({ login: { login }, render }) => (
  14. <Formik
  15. initialValues={{
  16. email: '',
  17. password: ''
  18. }}
  19. onSubmit={async values => {
  20. try {
  21. const user = await login({ variables: values })
  22. console.log(user)
  23. } catch (error) {
  24. console.log(error)
  25. }
  26. }}
  27. >
  28. {render}
  29. </Formik>
  30. )
  31. })
  32. const LoginForm = props => {
  33. const [login, {loading, error}] = useMutation(USER_LOGIN)
  34. const {data, loading, error} = useQuery(CURRENT_USER)
  35. if
  36. return (
  37. <Form>
  38. <TextInput label='Email' name='email' type='email' placeholder='email' />
  39. <TextInput
  40. label='Password'
  41. name='password'
  42. type='password'
  43. placeholder='password'
  44. />
  45. <button type='submit'>Login!</button>
  46. </Form>
  47. )
  48. }
  49. export default LoginForm