How to redirect after a deleting mutation in Apollo?

Question

After I delete a post, I want to update the cache and redirect to the post index page.

deletePost() {
  this.$apollo.mutate({
    mutation: DELETE_POST,
    variables: {
      postId: this.postId
    },
    update: (cache, { data: { deletePost } }) => {
      const query = {
        query: GET_PAGINATED_POSTS,
        variables: {
          page: 0,
          pageSize: 10
        },
      };

      const data = cache.readQuery({ ...query });
      data.postsPage = data.postsPage.filter(post => post._id != this.postId)
      cache.writeQuery({ ...query, data })
    }
  })
  // redirect
  this.$router.push({ name: 'IndexPosts' })
}

The above works, but since I'm not doing an optimisticResponse, there's a bit of a delay between the time the index page shows and the time the cache update takes place. How can I solve this? I was trying to do an optimisticResponse but I don't know how to get the list of paginated posts without doing another query.

Answer 1

this.$apollo.mutate(...) returns a promise.

Try something like:

this.$apollo.mutate(...)
  .then(({ data: { deletePost } }) => {
    this.$router.push({ name: 'IndexPosts' })
  })