@jobber/hooks 2.0.3-pre1.55 → 2.0.3-pre2.52

package/dist/useCollectionQuery/uniqueNodes.d.ts

@@ -0,0 +1,5 @@
+export interface Node {
+    id: unknown;
+    __typename?: unknown;
+}
+export declare function uniqueNodes(nodes: Node[]): Node[];

package/dist/useCollectionQuery/uniqueNodes.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.uniqueNodes = void 0;
+function uniqueNodes(nodes) {
+    const result = new Map();
+    nodes.forEach(node => {
+        result.set(`${node.__typename}-${node.id}`, node);
+    });
+    return Array.from(result.values());
+}
+exports.uniqueNodes = uniqueNodes;

package/dist/useCollectionQuery/useCollectionQuery.d.ts

@@ -0,0 +1,71 @@
+import { ApolloError, DocumentNode, QueryHookOptions, SubscribeToMoreOptions } from "@apollo/client";
+import { Node } from "./uniqueNodes";
+import { Edge } from "./uniqueEdges";
+interface UseCollectionQueryArguments<TQuery, TSubscription> {
+    /**
+     * The graphQL query that fetches the collection
+     */
+    query: DocumentNode;
+    /**
+     * A list of options for us to pass into the apollo `useQuery` hook
+     */
+    queryOptions?: QueryHookOptions<TQuery>;
+    /**
+     * A function that returns the location where the {@link Collection} is located.
+     *
+     * The collection is the part of the result that needs to be paginated.
+     */
+    getCollectionByPath: GetCollectionByPathFunction<TQuery>;
+    /**
+     *  A list of subscription options if you want to create a GraphQL
+     *  subscription to listen for more content.
+     */
+    subscription?: ListSubscription<TSubscription>;
+}
+interface ListSubscription<TSubscription> {
+    /**
+     * The graphQL subscription that listens for more data. This query should
+     * return a single Node that matches the data structure in
+     * `getCollectionByPath<TQuery>(...).edges.node` and
+     * `getCollectionByPath<TQuery>(...).nodes
+     */
+    document: DocumentNode;
+    /**
+     * A list of variables to pass into the apollo `subscribeToMore` function.
+     */
+    options?: Pick<SubscribeToMoreOptions<TSubscription>, "variables">;
+    /**
+     * A function that returns the location where the `Node` is located on the
+     * `TSubscription` object.
+     *
+     * It should return a single Node that matches the data structure in
+     * `getCollectionByPath<TQuery>(...).edges.node` and
+     * `getCollectionByPath<TQuery>(...).nodes
+     */
+    getNodeByPath: GetNodeByPath<TSubscription>;
+}
+interface Collection {
+    edges?: Edge[];
+    nodes?: Node[];
+    pageInfo: {
+        endCursor?: string | undefined;
+        hasNextPage: boolean;
+        [otherProperties: string]: unknown;
+    };
+    totalCount?: number;
+    [otherProperties: string]: unknown;
+}
+interface CollectionQueryResult<TQuery> {
+    data: TQuery | undefined;
+    error: ApolloError | undefined;
+    loadingRefresh: boolean;
+    loadingNextPage: boolean;
+    loadingInitialContent: boolean;
+    refresh(): void;
+    nextPage(): void;
+}
+type GetCollectionByPathFunction<TQuery> = (data: TQuery | undefined) => Collection | undefined;
+type GetNodeByPath<TSubscription> = (data: TSubscription | undefined) => Node | undefined;
+export declare function useCollectionQuery<TQuery, TSubscription = undefined>({ query, queryOptions, getCollectionByPath, subscription, }: UseCollectionQueryArguments<TQuery, TSubscription>): CollectionQueryResult<TQuery>;
+export declare function isAlreadyUpdated(outputCollection: Collection, newNode: Node): boolean;
+export {};

package/dist/useCollectionQuery/useCollectionQuery.js

