react-query queryClient.invalidateQueries not working when accessing a react-router page directly

Question

I have a page whose URL is like this: http://domain/products/{:productId}. Let me call this page \'Product Details\' page for reference later on.

This page can be acc