Why function for applying query returns void instead of a promise?

[illyakurochkin]

When I'm using useLazyQuery, the function for applying query returns void instead of a promise.

const [fetch, {data, loading}] = useLazyQuery();
...
await fetch(); // I can't do that because `fetch` return type is void

Why can't it return a promise, like for mutations?

[hwillson]

Related:

• useLazyQuery execute function should return a promise apollo-feature-requests#190
• Execute function of useLazyQuery should resolve FetchResult apollo-feature-requests#174

[euphocat]

just to remember it's an old question asked already here: apollographql/react-apollo#3499

[ofrank123]

In the meantime something like the following could be used:

export const useAsyncQuery = <TData, TVariables = OperationVariables>(
  query: DocumentNode | TypedDocumentNode
): [
  (variables: TVariables) => Promise<ApolloQueryResult<TData>>,
  { loading: boolean }
] => {
  const [loading, setLoading] = useState(false);
  const client = useApolloClient();

  const runQuery = async (variables: TVariables) => {
    setLoading(true);
    const res = await client.query<TData, TVariables>({ query, variables });
    setLoading(false);
    return res;
  };

  return [runQuery, { loading }];
};

[hwillson]

This was addressed in #8875 - thanks