national-gold•16mo ago

React-hook-form types

Hi everyone hope you doing all well how to add types for the register functions for the @refinedev/react-hook-form I just put this code and pass the register function to my custom form component but I can't import the UseFormRegister<FieldValues> types from the react-hook-form

 const {
    refineCore: { onFinish, formLoading },
    register,
    handleSubmit,
    resetField,
    formState: { errors },
  } = useForm();


 <FormRow
           register={register}
            labelText='New Password'
            name='newPassword'
            type='password'
            placeholder='Enter new password'
          />


const FormRow = ({
  register,
}: {
  register?: UseFormRegister<FieldValues>
}) => {
 <input
          {...register(name, { required: true })}
    
          className='outline-none border-[1px] border-slate-400  p-2 mb-8 rounded-lg'
/>
}

4 Replies

kapa.ai•16mo ago

Hi @franzdev. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

kapa.ai•16mo ago

---------------------- Hmm, I don't know enough to give you a confident answer yet. However, you can refer to the refine documentation for more information on how to work with forms and validation in refine: - React Hook Form Validation Examples (https://refine.dev/blog/react-hook-form-validation-examples/) - useRegister Hook (https://refine.dev/docs/api-reference/core/hooks/auth/useRegister) These resources might help you find the information you need. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

React Hook Form Validation with Complete Examples | refine

We'll implement React Hook Form custom validations and schema validations using yup.

useRegister | refine

useRegister data hook from refine is a modified version of react-query's useMutation for registration.

kapa.ai•16mo ago

<@619660544319684609> kapa.ai is still learning and improving, please let us how it did by reacting below

genetic-orange•16mo ago

Hey @franzdev, In my opinion, the suggested way is pass all of useForm methods to your component using the UseFormReturnType comes from the @refinedev/react-hook-form