import { useMutation } from '@apollo/client'
import { FormEvent } from 'react'

import { USER_RESET_PASSWORD } from './graphql'
import { useFormHandler, TextInput } from '../form/forms'


const initialValues = {
  password: '',
  passwordAgain: ''
}

const ResetPassword = () => {

  const [resetPassword, { loading, error }] = useMutation(USER_RESET_PASSWORD)
  const { inputProps } = useFormHandler(initialValues)

  return (
    <form onSubmit={async (event: FormEvent) => {
      event.preventDefault()
    }}>
      <TextInput label='Password' {...inputProps('password')} />
      <TextInput label='Repeat password' {...inputProps('passwordAgain')} />
      <button type='submit' disabled={loading}>Reset Password</button>
    </form>
  )
}

export default ResetPassword