Merge pull request #279 from gadget-inc/pausing-fix

Add the pause option to hook dependencies for hygiene

Author: airhorns

packages/react/spec/useFindFirst.spec.ts

@@ -182,4 +182,43 @@ describe("useFindFirst", () => {
 
     expect(mockUrqlClient.executeQuery).toBeCalledTimes(0);
   });
+
+  test("issues a request once unpaused", async () => {
+    let paused = true;
+    const { result, rerender } = renderHook(() => useFindFirst(relatedProductsApi.user, { pause: paused }), {
+      wrapper: MockClientWrapper(relatedProductsApi),
+    });
+
+    expect(result.current[0].data).toBeFalsy();
+    expect(result.current[0].fetching).toBe(false);
+    expect(result.current[0].error).toBeFalsy();
+
+    expect(mockUrqlClient.executeQuery).toBeCalledTimes(0);
+
+    paused = false;
+    rerender();
+    expect(result.current[0].fetching).toBe(true);
+
+    expect(mockUrqlClient.executeQuery).toBeCalledTimes(1);
+
+    mockUrqlClient.executeQuery.pushResponse("users", {
+      data: {
+        users: {
+          edges: [{ cursor: "123", node: { id: "123", email: "[email protected]" } }],
+          pageInfo: {
+            startCursor: "123",
+            endCursor: "123",
+            hasNextPage: false,
+            hasPreviousPage: false,
+          },
+        },
+      },
+      stale: false,
+      hasNext: false,
+    });
+
+    expect(result.current[0].data!.id).toEqual("123");
+    expect(result.current[0].data!.email).toEqual("[email protected]");
+    expect(result.current[0].fetching).toBe(false);
+  });
 });

packages/react/src/useFindFirst.ts

@@ -69,7 +69,7 @@ export const useFindFirst = <
     const error = ErrorWrapper.errorIfDataAbsent(rawResult, dataPath, options?.pause);
 
     return { ...rawResult, data, error };
-  }, [manager, rawResult]);
+  }, [manager.findFirst.operationName, options?.pause, rawResult]);
 
   return [result, refresh];
 };

packages/react/src/useFindMany.ts

@@ -67,7 +67,7 @@ export const useFindMany = <
     const error = ErrorWrapper.errorIfDataAbsent(rawResult, dataPath, options?.pause);
 
     return { ...rawResult, data, error };
-  }, [manager, rawResult]);
+  }, [manager, options?.pause, rawResult]);
 
   return [result, refresh];
 };

packages/react/src/useFindOne.ts

@@ -64,7 +64,7 @@ export const useFindOne = <
     const error = ErrorWrapper.errorIfDataAbsent(rawResult, dataPath, options?.pause);
 
     return { ...rawResult, data, error };
-  }, [rawResult, manager]);
+  }, [manager.findOne.operationName, rawResult, options?.pause]);
 
   return [result, refresh];
 };