queryClient type errors when adding default options to queryclient

export const TRPCProvider: React.FC<{ children: React.ReactNode }> = ({
  children,
}) => {
  const [queryClient] = React.useState(
    () =>
      new QueryClient({
        defaultOptions: { refetchOnWindowFocus: false, staleTime: 120000 },
      })
  )
  const [trpcClient] = React.useState(() =>
    api.createClient({
      transformer,
      links: [
        loggerLink({
          enabled: (opts) =>
            process.env.NODE_ENV === 'development' ||
            (opts.direction === 'down' && opts.result instanceof Error),
        }),
        httpBatchLink({
          url: `${getBaseUrl()}/api/trpc`,
        }),
      ],
    })
  )

  return (
    <api.Provider client={trpcClient} queryClient={queryClient}>
      <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
    </api.Provider>
  )
}

export const TRPCProvider: React.FC<{ children: React.ReactNode }> = ({
  children,
}) => {
  const [queryClient] = React.useState(
    () =>
      new QueryClient({
        defaultOptions: { refetchOnWindowFocus: false, staleTime: 120000 },
      })
  )
  const [trpcClient] = React.useState(() =>
    api.createClient({
      transformer,
      links: [
        loggerLink({
          enabled: (opts) =>
            process.env.NODE_ENV === 'development' ||
            (opts.direction === 'down' && opts.result instanceof Error),
        }),
        httpBatchLink({
          url: `${getBaseUrl()}/api/trpc`,
        }),
      ],
    })
  )

  return (
    <api.Provider client={trpcClient} queryClient={queryClient}>
      <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
    </api.Provider>
  )
}

(property) refetchOnWindowFocus: boolean
Type '{ refetchOnWindowFocus: false; staleTime: number; }' is not assignable to type 'DefaultOptions<unknown>'.
  Object literal may only specify known properties, and 'refetchOnWindowFocus' does not exist in type 'DefaultOptions<unknown>'.ts(2322)

(property) refetchOnWindowFocus: boolean
Type '{ refetchOnWindowFocus: false; staleTime: number; }' is not assignable to type 'DefaultOptions<unknown>'.
  Object literal may only specify known properties, and 'refetchOnWindowFocus' does not exist in type 'DefaultOptions<unknown>'.ts(2322)