Q:

Right way of using react-hook-form with typescript and material-ui for showing error message

I am using react-hook-form with typescript and material-ui. I wanted to pass error message as a helperText to TextField. I have tried to do so using 
helperText={errors.email?.message}
but typescript complains about this assignment. 
Property 'email' does not exist on type 'NestDataObject<FormData>'.ts(2339)

I don't want to disable this rule from my .eslintrc file, because it may ignore other similar issues in my application, which may be desired at some places.
What is the right way of assigning error message of react-hook-form as a helperText to material-ui components? 
codesandbox link 
https://codesandbox.io/s/material-ui-react-form-hook-yi669

A:

Need to define a datatype for form data and pass it to 'useForm'.
type FormData = {
  email: string;
  password: string;
};

const { control, handleSubmit, errors } = useForm<FormData>();

Updated sandbox : https://codesandbox.io/s/material-ui-react-form-hook-answer-8cxc1

