apollo-client

apollo-client copied to clipboard

Issue Description

Hey, I am using 3.5.8 that version of apollo client. I have a simple pagination system. This is the type policy I defined:

            watchPlaylist: {
              keyArgs: ['playlistType'],
              merge(existing: WatchPlaylist, incomingData: WatchPlaylist, { args }): WatchPlaylist {

                const merged = existing?.playlist?.mediaItems ? existing?.playlist?.mediaItems.slice(0) : [];
                const incoming = incomingData?.playlist?.mediaItems || [];
                if (incoming) {
                  if (args) {
                    // Assume an offset of 0 if args.offset omitted.
                    const { offset = 0 } = args as {offset: number;};
                    for (let i = 0; i < incoming.length; ++i) {
                      merged[offset + i] = incoming[i];
                    }
                  } else {
                    // It's unusual (probably a mistake) for a paginated field not
                    // to receive any arguments, so you might prefer to throw an
                    // exception here, instead of recovering by appending incoming
                    // onto the existing array.
                    // eslint-disable-next-line prefer-spread
                    merged.push.apply(merged, incoming);
                  }
                }
          
                return {
                  ...existing,
                  ...incoming,
                  playlist: {
                    ...existing?.playlist,
                    ...incomingData?.playlist,
                    mediaItems: merged
                  }
                };
              },
            },

And I am calling the query like this:

  const { data, loading, refetch, fetchMore } = useQuery<PlaylistQueryType>(
    PlaylistQuery,
    {
      notifyOnNetworkStatusChange: true,
      variables: {
        playlistType,
        offset: LIMIT * currentPageRef.current,
        limit: LIMIT
      }
    }
  );

And then when I execute the fetchMore I am doing this:

fetchMore({
        variables: {
          offset: (LIMIT * currentPageRef.current) + 1
        }
      });

But the networkStatus or the loading are not being updated. I do have notifyOnNetworkStatusChange on true.

I am changing my own loader after the fetchMore Promise but it is not the ideal solution.

I think this is a bug or maybe there is something important I did wrong on my config

Link to Reproduction

Reproduction Steps

Hi @felire 👋🏻 thanks for letting us know about this! Unfortunately it's difficult to know what the issue might be without being able to run the code that you're sharing. I recommend sharing a runnable reproduction so the community and maintainers can help narrow down whether this is an issue with your application code or with Apollo Client. Looking forward to hearing back from you 🙏🏻

@bignimbus I am not able to provide a reproducible demo, I am not allowed to share the app. I just provided the type policy and how the query is being used.

I have a similar issue where I create a watchQuery with standby fetchPolicy and then start it witch fetchMore. The query executes and data is correctly passend through but loading is not updated.

@DaSchTour I assume you are setting notifyOnNetworkStatusChange: true as an option to your watchQuery?

If that's already the case, we really need a reproducible demo on this to investigate further, it would be great if you could provide us something.

This just started happening to me as well for a timeline feed. Fetch more runs and data is returned, but network status isn't updated and the new data doesn't get paginated.

To make matters even worse it started happening out of nowhere. And it's basically unreproducible because so far it's only happening to one particular timeline feed (that i know of) but there's nothing special about this feed.

@pfcodes as per my last message: Do you set notifyOnNetworkStatusChange: true on that query?

And it's basically unreproducible because so far it's only happening to one particular timeline feed (that i know of) but there's nothing special about this feed.

Unfortunately, without a reproduction there is no way we can look into this issue 😞

Yeah, I used the notify on networkStatusChanges. It's hard to create a reproduction. For me the behavior of watchQuery, fetchMore, networkStatus and cache merges is completely unpredictable. After a lot of refactoring our team decided to drop apollo cache usage instead of selfbuild state management.