Issue working with react-hook-form validations

[vikikamath]

The error validations do not work very well with react-hook-form On submit, the error is not displayed when validation fails

Relevant CodeSandbox

Using @material-ui input with input adornments however works:

<FormControl variant="outlined" className={classes.formControl}>
 <InputLabel htmlFor="amount">Amount</InputLabel>
   <OutlinedInput
                 inputRef={register({
                   validate: (value) =>
                     value && typeof value === "number" && value > 0,
                 })}
                 name="amount"
                 value={amount}
                 onChange={(e) => setAmount(e.target.value)}
                 startAdornment={
                   <InputAdornment position="start">$</InputAdornment>
                 }
                 labelWidth={60}
               />
               {errors.amount && (
                 <FormHelperText error variant="outlined">
                   Please enter an amount
                 </FormHelperText>
               )}
             </FormControl>

[moisesbaddini]

I have a similar problem, and I noticed that it is missing the name in the component, although you have filled in the attribute (with "amount").

Please note the Sandbox console that you attached above, react-hook-forms cannot register an unnamed component.