@refinedev/react-hook-form 5.0.0 → 5.0.2

package/src/useModalForm/index.spec.ts

@@ -236,8 +236,8 @@ describe("useModalForm Hook", () => {
   });
 
   it("should `meta[syncWithLocationKey]` overrided by default", async () => {
-    const mockGetOne = jest.fn().mockResolvedValue({ data: { id: 5 } });
-    const mockUpdate = jest.fn().mockResolvedValue({ data: { id: 5 } });
+    const mockGetOne = vi.fn().mockResolvedValue({ data: { id: 5 } });
+    const mockUpdate = vi.fn().mockResolvedValue({ data: { id: 5 } });
 
     const { result } = renderHook(
       () =>
@@ -291,11 +291,16 @@ describe("useModalForm Hook", () => {
 
     await act(async () => {
       result.current.modal.show();
+    });
+
+    await act(async () => {
       // register values to form
       result.current.register("test");
       result.current.setValue("test", "test");
     });
 
+    expect(result.current.getValues()).toStrictEqual({ test: "test" });
+
     await act(async () => {
       result.current.modal.close();
     });
@@ -350,20 +355,36 @@ describe("useModalForm Hook", () => {
           },
         }),
       {
-        wrapper: TestWrapper({}),
+        wrapper: TestWrapper({
+          dataProvider: {
+            ...MockJSONServer,
+            getOne: () =>
+              Promise.resolve({ data: { id: 5, title: "default-title" } }),
+          },
+        }),
       },
     );
 
     await act(async () => {
       result.current.modal.show();
-      result.current.register("test");
-      result.current.setValue("test", "test");
+    });
+
+    await act(async () => {
+      result.current.setValue("title", "new-title");
+    });
+
+    expect(result.current.getValues()).toStrictEqual({
+      id: 5,
+      title: "new-title",
     });
 
     await act(async () => {
       result.current.modal.close();
     });
 
-    expect(result.current.getValues()).toStrictEqual({});
+    expect(result.current.getValues()).toStrictEqual({
+      id: 5,
+      title: "default-title",
+    });
   });
 });

package/src/useModalForm/index.ts

@@ -64,11 +64,11 @@ export type UseModalFormProps<
   /**
      * @description Configuration object for the modal.
      * `defaultVisible`: Initial visibility state of the modal.
-     * 
+     *
      * `autoSubmitClose`: Whether the form should be submitted when the modal is closed.
-     * 
+     *
      * `autoResetForm`: Whether the form should be reset when the form is submitted.
-     * 
+     *
      * `autoResetFormWhenClose`: Whether the form should be reset to defaultValues when the modal is closed.
      * @type `{
       defaultVisible?: boolean;
@@ -176,7 +176,7 @@ export const useModalForm = <
 
   const {
     reset,
-    refineCore: { onFinish, id, setId, autoSaveProps },
+    refineCore: { onFinish, id, setId, autoSaveProps, query },
     saveButtonProps,
     handleSubmit,
   } = useHookFormResult;
@@ -185,6 +185,20 @@ export const useModalForm = <
     defaultVisible,
   });
 
+  // compensate for setting of initial form values in useForm since it doesnt track modal visibility
+  React.useEffect(() => {
+    if (!visible || !query?.data?.data) return;
+
+    const formData = query.data.data;
+    if (!formData) return;
+
+    reset(formData as any, {
+      ...(!autoResetFormWhenClose && {
+        keepDirtyValues: true,
+      }),
+    });
+  }, [visible, query?.data?.data, autoResetFormWhenClose]);
+
   React.useEffect(() => {
     if (initiallySynced === false && syncWithLocationKey) {
       const openStatus = parsed?.params?.[syncWithLocationKey]?.open;

package/src/useStepsForm/index.spec.ts

@@ -81,10 +81,10 @@ describe("useStepsForm Hook", () => {
     async (scenario) => {
       const mockData = { field1: "field1", field2: "field2" };
       const mockDirtyFields = scenario.mockDirtyFields;
-      const setValue = jest.fn();
+      const setValue = vi.fn();
       const getValues = () => mockData;
 
-      (jest.spyOn(UseForm, "useForm") as jest.Mock).mockReturnValueOnce({
+      (vi.spyOn(UseForm, "useForm") as vi.Mock).mockReturnValueOnce({
         setValue,
         getValues,
         formState: { dirtyFields: mockDirtyFields },