@@ -0,0 +1,181 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isAlreadyUpdated = exports.useCollectionQuery = void 0;
+const client_1 = require("@apollo/client");
+const lodash_1 = require("lodash");
+const react_1 = require("react");
+const formatters_1 = require("@jobber/formatters");
+const uniqueNodes_1 = require("./uniqueNodes");
+const uniqueEdges_1 = require("./uniqueEdges");
+const useIsMounted_1 = require("../useIsMounted");
+function useCollectionQuery({ query, queryOptions, getCollectionByPath, subscription, }) {
+    var _a, _b;
+    const { data, loading, refetch, error, fetchMore, subscribeToMore } = (0, client_1.useQuery)(query, queryOptions);
+    const isMounted = (0, useIsMounted_1.useIsMounted)();
+    const [loadingRefresh, setLoadingRefresh] = (0, react_1.useState)(false);
+    const [loadingNextPage, setLoadingNextPage] = (0, react_1.useState)(false);
+    const loadingInitialContent = loading && !loadingRefresh && !loadingNextPage;
+    const isSearching = !!((_a = queryOptions === null || queryOptions === void 0 ? void 0 : queryOptions.variables) === null || _a === void 0 ? void 0 : _a.searchTerm);
+    const refresh = (0, react_1.useCallback)(() => {
+        if (loadingInitialContent || loadingRefresh) {
+            return;
+        }
+        setLoadingRefresh(true);
+        fetchMore({
+            // a workaround fix for the error described in this post
+            // https://github.com/apollographql/apollo-client/issues/7491#issuecomment-767985363
+            // These changes can be reverted once we can update to version 3.4
+            // (the current release candidate)
+            variables: {},
+            updateQuery: (prev, { fetchMoreResult }) => fetchMoreResult || prev,
+        })
+            .catch(err => formatters_1.config.errorNotifier("Refetch Error", err))
+            .finally(() => {
+            if (isMounted.current) {
+                setLoadingRefresh(false);
+            }
+        });
+    }, [
+        loadingInitialContent,
+        loadingRefresh,
+        setLoadingRefresh,
+        refetch,
+        isMounted,
+    ]);
+    const nextPage = (0, react_1.useCallback)(() => {
+        var _a;
+        if (loadingInitialContent || loadingRefresh || loadingNextPage) {
+            return;
+        }
+        const pageInfo = (_a = getCollectionByPath(data)) === null || _a === void 0 ? void 0 : _a.pageInfo;
+        if (!pageInfo || !pageInfo.hasNextPage) {
+            return;
+        }
+        setLoadingNextPage(true);
+        fetchMore({
+            variables: {
+                cursor: pageInfo.endCursor,
+            },
+            updateQuery: (prev, { fetchMoreResult }) => fetchMoreUpdateQueryHandler(prev, fetchMoreResult, getCollectionByPath),
+        })
+            .catch(err => formatters_1.config.errorNotifier("FetchMore Error", err))
+            .finally(() => {
+            if (isMounted.current) {
+                setLoadingNextPage(false);
+            }
+        });
+    }, [
+        data,
+        loadingInitialContent,
+        loadingRefresh,
+        fetchMore,
+        loadingNextPage,
+        setLoadingNextPage,
+        getCollectionByPath,
+        isMounted,
+    ]);
+    (0, react_1.useEffect)(() => {
+        if (subscription == undefined)
+            return;
+        const subscriptionOptions = subscription.options || {};
+        return subscribeToMore(Object.assign(Object.assign({}, subscriptionOptions), { document: subscription.document, updateQuery: (prev, { subscriptionData }) => subscribeToMoreHandler(isSearching, prev, getCollectionByPath, subscriptionData === null || subscriptionData === void 0 ? void 0 : subscriptionData.data, subscription.getNodeByPath), onError: err => formatters_1.config.errorNotifier("Subscribe to More Error", err) }));
+    }, 
+    // Disabling this linter so we can force this only run once. If we didn't
+    // do this we would need to ensure subscription, subscribeToMore, and getNodeByPath
+    // all use useCallback.
+    [(_b = queryOptions === null || queryOptions === void 0 ? void 0 : queryOptions.variables) === null || _b === void 0 ? void 0 : _b.searchTerm]);
+    return {
+        data,
+        error,
+        refresh,
+        loadingRefresh,
+        nextPage,
+        loadingNextPage,
+        loadingInitialContent,
+    };
+}
+exports.useCollectionQuery = useCollectionQuery;
+/**
+ * The following method uses an `output` variable, and indirectly modifies it through the `outputCollection` variable.
+ * This type of indirect modification is prone to bugs, but I couldn't think of a better way to write this code.
+ *
+ * Here's what I was balancing:
+ * 1. We need to copy the structure of prev to ensure that when we're combining two objects, we're not losing properties
+ * 2. We need to extract a key from an unknown path that's given to us by getCollectionByPath and then we need to modify
+ *    that, and ensure that it's properly set on the cloned output object.
+ * 3. We want to keep the interface to this hook as simple and easy to use as possible
+ *
+ * The alternative approaches that were rejected:
+ * 1. We replace the getCollectionByPath with a keyPath string. (Eg. "data.conversation.message") and then we use lodash
+ *    `get` and `set` which should remove all the object manipulation. But, this approach loses us the type safety that
+ *    getCollectionByPath gives us
+ * 2. We could add a setCollection function to the list of arguments for this hook. This leaves us with type safety but
+ *    makes the `useCollectionQuery` interface more complicated by adding arguments
+ */
+function fetchMoreUpdateQueryHandler(prev, fetchMoreResult, getCollectionByPath) {
+    const nextCollection = getCollectionByPath(fetchMoreResult);
+    const output = (0, lodash_1.cloneDeep)(prev);
+    const outputCollection = getCollectionByPath(output);
+    if (outputCollection === undefined || nextCollection === undefined) {
+        return output;
+    }
+    if (outputCollection.nodes && nextCollection.nodes) {
+        outputCollection.nodes = getUpdatedNodes(outputCollection.nodes, nextCollection.nodes);
+    }
+    if (outputCollection.edges && nextCollection.edges) {
+        outputCollection.edges = getUpdatedEdges(outputCollection.edges, nextCollection.edges);
+    }
+    Object.assign(outputCollection, Object.assign({ pageInfo: (0, lodash_1.cloneDeep)(nextCollection.pageInfo) }, getTotalCount(nextCollection.totalCount)));
+    return output;
+}
+function subscribeToMoreHandler(isSearching, prev, getCollectionByPath, subscriptionData, getNodeByPath) {
+    const node = getNodeByPath(subscriptionData);
+    const output = (0, lodash_1.cloneDeep)(prev);
+    const outputCollection = getCollectionByPath(output);
+    if (outputCollection == undefined || node == undefined)
+        return output;
+    if (isAlreadyUpdated(outputCollection, node) || isSearching) {
+        return prev;
+    }
+    if (outputCollection.nodes) {
+        outputCollection.nodes = getUpdatedNodes(outputCollection.nodes, [node], false);
+    }
+    if (outputCollection.edges) {
+        outputCollection.edges = getUpdatedEdges(outputCollection.edges, [(0, uniqueEdges_1.createEdge)(node)], false);
+    }
+    Object.assign(outputCollection, Object.assign({ pageInfo: (0, lodash_1.cloneDeep)(outputCollection.pageInfo) }, getTotalCount(outputCollection.totalCount, 1)));
+    return output;
+}
+function getTotalCount(totalCount, additionalCount = 0) {
+    return totalCount !== undefined
+        ? { totalCount: totalCount + additionalCount }
+        : {};
+}
+function isAlreadyUpdated(outputCollection, newNode) {
+    let edgesAlreadyUpdated = true;
+    let nodesAlreadyUpdated = true;
+    if (outputCollection.edges) {
+        edgesAlreadyUpdated = outputCollection.edges.some(edge => {
+            return edge.node.id === newNode.id;
+        });
+    }
+    if (outputCollection.nodes) {
+        nodesAlreadyUpdated = outputCollection.nodes.some(node => {
+            return node.id === newNode.id;
+        });
+    }
+    return edgesAlreadyUpdated && nodesAlreadyUpdated;
+}
+exports.isAlreadyUpdated = isAlreadyUpdated;
+function getUpdatedEdges(prevEdges, nextEdges, appendToEnd = true) {
+    const newEdges = appendToEnd
+        ? [...prevEdges, ...nextEdges]
+        : [...nextEdges, ...prevEdges];
+    return (0, uniqueEdges_1.uniqueEdges)(newEdges);
+}
+function getUpdatedNodes(prevNodes, nextNodes, appendToEnd = true) {
+    const newNodes = appendToEnd
+        ? [...prevNodes, ...nextNodes]
+        : [...nextNodes, ...prevNodes];
+    return (0, uniqueNodes_1.uniqueNodes)(newNodes);
+}

