✌🏻 close #6124 move isValid state into seperate function to unblock validation

* close #6124 when isValid block buildin valdiation

* close #6124 move vald state into seperate function to unblock validation

Author: bluebill1049

cypress/integration/conditionalField.ts

@@ -160,6 +160,6 @@ describe('ConditionalField', () => {
       }),
     );
 
-    cy.get('#renderCount').contains('30');
+    cy.get('#renderCount').contains('38');
   });
 });

cypress/integration/formState.ts

@@ -90,7 +90,7 @@ describe('form state', () => {
         isValid: true,
       }),
     );
-    cy.get('#renderCount').contains('14');
+    cy.get('#renderCount').contains('15');
   });
 
   it('should return correct form state with onChange mode', () => {
@@ -184,7 +184,7 @@ describe('form state', () => {
         isValid: true,
       }),
     );
-    cy.get('#renderCount').contains('14');
+    cy.get('#renderCount').contains('17');
   });
 
   it('should return correct form state with onBlur mode', () => {
@@ -278,7 +278,7 @@ describe('form state', () => {
         isValid: true,
       }),
     );
-    cy.get('#renderCount').contains('15');
+    cy.get('#renderCount').contains('17');
   });
 
   it('should reset dirty value when inputs reset back to default with onSubmit mode', () => {
@@ -554,6 +554,6 @@ describe('form state', () => {
       }),
     );
 
-    cy.get('#renderCount').contains('13');
+    cy.get('#renderCount').contains('16');
   });
 });

cypress/integration/formStateWithNestedFields.ts

@@ -92,7 +92,7 @@ describe('form state with nested fields', () => {
         isValid: true,
       }),
     );
-    cy.get('#renderCount').contains('14');
+    cy.get('#renderCount').contains('15');
   });
 
   it('should return correct form state with onChange mode', () => {
@@ -186,7 +186,7 @@ describe('form state with nested fields', () => {
         isValid: true,
       }),
     );
-    cy.get('#renderCount').contains('14');
+    cy.get('#renderCount').contains('17');
   });
 
   it('should return correct form state with onBlur mode', () => {
@@ -280,7 +280,7 @@ describe('form state with nested fields', () => {
         isValid: true,
       }),
     );
-    cy.get('#renderCount').contains('15');
+    cy.get('#renderCount').contains('17');
   });
 
   it('should reset dirty value when inputs reset back to default with onSubmit mode', () => {
@@ -417,6 +417,6 @@ describe('form state with nested fields', () => {
       }),
     );
 
-    cy.get('#renderCount').contains('13');
+    cy.get('#renderCount').contains('16');
   });
 });

cypress/integration/formStateWithSchema.ts

@@ -185,7 +185,7 @@ describe('form state with schema validation', () => {
         isValid: true,
       }),
     );
-    cy.get('#renderCount').contains('14');
+    cy.get('#renderCount').contains('17');
   });
 
   it('should return correct form state with onBlur mode', () => {
@@ -279,7 +279,7 @@ describe('form state with schema validation', () => {
         isValid: true,
       }),
     );
-    cy.get('#renderCount').contains('15');
+    cy.get('#renderCount').contains('17');
   });
 
   it('should reset dirty value when inputs reset back to default with onSubmit mode', () => {
@@ -553,6 +553,6 @@ describe('form state with schema validation', () => {
         isValid: false,
       }),
     );
-    cy.get('#renderCount').contains('13');
+    cy.get('#renderCount').contains('16');
   });
 });

cypress/integration/useFieldArrayUnregister.ts

@@ -176,6 +176,6 @@ describe('useFieldArrayUnregister', () => {
       }),
     );
 
-    cy.get('#renderCount').contains('33');
+    cy.get('#renderCount').contains('36');
   });
 });

src/useForm.ts

@@ -162,6 +162,16 @@ export function useForm<
     });
   };
 
+  const shouldRenderBaseOnValid = async () => {
+    const isValid = await validateForm(fieldsRef.current, true);
+    if (isValid !== formStateRef.current.isValid) {
+      formStateRef.current.isValid = isValid;
+      subjectsRef.current.state.next({
+        isValid,
+      });
+    }
+  };
+
   const shouldRenderBaseOnError = React.useCallback(
     async (
       shouldSkipRender: boolean,
@@ -179,7 +189,7 @@ export function useForm<
       const isValid = readFormStateRef.current.isValid
         ? resolver
           ? isValidFromResolver
-          : await validateForm(fieldsRef.current, true)
+          : shouldRenderBaseOnValid()
         : false;
 
       if (delayError && error) {
@@ -202,7 +212,7 @@ export function useForm<
       ) {
         const updatedFormState = {
           ...fieldState,
-          isValid: !!isValid,
+          ...(resolver ? { isValid: !!isValid } : {}),
           errors: formStateRef.current.errors,
           name,
         };