feat(core): addItem and removeItem methods for array field handle (#30)

Co-authored-by: Mikołaj Klaman <mklaman@virtuslab.com>

src/core/hooks/use-formts/use-formts.spec.ts

@@ -189,6 +189,43 @@ describe("useFormts", () => {
     }
   });
 
+  it("allows for adding and removing array field items", () => {
+    const hook = renderHook(() => useFormts({ Schema }));
+
+    {
+      const [fields] = hook.result.current;
+      expect(fields.theArray.isTouched).toBe(false);
+      expect(fields.theArray.value).toEqual([]);
+    }
+
+    act(() => {
+      const [fields] = hook.result.current;
+      fields.theArray.addItem("foo");
+    });
+
+    act(() => {
+      const [fields] = hook.result.current;
+      fields.theArray.addItem("bar");
+    });
+
+    {
+      const [fields] = hook.result.current;
+      expect(fields.theArray.isTouched).toBe(true);
+      expect(fields.theArray.value).toEqual(["foo", "bar"]);
+    }
+
+    act(() => {
+      const [fields] = hook.result.current;
+      fields.theArray.removeItem(0);
+    });
+
+    {
+      const [fields] = hook.result.current;
+      expect(fields.theArray.isTouched).toBe(true);
+      expect(fields.theArray.value).toEqual(["bar"]);
+    }
+  });
+
   it("allows for setting errors using corresponding field handles and keeps track of isValid state", () => {
     const hook = renderHook(() => useFormts({ Schema }));
 

src/core/hooks/use-formts/use-formts.ts

@@ -289,6 +289,26 @@ export const useFormts = <Values extends object, Err>(
         setFieldErrors({ field: descriptor, error });
       },
 
+      addItem: item => {
+        if (isArrayDescriptor(descriptor)) {
+          const array = getField(descriptor) as unknown[];
+          const updatedArray = [...array, item];
+          return setField(descriptor, updatedArray);
+        }
+
+        return undefined;
+      },
+
+      removeItem: index => {
+        if (isArrayDescriptor(descriptor)) {
+          const array = getField(descriptor) as unknown[];
+          const updatedArray = array.filter((_, i) => i !== index);
+          return setField(descriptor, updatedArray);
+        }
+
+        return undefined;
+      },
+
       validate: () => {
         return validateField(descriptor);
       },

src/core/types/field-handle.ts

@@ -1,4 +1,4 @@
-import { IdentityDict, IsUnion } from "../../utils";
+import { ArrayElement, IdentityDict, IsUnion } from "../../utils";
 
 import { FieldDescriptor } from "./field-descriptor";
 
@@ -17,6 +17,8 @@ export type _FieldHandleApprox<T, Err> = BaseFieldHandle<T, Err> & {
     | Array<_FieldHandleApprox<unknown, Err>>
     | Record<string, _FieldHandleApprox<unknown, Err>>;
   options?: Record<string, string>;
+  addItem?: (item: ArrayElement<T>) => void;
+  removeItem?: (i: number) => void;
 };
 
 export const toApproxFieldHandle = <T, Err>(it: FieldHandle<T, Err>) =>
@@ -81,14 +83,14 @@ type ArrayFieldHandle<T, Err> = T extends Array<infer E>
        * Will run field validation with `change` trigger.
        * Will set `isTouched` to `true`.
        */
-      // pushItem: (item: E) => void;
+      addItem: (item: E) => void;
 
       /**
        * Will set the field value its copy with the item at index `i` removed.
        * Will run field validation with `change` trigger.
        * Will set `isTouched` to `true`.
        */
-      // removeItem: (i: number) => void;
+      removeItem: (i: number) => void;
 
       /**
        * Array of FieldHandles for each item stored in field value