Feature request: Add some way to reset queries when initialData changes

[icopp]

Currently, we can use refetchOnMount: "always" to simplify short-interval polling by immediately refetching on rendering the same view again. But, this still leaves out the use case of being able to easily use new initialData that's been supplied from server-side rendering. This means that when navigating between views using useQuery for polling, there can be a delay before new data is loaded.

A possible workaround could look like (not 100% sure if this actually works as-is):

const initialData; // this is passed in from the server

useEffect(() => {
  queryClient.resetQueries({
    queryKey: ['query-name-here'],
  });
}, [initialData]);

const query = useQuery({
  queryKey: ['query-name-here'],
  async queryFn() {
    // ...
  },
  initialData,
  refetchInterval: 1000,
})

The desired behavior could be something more like:

const initialData; // this is passed in from the server

const query = useQuery({
  queryKey: ['query-name-here'],
  async queryFn() {
    // ...
  },
  initialData,
  refetchInterval: 1000,
  resetOnNewInitialData: true,
})

Alternately, if the way it works doesn't make it convenient to track existing initialData, there could be a resetOnMount option that would generally cover the same use case (that is, falling back to initialData on navigation away from and then back to a view).

const initialData; // this is passed in from the server

const query = useQuery({
  queryKey: ['query-name-here'],
  async queryFn() {
    // ...
  },
  initialData,
  refetchInterval: 1000,
  resetOnMount: "always", // identical semantics to refetchOnMount
})

[TkDodo]

But, this still leaves out the use case of being able to easily use new initialData that's been supplied from server-side rendering

I think this is why we have the hydration API (<HydrationBoundary>)