diff --git a/docs/config.json b/docs/config.json index 60cf48e8fe..d47c5bbb44 100644 --- a/docs/config.json +++ b/docs/config.json @@ -903,7 +903,7 @@ }, { "label": "Basic", - "to": "framework/solid/examples/basic-typescript" + "to": "framework/solid/examples/basic" }, { "label": "Basic w/ GraphQL-Request", diff --git a/examples/angular/infinite-query-with-max-pages/package.json b/examples/angular/infinite-query-with-max-pages/package.json index e47053a1ff..ac01ceb91b 100644 --- a/examples/angular/infinite-query-with-max-pages/package.json +++ b/examples/angular/infinite-query-with-max-pages/package.json @@ -1,13 +1,13 @@ { "name": "@tanstack/query-example-angular-infinite-query-with-max-pages", - "version": "0.0.0", + "private": true, + "type": "module", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "watch": "ng build --watch --configuration development" }, - "private": true, "dependencies": { "@angular/common": "^17.3.10", "@angular/compiler": "^17.3.10", diff --git a/examples/react/auto-refetching/next-env.d.ts b/examples/react/auto-refetching/next-env.d.ts new file mode 100644 index 0000000000..4f11a03dc6 --- /dev/null +++ b/examples/react/auto-refetching/next-env.d.ts @@ -0,0 +1,5 @@ +/// +/// + +// NOTE: This file should not be edited +// see https://nextjs.org/docs/basic-features/typescript for more information. diff --git a/examples/react/auto-refetching/next.config.js b/examples/react/auto-refetching/next.config.js index 4fd508c5f4..033754658c 100644 --- a/examples/react/auto-refetching/next.config.js +++ b/examples/react/auto-refetching/next.config.js @@ -5,6 +5,9 @@ const nextConfig = { eslint: { ignoreDuringBuilds: true, }, + typescript: { + ignoreBuildErrors: true, + }, } export default nextConfig diff --git a/examples/react/auto-refetching/package.json b/examples/react/auto-refetching/package.json index 3ec3ef35e0..3474926d4f 100644 --- a/examples/react/auto-refetching/package.json +++ b/examples/react/auto-refetching/package.json @@ -10,9 +10,13 @@ "dependencies": { "@tanstack/react-query": "^5.50.1", "@tanstack/react-query-devtools": "^5.50.1", - "isomorphic-unfetch": "4.0.2", "next": "^14.2.4", "react": "^18.2.0", "react-dom": "^18.2.0" + }, + "devDependencies": { + "@types/react": "^18.2.79", + "@types/react-dom": "^18.2.25", + "typescript": "5.3.3" } } diff --git a/examples/react/auto-refetching/src/pages/api/data.js b/examples/react/auto-refetching/src/pages/api/data.ts similarity index 67% rename from examples/react/auto-refetching/src/pages/api/data.js rename to examples/react/auto-refetching/src/pages/api/data.ts index 9c0cb35897..57faeb3916 100644 --- a/examples/react/auto-refetching/src/pages/api/data.js +++ b/examples/react/auto-refetching/src/pages/api/data.ts @@ -1,7 +1,12 @@ +import type { NextApiRequest, NextApiResponse } from 'next' + // an simple endpoint for getting current list let list = ['Item 1', 'Item 2', 'Item 3'] -export default async (req, res) => { +export default async ( + req: NextApiRequest, + res: NextApiResponse, +) => { if (req.query.add) { if (!list.includes(req.query.add)) { list.push(req.query.add) diff --git a/examples/react/auto-refetching/src/pages/index.js b/examples/react/auto-refetching/src/pages/index.tsx similarity index 93% rename from examples/react/auto-refetching/src/pages/index.js rename to examples/react/auto-refetching/src/pages/index.tsx index ace9bc343a..470a6e78fa 100644 --- a/examples/react/auto-refetching/src/pages/index.js +++ b/examples/react/auto-refetching/src/pages/index.tsx @@ -1,13 +1,11 @@ import React from 'react' -// - import { - useQuery, - useQueryClient, - useMutation, QueryClient, QueryClientProvider, + useMutation, + useQuery, + useQueryClient, } from '@tanstack/react-query' import { ReactQueryDevtools } from '@tanstack/react-query-devtools' @@ -28,7 +26,7 @@ function Example() { const { status, data, error, isFetching } = useQuery({ queryKey: ['todos'], - queryFn: async () => { + queryFn: async (): Promise> => { const response = await fetch('/api/data') return await response.json() }, @@ -37,7 +35,7 @@ function Example() { }) const addMutation = useMutation({ - mutationFn: (add) => fetch(`/api/data?add=${add}`), + mutationFn: (add: string) => fetch(`/api/data?add=${add}`), onSuccess: () => queryClient.invalidateQueries({ queryKey: ['todos'] }), }) @@ -51,7 +49,7 @@ function Example() { return (
-

Auto Refetch with stale-time set to 1s)

+

Auto Refetch with stale-time set to {intervalMs}ms

This example is best experienced on your own machine, where you can open multiple tabs to the same localhost server and see your changes diff --git a/examples/react/auto-refetching/tsconfig.json b/examples/react/auto-refetching/tsconfig.json new file mode 100644 index 0000000000..9575d0eab5 --- /dev/null +++ b/examples/react/auto-refetching/tsconfig.json @@ -0,0 +1,19 @@ +{ + "compilerOptions": { + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": true, + "forceConsistentCasingInFileNames": true, + "noEmit": true, + "esModuleInterop": true, + "module": "esnext", + "moduleResolution": "Bundler", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "preserve", + "incremental": true + }, + "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], + "exclude": ["node_modules"] +} diff --git a/examples/react/infinite-query-with-max-pages/next-env.d.ts b/examples/react/infinite-query-with-max-pages/next-env.d.ts new file mode 100644 index 0000000000..4f11a03dc6 --- /dev/null +++ b/examples/react/infinite-query-with-max-pages/next-env.d.ts @@ -0,0 +1,5 @@ +/// +/// + +// NOTE: This file should not be edited +// see https://nextjs.org/docs/basic-features/typescript for more information. diff --git a/examples/react/infinite-query-with-max-pages/next.config.js b/examples/react/infinite-query-with-max-pages/next.config.js index 4fd508c5f4..033754658c 100644 --- a/examples/react/infinite-query-with-max-pages/next.config.js +++ b/examples/react/infinite-query-with-max-pages/next.config.js @@ -5,6 +5,9 @@ const nextConfig = { eslint: { ignoreDuringBuilds: true, }, + typescript: { + ignoreBuildErrors: true, + }, } export default nextConfig diff --git a/examples/react/infinite-query-with-max-pages/package.json b/examples/react/infinite-query-with-max-pages/package.json index 636bb35bd0..0da6802a24 100644 --- a/examples/react/infinite-query-with-max-pages/package.json +++ b/examples/react/infinite-query-with-max-pages/package.json @@ -10,10 +10,13 @@ "dependencies": { "@tanstack/react-query": "^5.50.1", "@tanstack/react-query-devtools": "^5.50.1", - "isomorphic-unfetch": "4.0.2", "next": "^14.2.4", "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-intersection-observer": "^8.34.0" + "react-dom": "^18.2.0" + }, + "devDependencies": { + "@types/react": "^18.2.79", + "@types/react-dom": "^18.2.25", + "typescript": "5.3.3" } } diff --git a/examples/react/infinite-query-with-max-pages/src/pages/api/projects.js b/examples/react/infinite-query-with-max-pages/src/pages/api/projects.ts similarity index 78% rename from examples/react/infinite-query-with-max-pages/src/pages/api/projects.js rename to examples/react/infinite-query-with-max-pages/src/pages/api/projects.ts index a13fbee1aa..29b5228484 100644 --- a/examples/react/infinite-query-with-max-pages/src/pages/api/projects.js +++ b/examples/react/infinite-query-with-max-pages/src/pages/api/projects.ts @@ -1,5 +1,6 @@ -// an endpoint for getting projects data -export default (req, res) => { +import type { NextApiRequest, NextApiResponse } from 'next' + +export default (req: NextApiRequest, res: NextApiResponse) => { const cursor = parseInt(req.query.cursor) || 0 const pageSize = 4 diff --git a/examples/react/infinite-query-with-max-pages/src/pages/index.js b/examples/react/infinite-query-with-max-pages/src/pages/index.tsx similarity index 100% rename from examples/react/infinite-query-with-max-pages/src/pages/index.js rename to examples/react/infinite-query-with-max-pages/src/pages/index.tsx index 8df4c0e8d9..29fac3d44a 100644 --- a/examples/react/infinite-query-with-max-pages/src/pages/index.js +++ b/examples/react/infinite-query-with-max-pages/src/pages/index.tsx @@ -1,8 +1,8 @@ import React from 'react' import { - useInfiniteQuery, QueryClient, QueryClientProvider, + useInfiniteQuery, } from '@tanstack/react-query' import { ReactQueryDevtools } from '@tanstack/react-query-devtools' diff --git a/examples/react/infinite-query-with-max-pages/tsconfig.json b/examples/react/infinite-query-with-max-pages/tsconfig.json new file mode 100644 index 0000000000..9575d0eab5 --- /dev/null +++ b/examples/react/infinite-query-with-max-pages/tsconfig.json @@ -0,0 +1,19 @@ +{ + "compilerOptions": { + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": true, + "forceConsistentCasingInFileNames": true, + "noEmit": true, + "esModuleInterop": true, + "module": "esnext", + "moduleResolution": "Bundler", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "preserve", + "incremental": true + }, + "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], + "exclude": ["node_modules"] +} diff --git a/examples/react/load-more-infinite-scroll/next-env.d.ts b/examples/react/load-more-infinite-scroll/next-env.d.ts new file mode 100644 index 0000000000..4f11a03dc6 --- /dev/null +++ b/examples/react/load-more-infinite-scroll/next-env.d.ts @@ -0,0 +1,5 @@ +/// +/// + +// NOTE: This file should not be edited +// see https://nextjs.org/docs/basic-features/typescript for more information. diff --git a/examples/react/load-more-infinite-scroll/next.config.js b/examples/react/load-more-infinite-scroll/next.config.js index 4fd508c5f4..033754658c 100644 --- a/examples/react/load-more-infinite-scroll/next.config.js +++ b/examples/react/load-more-infinite-scroll/next.config.js @@ -5,6 +5,9 @@ const nextConfig = { eslint: { ignoreDuringBuilds: true, }, + typescript: { + ignoreBuildErrors: true, + }, } export default nextConfig diff --git a/examples/react/load-more-infinite-scroll/package.json b/examples/react/load-more-infinite-scroll/package.json index c35c1f54b9..219c55b20e 100644 --- a/examples/react/load-more-infinite-scroll/package.json +++ b/examples/react/load-more-infinite-scroll/package.json @@ -10,10 +10,14 @@ "dependencies": { "@tanstack/react-query": "^5.50.1", "@tanstack/react-query-devtools": "^5.50.1", - "isomorphic-unfetch": "4.0.2", "next": "^14.2.4", "react": "^18.2.0", "react-dom": "^18.2.0", "react-intersection-observer": "^8.34.0" + }, + "devDependencies": { + "@types/react": "^18.2.79", + "@types/react-dom": "^18.2.25", + "typescript": "5.3.3" } } diff --git a/examples/react/load-more-infinite-scroll/src/pages/about.js b/examples/react/load-more-infinite-scroll/src/pages/about.tsx similarity index 100% rename from examples/react/load-more-infinite-scroll/src/pages/about.js rename to examples/react/load-more-infinite-scroll/src/pages/about.tsx diff --git a/examples/react/load-more-infinite-scroll/src/pages/api/projects.js b/examples/react/load-more-infinite-scroll/src/pages/api/projects.ts similarity index 78% rename from examples/react/load-more-infinite-scroll/src/pages/api/projects.js rename to examples/react/load-more-infinite-scroll/src/pages/api/projects.ts index 03492c0a15..493a453a96 100644 --- a/examples/react/load-more-infinite-scroll/src/pages/api/projects.js +++ b/examples/react/load-more-infinite-scroll/src/pages/api/projects.ts @@ -1,5 +1,6 @@ -// an endpoint for getting projects data -export default (req, res) => { +import type { NextApiRequest, NextApiResponse } from 'next' + +export default (req: NextApiRequest, res: NextApiResponse) => { const cursor = parseInt(req.query.cursor) || 0 const pageSize = 5 diff --git a/examples/react/load-more-infinite-scroll/src/pages/index.js b/examples/react/load-more-infinite-scroll/src/pages/index.tsx similarity index 91% rename from examples/react/load-more-infinite-scroll/src/pages/index.js rename to examples/react/load-more-infinite-scroll/src/pages/index.tsx index b3b679be4e..9aa6742d15 100644 --- a/examples/react/load-more-infinite-scroll/src/pages/index.js +++ b/examples/react/load-more-infinite-scroll/src/pages/index.tsx @@ -34,13 +34,19 @@ function Example() { hasPreviousPage, } = useInfiniteQuery({ queryKey: ['projects'], - queryFn: async ({ pageParam }) => { + queryFn: async ({ + pageParam, + }): Promise<{ + data: Array<{ name: string; id: number }> + previousId: number + nextId: number + }> => { const response = await fetch(`/api/projects?cursor=${pageParam}`) return await response.json() }, initialPageParam: 0, - getPreviousPageParam: (firstPage) => firstPage.previousId ?? undefined, - getNextPageParam: (lastPage) => lastPage.nextId ?? undefined, + getPreviousPageParam: (firstPage) => firstPage.previousId, + getNextPageParam: (lastPage) => lastPage.nextId, }) React.useEffect(() => { diff --git a/examples/react/load-more-infinite-scroll/tsconfig.json b/examples/react/load-more-infinite-scroll/tsconfig.json new file mode 100644 index 0000000000..9575d0eab5 --- /dev/null +++ b/examples/react/load-more-infinite-scroll/tsconfig.json @@ -0,0 +1,19 @@ +{ + "compilerOptions": { + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": true, + "forceConsistentCasingInFileNames": true, + "noEmit": true, + "esModuleInterop": true, + "module": "esnext", + "moduleResolution": "Bundler", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "preserve", + "incremental": true + }, + "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], + "exclude": ["node_modules"] +} diff --git a/examples/react/nextjs-app-prefetching/next.config.js b/examples/react/nextjs-app-prefetching/next.config.js index 4fd508c5f4..033754658c 100644 --- a/examples/react/nextjs-app-prefetching/next.config.js +++ b/examples/react/nextjs-app-prefetching/next.config.js @@ -5,6 +5,9 @@ const nextConfig = { eslint: { ignoreDuringBuilds: true, }, + typescript: { + ignoreBuildErrors: true, + }, } export default nextConfig diff --git a/examples/react/nextjs-app-prefetching/package.json b/examples/react/nextjs-app-prefetching/package.json index f3478e4ccb..d71d41a088 100644 --- a/examples/react/nextjs-app-prefetching/package.json +++ b/examples/react/nextjs-app-prefetching/package.json @@ -12,11 +12,10 @@ "@tanstack/react-query": "^5.50.1", "@tanstack/react-query-devtools": "^5.50.1", "next": "^15.0.0-rc.0", - "react": "^19.0.0-rc-4c2e457c7c-20240522", - "react-dom": "^19.0.0-rc-4c2e457c7c-20240522" + "react": "19.0.0-rc-4c2e457c7c-20240522", + "react-dom": "19.0.0-rc-4c2e457c7c-20240522" }, "devDependencies": { - "@types/node": "^20.12.12", "@types/react": "npm:types-react@rc", "@types/react-dom": "npm:types-react-dom@rc", "typescript": "5.3.3" diff --git a/examples/react/nextjs-suspense-streaming/next.config.js b/examples/react/nextjs-suspense-streaming/next.config.js index 9b538eb739..591cd313c3 100644 --- a/examples/react/nextjs-suspense-streaming/next.config.js +++ b/examples/react/nextjs-suspense-streaming/next.config.js @@ -5,6 +5,9 @@ const nextConfig = { eslint: { ignoreDuringBuilds: true, }, + typescript: { + ignoreBuildErrors: true, + }, webpack: (config) => { if (config.name === 'server') config.optimization.concatenateModules = false diff --git a/examples/react/nextjs-suspense-streaming/package.json b/examples/react/nextjs-suspense-streaming/package.json index f282f6a039..958f9b4232 100644 --- a/examples/react/nextjs-suspense-streaming/package.json +++ b/examples/react/nextjs-suspense-streaming/package.json @@ -14,11 +14,9 @@ "@tanstack/react-query-next-experimental": "^5.50.1", "next": "^14.2.4", "react": "^18.2.0", - "react-dom": "^18.2.0", - "superjson": "^2.2.1" + "react-dom": "^18.2.0" }, "devDependencies": { - "@types/node": "^20.12.12", "@types/react": "^18.2.79", "typescript": "5.3.3" } diff --git a/examples/react/nextjs/next-env.d.ts b/examples/react/nextjs/next-env.d.ts new file mode 100644 index 0000000000..4f11a03dc6 --- /dev/null +++ b/examples/react/nextjs/next-env.d.ts @@ -0,0 +1,5 @@ +/// +/// + +// NOTE: This file should not be edited +// see https://nextjs.org/docs/basic-features/typescript for more information. diff --git a/examples/react/nextjs/next.config.js b/examples/react/nextjs/next.config.js index 4fd508c5f4..033754658c 100644 --- a/examples/react/nextjs/next.config.js +++ b/examples/react/nextjs/next.config.js @@ -5,6 +5,9 @@ const nextConfig = { eslint: { ignoreDuringBuilds: true, }, + typescript: { + ignoreBuildErrors: true, + }, } export default nextConfig diff --git a/examples/react/nextjs/package.json b/examples/react/nextjs/package.json index 6c40ed726f..4388f88cc1 100644 --- a/examples/react/nextjs/package.json +++ b/examples/react/nextjs/package.json @@ -12,8 +12,11 @@ "@tanstack/react-query-devtools": "^5.50.1", "next": "^14.2.4", "react": "^18.2.0", - "react-dom": "^18.2.0", - "resolve-from": "^5.0.0", - "web-streams-polyfill": "^4.0.0" + "react-dom": "^18.2.0" + }, + "devDependencies": { + "@types/react": "^18.2.79", + "@types/react-dom": "^18.2.25", + "typescript": "5.3.3" } } diff --git a/examples/react/nextjs/src/components/Header/index.js b/examples/react/nextjs/src/components/Header.tsx similarity index 100% rename from examples/react/nextjs/src/components/Header/index.js rename to examples/react/nextjs/src/components/Header.tsx diff --git a/examples/react/nextjs/src/components/InfoBox/index.js b/examples/react/nextjs/src/components/InfoBox.tsx similarity index 83% rename from examples/react/nextjs/src/components/InfoBox/index.js rename to examples/react/nextjs/src/components/InfoBox.tsx index b0ff42f7d3..4bc1ecbbea 100644 --- a/examples/react/nextjs/src/components/InfoBox/index.js +++ b/examples/react/nextjs/src/components/InfoBox.tsx @@ -1,6 +1,6 @@ import React from 'react' -const InfoBox = ({ children }) => ( +const InfoBox = ({ children }: { children: React.ReactNode }) => (