snapshot of https://github.com/TanStack/query.git (main, 2026-09-16; blobs > 131072B omitted)

integrations/react-next-14/app/client-component.tsx

@@ -0,0 +1,24 @@
+'use client'
+
+import React from 'react'
+import { useQuery } from '@tanstack/react-query'
+
+export function ClientComponent() {
+  const query = useQuery({
+    queryKey: ['test'],
+    queryFn: async () => {
+      await new Promise((r) => setTimeout(r, 1000))
+      return 'Success'
+    },
+  })
+
+  if (query.isPending) {
+    return <div>Loading...</div>
+  }
+
+  if (query.isError) {
+    return <div>An error has occurred!</div>
+  }
+
+  return <div>{query.data}</div>
+}

integrations/react-next-14/app/layout.tsx

@@ -0,0 +1,22 @@
+import React from 'react'
+import Providers from './providers'
+import type { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  title: 'Create Next App',
+  description: 'Generated by create next app',
+}
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <html lang="en">
+      <body>
+        <Providers>{children}</Providers>
+      </body>
+    </html>
+  )
+}

integrations/react-next-14/app/page.tsx

@@ -0,0 +1,16 @@
+import React from 'react'
+import { queryOptions } from '@tanstack/react-query'
+import { ClientComponent } from './client-component'
+
+const options = queryOptions({
+  queryKey: ['foo'],
+})
+
+export default function Home() {
+  return (
+    <main>
+      <ClientComponent />
+      Key: {JSON.stringify(options.queryKey)}
+    </main>
+  )
+}

integrations/react-next-14/app/providers.tsx

@@ -0,0 +1,15 @@
+'use client'
+import * as React from 'react'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
+
+export default function Providers({ children }: { children: React.ReactNode }) {
+  const [queryClient] = React.useState(() => new QueryClient())
+
+  return (
+    <QueryClientProvider client={queryClient}>
+      {children}
+      <ReactQueryDevtools />
+    </QueryClientProvider>
+  )
+}