package/dist/useCollectionQuery/useCollectionQuery.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/useCollectionQuery/useCollectionQuery.test.js

@@ -0,0 +1,327 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_hooks_1 = require("@testing-library/react-hooks");
+const react_1 = require("@testing-library/react");
+const useCollectionQuery_1 = require("./useCollectionQuery");
+const test_utilities_1 = require("./test-utilities");
+beforeEach(() => {
+    (0, test_utilities_1.setListQueryMockHasNextPage)(true);
+    test_utilities_1.listQueryResponseMock.mockClear();
+    test_utilities_1.subscriptionQueryMock.mockClear();
+});
+function useCollectionQueryHook(query) {
+    return (0, useCollectionQuery_1.useCollectionQuery)({
+        query: query,
+        getCollectionByPath(data) {
+            var _a;
+            return (_a = data === null || data === void 0 ? void 0 : data.conversation) === null || _a === void 0 ? void 0 : _a.smsMessages;
+        },
+    });
+}
+function useCollectionQueryHookWithSubscription(query) {
+    return (0, useCollectionQuery_1.useCollectionQuery)({
+        query: query,
+        getCollectionByPath(data) {
+            var _a;
+            return (_a = data === null || data === void 0 ? void 0 : data.conversation) === null || _a === void 0 ? void 0 : _a.smsMessages;
+        },
+        subscription: {
+            document: test_utilities_1.SUBSCRIPTION_QUERY,
+            getNodeByPath(conversationData) {
+                var _a;
+                return (_a = conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationMessage) === null || _a === void 0 ? void 0 : _a.smsMessage;
+            },
+        },
+    });
+}
+function useCollectionQueryHookWithSubscriptionAndSearch(query, searchTerm) {
+    return (0, useCollectionQuery_1.useCollectionQuery)({
+        query: query,
+        queryOptions: {
+            variables: {
+                searchTerm: searchTerm,
+            },
+        },
+        getCollectionByPath(data) {
+            var _a;
+            return (_a = data === null || data === void 0 ? void 0 : data.conversation) === null || _a === void 0 ? void 0 : _a.smsMessages;
+        },
+        subscription: {
+            document: test_utilities_1.SUBSCRIPTION_QUERY,
+            getNodeByPath(conversationData) {
+                var _a;
+                return (_a = conversationData === null || conversationData === void 0 ? void 0 : conversationData.conversationMessage) === null || _a === void 0 ? void 0 : _a.smsMessage;
+            },
+        },
+    });
+}
+describe("useCollectionQuery", () => {
+    describe.each `
+    testCase                 | query                          | responseMock
+    ${"excludes totalCount"} | ${test_utilities_1.LIST_QUERY}                  | ${test_utilities_1.listQueryResponseMock}
+    ${"includes totalCount"} | ${test_utilities_1.LIST_QUERY_WITH_TOTAL_COUNT} | ${test_utilities_1.listQueryWithTotalCountResponseMock}
+  `("when the query run $testCase", ({ query, responseMock }) => {
+        describe("when useCollectionQuery is first called", () => {
+            describe("when nextPage is called while it's still loading initial content", () => {
+                it("should not trigger a the next page to be fetched", () => __awaiter(void 0, void 0, void 0, function* () {
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMockForNextPage)(query, responseMock),
+                        ]),
+                    });
+                    (0, react_hooks_1.act)(() => {
+                        result.current.nextPage();
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    expect(responseMock).toHaveBeenCalledTimes(1);
+                }));
+            });
+            describe("when refresh is called while it's still loading initial content", () => {
+                it("should not trigger a refresh", () => __awaiter(void 0, void 0, void 0, function* () {
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                        ]),
+                    });
+                    (0, react_hooks_1.act)(() => {
+                        result.current.refresh();
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    expect(responseMock).toHaveBeenCalledTimes(1);
+                }));
+            });
+            describe("when there is no error", () => {
+                it("should update data", () => __awaiter(void 0, void 0, void 0, function* () {
+                    var _a, _b, _c, _d;
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([(0, test_utilities_1.buildListRequestMock)(query, responseMock)]),
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    expect((_d = (_c = (_b = (_a = result.current.data) === null || _a === void 0 ? void 0 : _a.conversation) === null || _b === void 0 ? void 0 : _b.smsMessages) === null || _c === void 0 ? void 0 : _c.edges) === null || _d === void 0 ? void 0 : _d.length).toBe(1);
+                }));
+                it("should set initialLoading while loading data", () => __awaiter(void 0, void 0, void 0, function* () {
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([(0, test_utilities_1.buildListRequestMock)(query, responseMock)]),
+                    });
+                    expect(result.current.loadingInitialContent).toBe(true);
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                }));
+            });
+        });
+        describe("#nextPage", () => {
+            describe("when nextPage is called while it's still loadingNextPage", () => {
+                it("should not trigger a nextPage", () => __awaiter(void 0, void 0, void 0, function* () {
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMockForNextPage)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMockForNextPage)(query, responseMock),
+                        ]),
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    (0, react_hooks_1.act)(() => {
+                        result.current.nextPage();
+                    });
+                    (0, react_hooks_1.act)(() => {
+                        result.current.nextPage();
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    yield (0, react_1.waitFor)(() => {
+                        var _a, _b, _c;
+                        expect((_c = (_b = (_a = result.current.data) === null || _a === void 0 ? void 0 : _a.conversation) === null || _b === void 0 ? void 0 : _b.smsMessages) === null || _c === void 0 ? void 0 : _c.edges).toHaveLength(2);
+                    });
+                }));
+            });
+            describe("when refresh is called while it's still loadingNextPage", () => {
+                it("should trigger a refresh", () => __awaiter(void 0, void 0, void 0, function* () {
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMockForNextPage)(query, responseMock),
+                        ]),
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    (0, react_hooks_1.act)(() => {
+                        result.current.nextPage();
+                    });
+                    (0, react_hooks_1.act)(() => {
+                        result.current.refresh();
+                    });
+                    expect(result.current.loadingRefresh).toBe(true);
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                }));
+            });
+            describe("when there is no more data to fetch", () => {
+                it("should not fetch more data", () => __awaiter(void 0, void 0, void 0, function* () {
+                    (0, test_utilities_1.setListQueryMockHasNextPage)(false);
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMockForNextPage)(query, responseMock),
+                        ]),
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    (0, react_hooks_1.act)(() => {
+                        result.current.nextPage();
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    expect(responseMock).toHaveBeenCalledTimes(1);
+                }));
+            });
+            describe("when there is no error", () => {
+                it("should update data", () => __awaiter(void 0, void 0, void 0, function* () {
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMockForNextPage)(query, responseMock),
+                        ]),
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    (0, react_hooks_1.act)(() => {
+                        result.current.nextPage();
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    yield (0, react_1.waitFor)(() => {
+                        var _a, _b, _c;
+                        expect((_c = (_b = (_a = result.current.data) === null || _a === void 0 ? void 0 : _a.conversation) === null || _b === void 0 ? void 0 : _b.smsMessages) === null || _c === void 0 ? void 0 : _c.edges).toHaveLength(2);
+                    });
+                }));
+                it("should set loadingNextPage while loading data", () => __awaiter(void 0, void 0, void 0, function* () {
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMockForNextPage)(query, responseMock),
+                        ]),
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    (0, react_hooks_1.act)(() => {
+                        result.current.nextPage();
+                    });
+                    expect(result.current.loadingNextPage).toBe(true);
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                }));
+            });
+        });
+        describe("#refresh", () => {
+            describe("when refresh is called while it's still loadingRefresh", () => {
+                it("should not trigger a refresh", () => __awaiter(void 0, void 0, void 0, function* () {
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                        ]),
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    (0, react_hooks_1.act)(() => {
+                        result.current.refresh();
+                    });
+                    (0, react_hooks_1.act)(() => {
+                        result.current.refresh();
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    expect(responseMock).toHaveBeenCalledTimes(2);
+                }));
+            });
+            describe("when nextPage is called while it's still loadingRefresh", () => {
+                it("should not trigger a nextPage", () => __awaiter(void 0, void 0, void 0, function* () {
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMockForNextPage)(query, responseMock),
+                        ]),
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    (0, react_hooks_1.act)(() => {
+                        result.current.refresh();
+                    });
+                    (0, react_hooks_1.act)(() => {
+                        result.current.nextPage();
+                    });
+                    expect(result.current.loadingNextPage).toBe(false);
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                }));
+            });
+            describe("when there is no error", () => {
+                it("should set loadingRefresh while loading data", () => __awaiter(void 0, void 0, void 0, function* () {
+                    const { result } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHook(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock),
+                        ]),
+                    });
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                    (0, react_hooks_1.act)(() => {
+                        result.current.refresh();
+                    });
+                    expect(result.current.loadingRefresh).toBe(true);
+                    yield (0, react_hooks_1.act)(test_utilities_1.wait);
+                }));
+            });
+        });
+        describe("#subscribeToMore", () => {
+            describe("when hook receives update from item not in collection", () => {
+                it("should add new item to collection", () => __awaiter(void 0, void 0, void 0, function* () {
+                    var _a, _b, _c, _d, _e;
+                    const { result, waitForNextUpdate } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHookWithSubscription(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock, "1"),
+                            (0, test_utilities_1.buildSubscriptionRequestMock)("2"),
+                        ]),
+                    });
+                    // Wait for initial load
+                    yield (0, react_hooks_1.act)(waitForNextUpdate);
+                    // Wait for subscription
+                    yield (0, react_hooks_1.act)(waitForNextUpdate);
+                    expect((_e = (_d = (_c = (_b = (_a = result === null || result === void 0 ? void 0 : result.current) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.conversation) === null || _c === void 0 ? void 0 : _c.smsMessages) === null || _d === void 0 ? void 0 : _d.edges) === null || _e === void 0 ? void 0 : _e.length).toBe(2);
+                }));
+            });
+            describe("when hook receives update from item already in collection", () => {
+                it("should return the existing collection", () => __awaiter(void 0, void 0, void 0, function* () {
+                    var _a, _b, _c, _d, _e;
+                    const { result, waitForNextUpdate } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHookWithSubscription(query), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock, "1"),
+                            (0, test_utilities_1.buildSubscriptionRequestMock)("1"),
+                        ]),
+                    });
+                    // Wait for initial load
+                    yield (0, react_hooks_1.act)(waitForNextUpdate);
+                    // Wait for subscription
+                    yield (0, react_hooks_1.act)(() => (0, test_utilities_1.wait)(200));
+                    expect((_e = (_d = (_c = (_b = (_a = result === null || result === void 0 ? void 0 : result.current) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.conversation) === null || _c === void 0 ? void 0 : _c.smsMessages) === null || _d === void 0 ? void 0 : _d.edges) === null || _e === void 0 ? void 0 : _e.length).toBe(1);
+                }));
+            });
+            describe("when hook receives `update` but is currently searching a collection", () => {
+                it("should return the existing collection without adding the subscribed content", () => __awaiter(void 0, void 0, void 0, function* () {
+                    var _a, _b, _c, _d, _e;
+                    const searchTerm = "FooBar";
+                    const { result, waitForNextUpdate } = (0, react_hooks_1.renderHook)(() => useCollectionQueryHookWithSubscriptionAndSearch(query, searchTerm), {
+                        wrapper: (0, test_utilities_1.wrapper)([
+                            (0, test_utilities_1.buildListRequestMock)(query, responseMock, "1", searchTerm),
+                            (0, test_utilities_1.buildSubscriptionRequestMock)("1"),
+                        ]),
+                    });
+                    // Wait for initial load
+                    yield (0, react_hooks_1.act)(waitForNextUpdate);
+                    // Wait for subscription
+                    yield (0, react_hooks_1.act)(() => (0, test_utilities_1.wait)(200));
+                    expect((_e = (_d = (_c = (_b = (_a = result === null || result === void 0 ? void 0 : result.current) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.conversation) === null || _c === void 0 ? void 0 : _c.smsMessages) === null || _d === void 0 ? void 0 : _d.edges) === null || _e === void 0 ? void 0 : _e.length).toBe(1);
+                }));
+            });
+        });
+    });
+});

package/dist/useFocusTrap/index.d.ts

@@ -1 +1 @@
-export { useFocusTrap } from "./useFocusTrap.js";
+export { useFocusTrap } from "./useFocusTrap";

package/dist/useFocusTrap/index.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFocusTrap = void 0;
-var useFocusTrap_js_1 = require("./useFocusTrap.js");
-Object.defineProperty(exports, "useFocusTrap", { enumerable: true, get: function () { return useFocusTrap_js_1.useFocusTrap; } });
+var useFocusTrap_1 = require("./useFocusTrap");
+Object.defineProperty(exports, "useFocusTrap", { enumerable: true, get: function () { return useFocusTrap_1.useFocusTrap; } });

package/dist/useFocusTrap/useFocusTrap.test.d.ts

@@ -0,0 +1 @@
+export {};