Keep queries on hold before flush all paused mutations

[erickjth]

Hello guys,

I am facing an interesting issue with paused mutations when running offline and have optimistic updates. Mutations run independently, and can be different or the same. In my case adding, editing, deleting records in a feed, all offline. Editing and Deleting in particular invalidate the query to fetch the feed list.

onSettled: (data, error, variables, context) => {
	if (context && !isCancelledError(error)) {
		queryClient.invalidateQueries(
			feed.lists(context.listId)
		);
	}
},

Once gets online, the app runs mutations run sequentially, but the invalidations run as soon as the onSettled is reached, so I have this scenario (all in offline, then online): offline -> edit record 2, delete record 1 -> online -> run paused mutations. Where both run the same code onSettled I posted above, sometimes the API throws an exception because the delete is slower than editing and once the editing is finished the app tries to get a fresh list and, in the middle, the deleting element is completed, then the pagination internally breaks due to not found.

I wondering how can I run all onSettled after running all mutations. I tried setting await queryClient.invalidateQueries( but that does not block the next mutation.

Thanks in advance.

[TkDodo]

You'd need to make sure that invalidation is not running while mutations are still running. There are some approaches to get that done here: #2245 (comment)

[erickjth]

Makes totally sense. Thanks!