validation does not work with useController

[mmahalwy]

Bug Report

Describe the Bug

validation does not work with useController

How to Reproduce

const validateRequired = (value) => {
  console.log(value);

  return false;
};

const Field = ({ name, ...restProps }) => {
  const [fieldProps] = useControlled(name, {
    ...restProps,
    defaultValue: null,
    formId: 'form1',
    validate: validateRequired,
  });

  return (
    <Form.Item label="Label">
      <Input {...fieldProps} />
    </Form.Item>
  );
};

function CoolForm() {
  count++;

  const { form, focus, use } = useForm({
    defaultValues: {
      test: [{ firstName: 'Bill', lastName: 'Luo' }],
    },
    onSubmit: (values) => console.log(values),
    onError: (errors) => console.log('onError: ', errors),
    id: 'form1',
  });
  const [fields, { push, insert, remove, swap, move }] = useFieldArray('test', { formId: 'form1' });

  /* console.log(
    "Field value: ",
    use({ value: "foo", touched: "touched.foo", dirty: "dirty.foo" })
  ); */

  return (
    <form ref={form}>
      <div className="count">Render {count} times</div>
      <Field name={`all`} />

...

Submit, and notice it submits correctly although does not pass validation

CodeSandbox Link

Show me the bug on CodeSandbox.

Expected Behavior

Tell me what should happen.

Screenshots

Add screenshots to help explain your problem.

Your Environment

• Device: [e.g. MacBook Pro, iPhone12]
• OS: [e.g. macOS, iOS, Windows]
• Browser: [e.g. Chrome, Safari]
• Version: [e.g. v1.0.0]

Additional Information

Any other information about the problem here.