@apollo/client#QueryTuple TypeScript Examples

The following examples show how to use @apollo/client#QueryTuple. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: useLazyQuery.ts    From lexicon with MIT License 6 votes vote down vote up 
export function useLazyQuery<TData, TVariables = OperationVariables>(
  query: DocumentNode,
  options?: LazyQueryHookOptions<TData, TVariables>,
  errorAlert: ErrorAlertOptionType = 'SHOW_ALERT',
): QueryTuple<TData, TVariables> {
  const onErrorDefault = (error: ApolloError) => {
    errorHandlerAlert(error);
  };

  const { fetchPolicy = 'cache-and-network', ...others } = options ?? {};

  const {
    onError = errorAlert === 'SHOW_ALERT' ? onErrorDefault : undefined,
    nextFetchPolicy = fetchPolicy === 'cache-and-network'
      ? 'cache-first'
      : undefined,
    notifyOnNetworkStatusChange = fetchPolicy === 'network-only',
    ...otherOptions
  } = others;

  let [queryFunction, queryResult] = useLazyQueryBase<TData, TVariables>(
    query,
    {
      fetchPolicy,
      nextFetchPolicy,
      notifyOnNetworkStatusChange,
      onError,
      ...otherOptions,
    },
  );

  return [queryFunction, queryResult];
}
Example #2
Source File: Apollo.ts    From graphql-ts-client with MIT License 5 votes vote down vote up 
export function useTypedLazyQuery<
    TData extends object,
    TVariables extends object
>( 
    fetcher: Fetcher<"Query", TData, TVariables>,
    options?: QueryHookOptions<TData, TVariables> & {
        readonly operationName?: string,
		readonly registerDependencies?: boolean | { readonly fieldDependencies: readonly Fetcher<string, object, object>[] }
	}
) : QueryTuple<TData, TVariables> {

    const body = requestBody(fetcher);

	const [operationName, request] = useMemo<[string, DocumentNode]>(() => {
		const operationName = options?.operationName ?? `query_${util.toMd5(body)}`;
		return [operationName, gql`query ${operationName}${body}`];
	}, [body, options?.operationName]);

	const [dependencyManager, config] = useContext(dependencyManagerContext);
	const register = options?.registerDependencies !== undefined ? !!options.registerDependencies : config?.defaultRegisterDependencies ?? false;
	if (register && dependencyManager === undefined) {
		throw new Error("The property 'registerDependencies' of options requires <DependencyManagerProvider/>");
	}
	useEffect(() => {
		if (register) {
			dependencyManager!.register(
				operationName, 
				fetcher, 
				typeof options?.registerDependencies === 'object' ? options?.registerDependencies?.fieldDependencies : undefined
			);
			return () => { dependencyManager!.unregister(operationName); };
		}// eslint-disable-next-line
	}, [register, dependencyManager, operationName, options?.registerDependencies, request]); // Eslint disable is required, becasue 'fetcher' is replaced by 'request' here.
	const response = useLazyQuery<TData, TVariables>(request, options);
	const responseData = response[1].data;
	const newResponseData = useMemo(() => util.exceptNullValues(responseData), [responseData]);
	return newResponseData === responseData ? response : [
        response[0],
        { ...response[1], data: newResponseData }
    ] as QueryTuple<TData, TVariables>;
}
Example #3
Source File: useBlockPollingSubscription.ts    From mStable-apps with GNU Lesser General Public License v3.0 5 votes vote down vote up 
useBlockPollingSubscription = <TData, TVariables>(
  lazyQuery: (query: unknown, options?: LazyQueryHookOptions<TData, TVariables>) => QueryTuple<TData, TVariables>,
  baseOptions?: LazyQueryHookOptions<TData, TVariables>,
  skip?: boolean,
): QueryResult<TData, TVariables> => {
  const errorRef = useRef<unknown>()
  const network = useNetwork()
  const blockNumber = useBlockNow()
  const hasBlock = !!blockNumber

  // We're using a long-polling query because subscriptions don't seem to be
  // re-run when derived or nested fields change.
  // See https://github.com/graphprotocol/graph-node/issues/1398
  const [run, query] = lazyQuery({
    ...baseOptions,
    errorPolicy: 'all',
    onError: (error: unknown) => {
      errorRef.current = error
    },
  })

  // Long poll (15s interval) if the block number isn't available.
  useEffect(() => {
    let interval: NodeJS.Timeout

    if (!skip && !hasBlock && !errorRef.current) {
      run()
      interval = setInterval(() => {
        run()
      }, network.blockTime)
    }

    return () => {
      clearInterval(interval)
    }
  }, [skip, hasBlock, run, network])

  // Run the query on every block when the block number is available.
  useEffect(() => {
    if (!skip && blockNumber) {
      run()
    }
  }, [skip, blockNumber, run, network])

  return query as never
}