apollographql / apollo-client

:rocket:  A fully-featured, production ready caching GraphQL client for every UI framework and GraphQL server.
https://apollographql.com/client
MIT License
19.38k stars 2.66k forks source link

Need Help "Store reset while query was in flight (not completed in link chain" #12067

Open wies105 opened 2 months ago

wies105 commented 2 months ago

Hello, I get Store reset while query was in flight (not completed in link chain) after cache.evict called. I have an Angular 16 Project with "@apollo/client": "^3.11.0",

On Mutation, I will increase the cache.

    return this.apollo.mutate<T>({
      mutation: this.buildDeleteMutationRequest(mutationRequest, id),
      update: (cache, {data}) => this.deletedItemFromCache(cache, classRef, id)
    })
  private deletedItemFromCache<T>(cache: any, classRef: T, id?: number) {
    // Unique identifier for the request to be removed
    const singleRequest = getSingleRequestName(classRef);
    const listRequest = getListRequestName(classRef);
    cache.evict({ id: "ROOT_QUERY", fieldName: listRequest, broadcast: false });
     id && cache.evict({ id: "ROOT_QUERY", fieldName: singleRequest, value: id , broadcast: false });
     try {
      cache.gc({ resetResultCache: true });
     }catch (e : any) {
       console.error(e?.message ? e.message : e);
     }
  }
wies105 commented 1 month ago

Update: I have updated my function to check if any qoue in the pipe and run into the same error

  private deletedItemFromCache<T>(cache: any, classRef: T, id?: number) {

    const singleRequest = getSingleRequestName(classRef);
    const listRequest = getListRequestName(classRef);

    this.apollo.client.getObservableQueries("active").forEach((observableQuery: any) => {
      observableQuery.subscribe({
        next: (result: any) => {
          if (result.loading) {
            console.log('Query is in flight:', observableQuery.queryId);
          } else {
            cache.modify({
              id: "ROOT_QUERY",
              fields: {
                [listRequest](existingRefs: any, {readField}: {
                  readField: (fieldName: string, ref: any) => any
                }) {
                  return existingRefs.items?.filter((ref: any) => id !== readField('id', ref)) || existingRefs.filter((ref: any) => id !== readField('id', ref));
                },
                [singleRequest](existingRefs: any, {readField}: {
                  readField: (fieldName: string, ref: any) => any
                }) {
                  return existingRefs.items?.filter(
                    (ref : any) => id === readField('id', ref)
                  ) || existingRefs.filter((ref: any) => id === readField('id', ref));
                }
              }
            });
          }
        }
      })
    });
  }