fix: collection default value reset (#229)

apps/examples/cypress/e2e/collection.cy.ts

@@ -92,6 +92,20 @@ describe("Collection", () => {
     cy.field("members[1].company").hasValue("Initial Company (2)");
   });
 
+  it("Default values", () => {
+    cy.get("button").contains("Display").click();
+
+    cy.field("conditioned[0]").hasValue("default value");
+    cy.field("conditioned[1]").should("not.exist");
+
+    cy.get("button").contains("Add item").click();
+
+    cy.field("conditioned[1]").should("exist");
+
+    cy.get("button").contains("Reset form").click();
+    cy.field("conditioned[1]").should("not.exist");
+  });
+
   it("Reset with new members", () => {
     cy.field("members[0].name").hasValue("Default name (1)");
     cy.field("members[0].company").hasValue("Initial Company (1)");

apps/examples/src/pages/collection.tsx

@@ -23,7 +23,6 @@ import { useState } from "react";
 const DEFAULT_VALUES = {
   members: [{ name: "Default name (1)" }, { company: "Default company (2)" }],
 };
-
 const INITIAL_VALUES = {
   members: [
     { company: "Initial Company (1)" },
@@ -290,7 +289,9 @@ const Collection = () => {
 };
 
 const ConditionedCollection = () => {
-  const conditionedCollection = useCollection("conditioned");
+  const conditionedCollection = useCollection("conditioned", {
+    defaultValue: ["default value"],
+  });
 
   return (
     <Stack flex={1}>

packages/formiz-core/src/store.ts

@@ -242,15 +242,23 @@ export const createStore = <Values extends object = DefaultFormValues>(
                 collection.name
               ) as NullablePartial<Values>[];
 
+              const storeResetDefaultValue = getValueByFieldName(
+                state.resetDefaultValues,
+                collection.name
+              );
+
+              const resetKeys =
+                (collectionFields ?? storeResetDefaultValue)?.map(
+                  (_, index) => collection.keys?.[index] ?? index.toString()
+                ) ?? [];
+
               state.collections.set(collectionId, {
                 name: collection.name,
                 isPristine: isResetAllowed("pristine", resetOptions)
                   ? true
                   : state.collections.get(collectionId)?.isPristine ?? true,
                 keys: isResetAllowed("values", resetOptions)
-                  ? collectionFields?.map(
-                      (_, index) => collection.keys?.[index] ?? index.toString()
-                    ) ?? []
+                  ? resetKeys
                   : state.collections.get(collectionId)?.keys ?? [],
               });
             });
@@ -713,7 +721,7 @@ export const createStore = <Values extends object = DefaultFormValues>(
           };
 
           state.collections.set(collectionId, {
-            ...newCollection,
+            name: newCollection.name,
             keys: getKeys(),
             isPristine: oldCollectionById?.isPristine ?? true,
           });

packages/formiz-core/src/useCollection.ts

@@ -72,6 +72,12 @@ export const useCollection = <Data = unknown>(
       );
     }
 
+    if (!initialValues && !!defaultValue && !Array.isArray(defaultValue)) {
+      console.error(
+        `Default value for the collection "${name}" is not an array! Fallback to an empty array.`
+      );
+    }
+
     const initialValuesArray = Array.isArray(initialValues)
       ? initialValues
       : Array.isArray(defaultValue)

packages/formiz-core/src/useForm.tsx

@@ -58,8 +58,12 @@ export const useForm = <Values extends object = any>(
     }
   }, [formActions, formConfig?.ready]);
 
+  const formStateRef = useRef(formState);
+  formStateRef.current = formState;
   useEffect(() => {
-    formActions.updateConfig(formConfigRef);
+    if (formConfig?.id && formConfig.id !== formStateRef.current.id) {
+      formActions.updateConfig(formConfigRef);
+    }
   }, [formActions, formConfig?.id]);
 
   return formState;