1 | import * as React from "rehackt";
|
2 | import { assertWrappedQueryRef, getWrappedPromise, unwrapQueryRef, updateWrappedQueryRef, wrapQueryRef, } from "../internal/index.js";
|
3 | import { useApolloClient } from "./useApolloClient.js";
|
4 | import { wrapHook } from "./internal/index.js";
|
5 | /**
|
6 | * A React hook that returns a `refetch` and `fetchMore` function for a given
|
7 | * `queryRef`.
|
8 | *
|
9 | * This is useful to get access to handlers for a `queryRef` that was created by
|
10 | * `createQueryPreloader` or when the handlers for a `queryRef` produced in
|
11 | * a different component are inaccessible.
|
12 | *
|
13 | * @example
|
14 | * ```tsx
|
15 | * const MyComponent({ queryRef }) {
|
16 | * const { refetch, fetchMore } = useQueryRefHandlers(queryRef);
|
17 | *
|
18 | * // ...
|
19 | * }
|
20 | * ```
|
21 | * @since 3.9.0
|
22 | * @param queryRef - A `QueryRef` returned from `useBackgroundQuery`, `useLoadableQuery`, or `createQueryPreloader`.
|
23 | */
|
24 | export function useQueryRefHandlers(queryRef) {
|
25 | var unwrapped = unwrapQueryRef(queryRef);
|
26 | return wrapHook("useQueryRefHandlers", _useQueryRefHandlers, unwrapped ?
|
27 | unwrapped["observable"]
|
28 | // in the case of a "transported" queryRef object, we need to use the
|
29 | // client that's available to us at the current position in the React tree
|
30 | // that ApolloClient will then have the job to recreate a real queryRef from
|
31 | // the transported object
|
32 | // This is just a context read - it's fine to do this conditionally.
|
33 | // This hook wrapper also shouldn't be optimized by React Compiler.
|
34 | // eslint-disable-next-line react-compiler/react-compiler
|
35 | // eslint-disable-next-line react-hooks/rules-of-hooks
|
36 | : useApolloClient())(queryRef);
|
37 | }
|
38 | function _useQueryRefHandlers(queryRef) {
|
39 | assertWrappedQueryRef(queryRef);
|
40 | var _a = React.useState(queryRef), previousQueryRef = _a[0], setPreviousQueryRef = _a[1];
|
41 | var _b = React.useState(queryRef), wrappedQueryRef = _b[0], setWrappedQueryRef = _b[1];
|
42 | var internalQueryRef = unwrapQueryRef(queryRef);
|
43 | // To ensure we can support React transitions, this hook needs to manage the
|
44 | // queryRef state and apply React's state value immediately to the existing
|
45 | // queryRef since this hook doesn't return the queryRef directly
|
46 | if (previousQueryRef !== queryRef) {
|
47 | setPreviousQueryRef(queryRef);
|
48 | setWrappedQueryRef(queryRef);
|
49 | }
|
50 | else {
|
51 | updateWrappedQueryRef(queryRef, getWrappedPromise(wrappedQueryRef));
|
52 | }
|
53 | var refetch = React.useCallback(function (variables) {
|
54 | var promise = internalQueryRef.refetch(variables);
|
55 | setWrappedQueryRef(wrapQueryRef(internalQueryRef));
|
56 | return promise;
|
57 | }, [internalQueryRef]);
|
58 | var fetchMore = React.useCallback(function (options) {
|
59 | var promise = internalQueryRef.fetchMore(options);
|
60 | setWrappedQueryRef(wrapQueryRef(internalQueryRef));
|
61 | return promise;
|
62 | }, [internalQueryRef]);
|
63 | return {
|
64 | refetch: refetch,
|
65 | fetchMore: fetchMore,
|
66 | subscribeToMore: internalQueryRef.observable.subscribeToMore,
|
67 | };
|
68 | }
|
69 | //# sourceMappingURL=useQueryRefHandlers.js.map |
\ | No newline at end of file |