👩‍🌾 close react-hook-form#12168 optimise re-render with validating fi…

…elds subscription (react-hook-form#12192)

* 👩‍🌾 close react-hook-form#12168 optimise re-render with validating fields subscription

* revert back the check

* optimise the logic

src/logic/createFormControl.ts

@@ -75,6 +75,7 @@ import getFieldValueAs from './getFieldValueAs';
 import getResolverOptions from './getResolverOptions';
 import getRuleValue from './getRuleValue';
 import getValidationModes from './getValidationModes';
+import hasPromiseValidation from './hasPromiseValidation';
 import hasValidation from './hasValidation';
 import isNameInFieldArray from './isNameInFieldArray';
 import isWatched from './isWatched';
@@ -452,15 +453,23 @@ export function createFormControl<
 
         if (_f) {
           const isFieldArrayRoot = _names.array.has(_f.name);
-          _updateIsValidating([name], true);
+          const isPromiseFunction = field._f && hasPromiseValidation(field._f);
+
+          if (isPromiseFunction && _proxyFormState.validatingFields) {
+            _updateIsValidating([name], true);
+          }
+
           const fieldError = await validateField(
             field,
             _formValues,
             shouldDisplayAllAssociatedErrors,
             _options.shouldUseNativeValidation && !shouldOnlyCheckValid,
             isFieldArrayRoot,
           );
-          _updateIsValidating([name]);
+
+          if (isPromiseFunction && _proxyFormState.validatingFields) {
+            _updateIsValidating([name]);
+          }
 
           if (fieldError[_f.name]) {
             context.valid = false;

src/logic/hasPromiseValidation.ts

@@ -0,0 +1,17 @@
+import { Field, Validate } from '../types';
+import isFunction from '../utils/isFunction';
+import isObject from '../utils/isObject';
+
+const ASYNC_FUNCTION = 'AsyncFunction';
+
+export default (fieldReference: Field['_f']) =>
+  (!fieldReference || !fieldReference.validate) &&
+  !!(
+    (isFunction(fieldReference.validate) &&
+      fieldReference.validate.constructor.name === ASYNC_FUNCTION) ||
+    (isObject(fieldReference.validate) &&
+      Object.values(fieldReference.validate).find(
+        (validateFunction: Validate<unknown, unknown>) =>
+          validateFunction.constructor.name === ASYNC_FUNCTION,
+      ))
+  );