import { Button, FormControl, TextField } from '@material-ui/core'
import Typography from '@material-ui/core/Typography'
import React from 'react'
import { useForm } from 'react-hook-form'

const Form = () => {

  const { register, handleSubmit, errors } = useForm({
    mode: 'all',
  })

  return (
          <form onSubmit={handleSubmit(submit)}>
                <FormControl fullWidth>
                  <TextField
                    name="test"
                    inputRef={register({ required: true })}
                    error={Boolean(errors.name)}
                    variant="outlined"
                  />
                </FormControl>
                <Button type='submit' variant="contained" fullWidth disabled={!!Object.keys(errors).length}>
                  <Typography variant="button">送信する</Typography>
                </Button>
          </form>
  )
}

export default Form