Executing the same query multiple times with different variables

I need to execute my query multilple times with different variables. The only way I could find to make this work is pretty ugly -

ids.forEach((id) => {
            query
                .refetch(
                    caseId: id,
                })
                .then((res: { data: CaseOutput }) => {
                    <logic>
                });
        });

This is a pretty buggy approach and makes some of my queries stall / fail unexpectedly. Is there a cleaner way to do this?

1 Like

Having similar issue…

We achieve this in React using the useLazyQuery hook provided by Apollo Client. In the snippet below, invoking the useLazyQuery constructor on component mount returns a sendRequest method which we use later on down the app/component exectution. We invoke this method passing in new variables that override those set on mount.

    const query_options = useMemo(() => ({
        onCompleted: onResultCallback, fetchPolicy: fetch_policy, notifyOnNetworkStatusChange: true, returnPartialData: false, errorPolicy: "all", overwrite: false
    }), [fetch_policy, onResultCallback]);

    const [sendRequest, { error }] = useLazyQuery(gql`${query}`, { ...query_options, variables: { request: my_dynamic_request_object });
    // later on in component execution - call sendRequest with new variables
    sendRequest({ variables: my_dynamic_request_object });

Why does it fail?
Maybe you could try batching your request?
Or if you have too many to do, maybe you could just add a setTimeout after each request resolve in order to give it a delay?

Or maybe apply Promise.all() on your array of requests?