Request for error handling ideas for useSuspenseQuery

[rostero1]

I'm trying out useSuspenseQuery again. It's working great for my needs with tanstack router, but I'm stuck on ways to handle errors. Imagine an app where there are filters on top and a table below.

I'm using gcTime and staleTime of 0 on the queries for testing. I'm trying to emulate a user stepping away from their computer longer than the gcTime/staleTime and then hitting the next page button. Imagine filters on top and a data grid on bottom. I don't want the unapplied form filters on top being wiped out due to the pendingComponent loading.

With useSusepenseQuery I can use useDeferredValue and allow the user to paginate the results without getting the loader from the pendingComponent (or suspense boundary at the router). This works great, but if react-query later throws an error that is caught by the error boundary then going back to a previous page (or retrying the query) will cause the pendingComponent to render. I don't understand why this is happening. It's causing me to use Suspensive and wrap the query in Suspense so that I can apply a fallback to just that data grid. Demo: https://stackblitz.com/edit/tanstack-query-lylivdmd?file=src%2Findex.tsx&preset=node

Is there some other approach I could be taking? I thought about having react-query's queryFn handle errors and instead return { type: 'success', data: Data } | { type: 'error', error: Error }, but I don't understand what I'm giving up besides the retry (which I don't use).