You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
48 lines
2.0 KiB
48 lines
2.0 KiB
import * as React from "rehackt"; |
|
import { getWrappedPromise, unwrapQueryRef, updateWrappedQueryRef, wrapQueryRef, } from "../internal/index.js"; |
|
/** |
|
* A React hook that returns a `refetch` and `fetchMore` function for a given |
|
* `queryRef`. |
|
* |
|
* This is useful to get access to handlers for a `queryRef` that was created by |
|
* `createQueryPreloader` or when the handlers for a `queryRef` produced in |
|
* a different component are inaccessible. |
|
* |
|
* @example |
|
* ```tsx |
|
* const MyComponent({ queryRef }) { |
|
* const { refetch, fetchMore } = useQueryRefHandlers(queryRef); |
|
* |
|
* // ... |
|
* } |
|
* ``` |
|
* @since 3.9.0 |
|
* @param queryRef - A `QueryReference` returned from `useBackgroundQuery`, `useLoadableQuery`, or `createQueryPreloader`. |
|
*/ |
|
export function useQueryRefHandlers(queryRef) { |
|
var _a = React.useState(queryRef), previousQueryRef = _a[0], setPreviousQueryRef = _a[1]; |
|
var _b = React.useState(queryRef), wrappedQueryRef = _b[0], setWrappedQueryRef = _b[1]; |
|
var internalQueryRef = unwrapQueryRef(queryRef); |
|
// To ensure we can support React transitions, this hook needs to manage the |
|
// queryRef state and apply React's state value immediately to the existing |
|
// queryRef since this hook doesn't return the queryRef directly |
|
if (previousQueryRef !== queryRef) { |
|
setPreviousQueryRef(queryRef); |
|
setWrappedQueryRef(queryRef); |
|
} |
|
else { |
|
updateWrappedQueryRef(queryRef, getWrappedPromise(wrappedQueryRef)); |
|
} |
|
var refetch = React.useCallback(function (variables) { |
|
var promise = internalQueryRef.refetch(variables); |
|
setWrappedQueryRef(wrapQueryRef(internalQueryRef)); |
|
return promise; |
|
}, [internalQueryRef]); |
|
var fetchMore = React.useCallback(function (options) { |
|
var promise = internalQueryRef.fetchMore(options); |
|
setWrappedQueryRef(wrapQueryRef(internalQueryRef)); |
|
return promise; |
|
}, [internalQueryRef]); |
|
return { refetch: refetch, fetchMore: fetchMore }; |
|
} |
|
//# sourceMappingURL=useQueryRefHandlers.js.map
|