The solution of having the QueryClientContextProvider.tsx in a different files works however it comes with one disadvantage. The provider uses the "use client" key word thus if you wrap the entire app inside this provider all you pages are converted to client component. As a result all the benefits of server side rendering are automatically lost. Here is a video how SSR works and when to use the "use client" hook. https://www.youtube.com/watch?v=Qdkg_mrniLk&t=17s