rustclan•2y ago

trpc auto refreshes page when I lose focus

Hi, i thought this was a development environment only configuration, but it does it even in production. How am I able to change this functionality?

3 Replies

Nick•2y ago

It's a react query setting, can be changed globally in the QueryClient Worth exploring the docs for that, it's 1 key, but there are several in the same vein

Nick•2y ago

https://tanstack.com/query/v4/docs/react/reference/QueryClient#:~:text=%7D-,Options,-The%20options%20for%20fetchQuery

QueryClient | TanStack Query Docs

QueryClient The QueryClient can be used to interact with a cache:

rustclanOP•2y ago

Hi. Thank you 🙂 I have found refetchOnWindowFocus which is what I am looking for. Here is my fix for any future people.

export const api = createTRPCNext<AppRouter>({
  config() {
    return {
      transformer: superjson,
      queryClientConfig: {
        defaultOptions: {
          queries: {
            refetchOnWindowFocus: false,
          },
        },
      },

export const api = createTRPCNext<AppRouter>({
  config() {
    return {
      transformer: superjson,
      queryClientConfig: {
        defaultOptions: {
          queries: {
            refetchOnWindowFocus: false,
          },
        },
      },

https://tanstack.com/query/v4/docs/react/guides/window-focus-refetching