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.
97 lines
4.9 KiB
97 lines
4.9 KiB
4 months ago
|
import type { DocumentNode, OperationVariables, TypedDocumentNode } from "../../core/index.js";
|
||
|
import type { QueryReference } from "../internal/index.js";
|
||
|
import type { LoadableQueryHookOptions } from "../types/types.js";
|
||
|
import type { FetchMoreFunction, RefetchFunction } from "./useSuspenseQuery.js";
|
||
|
import type { DeepPartial, OnlyRequiredProperties } from "../../utilities/index.js";
|
||
|
export type LoadQueryFunction<TVariables extends OperationVariables> = (...args: [TVariables] extends [never] ? [] : {} extends OnlyRequiredProperties<TVariables> ? [variables?: TVariables] : [variables: TVariables]) => void;
|
||
|
type ResetFunction = () => void;
|
||
|
export type UseLoadableQueryResult<TData = unknown, TVariables extends OperationVariables = OperationVariables> = [
|
||
|
loadQuery: LoadQueryFunction<TVariables>,
|
||
|
queryRef: QueryReference<TData, TVariables> | null,
|
||
|
{
|
||
|
/**
|
||
|
* A function that helps you fetch the next set of results for a [paginated list field](https://www.apollographql.com/docs/react/pagination/core-api/).
|
||
|
*
|
||
|
*
|
||
|
* @docGroup
|
||
|
*
|
||
|
* 3. Helper functions
|
||
|
*/
|
||
|
fetchMore: FetchMoreFunction<TData, TVariables>;
|
||
|
/**
|
||
|
* A function that enables you to re-execute the query, optionally passing in new `variables`.
|
||
|
*
|
||
|
* To guarantee that the refetch performs a network request, its `fetchPolicy` is set to `network-only` (unless the original query's `fetchPolicy` is `no-cache` or `cache-and-network`, which also guarantee a network request).
|
||
|
*
|
||
|
* See also [Refetching](https://www.apollographql.com/docs/react/data/queries/#refetching).
|
||
|
*
|
||
|
* @docGroup
|
||
|
*
|
||
|
* 3. Helper functions
|
||
|
*/
|
||
|
refetch: RefetchFunction<TData, TVariables>;
|
||
|
/**
|
||
|
* A function that resets the `queryRef` back to `null`.
|
||
|
*/
|
||
|
reset: ResetFunction;
|
||
|
}
|
||
|
];
|
||
|
export declare function useLoadableQuery<TData, TVariables extends OperationVariables, TOptions extends LoadableQueryHookOptions>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options?: LoadableQueryHookOptions & TOptions): UseLoadableQueryResult<TOptions["errorPolicy"] extends "ignore" | "all" ? TOptions["returnPartialData"] extends true ? DeepPartial<TData> | undefined : TData | undefined : TOptions["returnPartialData"] extends true ? DeepPartial<TData> : TData, TVariables>;
|
||
|
export declare function useLoadableQuery<TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: LoadableQueryHookOptions & {
|
||
|
returnPartialData: true;
|
||
|
errorPolicy: "ignore" | "all";
|
||
|
}): UseLoadableQueryResult<DeepPartial<TData> | undefined, TVariables>;
|
||
|
export declare function useLoadableQuery<TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: LoadableQueryHookOptions & {
|
||
|
errorPolicy: "ignore" | "all";
|
||
|
}): UseLoadableQueryResult<TData | undefined, TVariables>;
|
||
|
export declare function useLoadableQuery<TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: LoadableQueryHookOptions & {
|
||
|
returnPartialData: true;
|
||
|
}): UseLoadableQueryResult<DeepPartial<TData>, TVariables>;
|
||
|
/**
|
||
|
* A hook for imperatively loading a query, such as responding to a user
|
||
|
* interaction.
|
||
|
*
|
||
|
* > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
|
||
|
*
|
||
|
* @example
|
||
|
* ```jsx
|
||
|
* import { gql, useLoadableQuery } from "@apollo/client";
|
||
|
*
|
||
|
* const GET_GREETING = gql`
|
||
|
* query GetGreeting($language: String!) {
|
||
|
* greeting(language: $language) {
|
||
|
* message
|
||
|
* }
|
||
|
* }
|
||
|
* `;
|
||
|
*
|
||
|
* function App() {
|
||
|
* const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
|
||
|
*
|
||
|
* return (
|
||
|
* <>
|
||
|
* <button onClick={() => loadGreeting({ language: "english" })}>
|
||
|
* Load greeting
|
||
|
* </button>
|
||
|
* <Suspense fallback={<div>Loading...</div>}>
|
||
|
* {queryRef && <Hello queryRef={queryRef} />}
|
||
|
* </Suspense>
|
||
|
* </>
|
||
|
* );
|
||
|
* }
|
||
|
*
|
||
|
* function Hello({ queryRef }) {
|
||
|
* const { data } = useReadQuery(queryRef);
|
||
|
*
|
||
|
* return <div>{data.greeting.message}</div>;
|
||
|
* }
|
||
|
* ```
|
||
|
*
|
||
|
* @since 3.9.0
|
||
|
* @param query - A GraphQL query document parsed into an AST by `gql`.
|
||
|
* @param options - Options to control how the query is executed.
|
||
|
* @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
|
||
|
*/
|
||
|
export declare function useLoadableQuery<TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options?: LoadableQueryHookOptions): UseLoadableQueryResult<TData, TVariables>;
|
||
|
export {};
|
||
|
//# sourceMappingURL=useLoadableQuery.d.ts.map
|