diff --git a/examples/react/router-monorepo-react-query/.gitignore b/examples/react/router-monorepo-react-query/.gitignore index 5af585aeb2..e5cc582a45 100644 --- a/examples/react/router-monorepo-react-query/.gitignore +++ b/examples/react/router-monorepo-react-query/.gitignore @@ -3,6 +3,7 @@ node_modules dist dist-ssr *.local +*.js /test-results/ /playwright-report/ diff --git a/examples/react/router-monorepo-react-query/packages/post-query/src/index.js b/examples/react/router-monorepo-react-query/packages/post-query/src/index.js deleted file mode 100644 index 3adf336fea..0000000000 --- a/examples/react/router-monorepo-react-query/packages/post-query/src/index.js +++ /dev/null @@ -1,3 +0,0 @@ -export * from './postQueryOptions' -export * from './postsQueryOptions' -export { PostNotFoundError } from './posts' diff --git a/examples/react/router-monorepo-react-query/packages/post-query/src/postQueryOptions.js b/examples/react/router-monorepo-react-query/packages/post-query/src/postQueryOptions.js deleted file mode 100644 index 18e767a356..0000000000 --- a/examples/react/router-monorepo-react-query/packages/post-query/src/postQueryOptions.js +++ /dev/null @@ -1,7 +0,0 @@ -import { queryOptions } from '@tanstack/react-query' -import { fetchPost } from './posts' -export const postQueryOptions = (postId) => - queryOptions({ - queryKey: ['posts', { postId }], - queryFn: () => fetchPost(postId), - }) diff --git a/examples/react/router-monorepo-react-query/packages/post-query/src/posts.js b/examples/react/router-monorepo-react-query/packages/post-query/src/posts.js deleted file mode 100644 index 93bca848b2..0000000000 --- a/examples/react/router-monorepo-react-query/packages/post-query/src/posts.js +++ /dev/null @@ -1,23 +0,0 @@ -import axios from 'redaxios' -export class PostNotFoundError extends Error {} -export const fetchPost = async (postId) => { - console.info(`Fetching post with id ${postId}...`) - await new Promise((r) => setTimeout(r, 500)) - const post = await axios - .get(`https://jsonplaceholder.typicode.com/posts/${postId}`) - .then((r) => r.data) - .catch((err) => { - if (err.status === 404) { - throw new PostNotFoundError(`Post with id "${postId}" not found!`) - } - throw err - }) - return post -} -export const fetchPosts = async () => { - console.info('Fetching posts...') - await new Promise((r) => setTimeout(r, 500)) - return axios - .get('https://jsonplaceholder.typicode.com/posts') - .then((r) => r.data.slice(0, 10)) -} diff --git a/examples/react/router-monorepo-react-query/packages/post-query/src/postsQueryOptions.js b/examples/react/router-monorepo-react-query/packages/post-query/src/postsQueryOptions.js deleted file mode 100644 index e79b53138b..0000000000 --- a/examples/react/router-monorepo-react-query/packages/post-query/src/postsQueryOptions.js +++ /dev/null @@ -1,6 +0,0 @@ -import { queryOptions } from '@tanstack/react-query' -import { fetchPosts } from './posts' -export const postsQueryOptions = queryOptions({ - queryKey: ['posts'], - queryFn: () => fetchPosts(), -}) diff --git a/examples/react/router-monorepo-react-query/packages/post-query/vite.config.js b/examples/react/router-monorepo-react-query/packages/post-query/vite.config.js deleted file mode 100644 index acf16e00b3..0000000000 --- a/examples/react/router-monorepo-react-query/packages/post-query/vite.config.js +++ /dev/null @@ -1,39 +0,0 @@ -import { defineConfig } from 'vite' -import dts from 'vite-plugin-dts' -import * as path from 'node:path' -import { fileURLToPath } from 'node:url' -const __filename = fileURLToPath(import.meta.url) -const __dirname = path.dirname(__filename) -export default defineConfig({ - root: __dirname, - cacheDir: '../../node_modules/.vite/packages/router', - plugins: [ - dts({ - entryRoot: 'src', - tsconfigPath: path.join(__dirname, 'tsconfig.json'), - }), - ], - build: { - outDir: './dist', - emptyOutDir: true, - commonjsOptions: { - transformMixedEsModules: true, - }, - lib: { - entry: 'src/index.ts', - name: 'router', - fileName: 'index', - formats: ['es'], - }, - rollupOptions: { - // External packages that should not be bundled into your library. - external: [ - 'react', - 'react-dom', - 'react/jsx-runtime', - '@tanstack/react-query', - 'redaxios', - ], - }, - }, -}) diff --git a/examples/react/router-monorepo-react-query/packages/router/src/index.js b/examples/react/router-monorepo-react-query/packages/router/src/index.js deleted file mode 100644 index 9d5d5e5c05..0000000000 --- a/examples/react/router-monorepo-react-query/packages/router/src/index.js +++ /dev/null @@ -1,13 +0,0 @@ -import { queryClient, router } from './router' -export { router, queryClient } -// By re exporting the api from TanStack router, we can enforce that other packages -// rely on this one instead, making the type register being applied -export { - Outlet, - Link, - useRouteContext, - useRouter, - RouterProvider, - getRouteApi, - ErrorComponent, -} from '@tanstack/react-router' diff --git a/examples/react/router-monorepo-react-query/packages/router/src/routeTree.gen.js b/examples/react/router-monorepo-react-query/packages/router/src/routeTree.gen.js deleted file mode 100644 index b54803ece3..0000000000 --- a/examples/react/router-monorepo-react-query/packages/router/src/routeTree.gen.js +++ /dev/null @@ -1,47 +0,0 @@ -/* prettier-ignore-start */ -/* eslint-disable */ -// @ts-nocheck -// noinspection JSUnusedGlobalSymbols -// This file is auto-generated by TanStack Router -// Import Routes -import { Route as rootRoute } from './routes/__root' -import { Route as PostIdImport } from './routes/$postId' -import { Route as IndexImport } from './routes/index' -// Create/Update Routes -const PostIdRoute = PostIdImport.update({ - id: '/$postId', - path: '/$postId', - getParentRoute: () => rootRoute, -}) -const IndexRoute = IndexImport.update({ - id: '/', - path: '/', - getParentRoute: () => rootRoute, -}) -const rootRouteChildren = { - IndexRoute: IndexRoute, - PostIdRoute: PostIdRoute, -} -export const routeTree = rootRoute - ._addFileChildren(rootRouteChildren) - ._addFileTypes() -/* prettier-ignore-end */ -/* ROUTE_MANIFEST_START -{ - "routes": { - "__root__": { - "filePath": "__root.tsx", - "children": [ - "/", - "/$postId" - ] - }, - "/": { - "filePath": "index.ts" - }, - "/$postId": { - "filePath": "$postId.ts" - } - } -} -ROUTE_MANIFEST_END */ diff --git a/examples/react/router-monorepo-react-query/packages/router/src/router.js b/examples/react/router-monorepo-react-query/packages/router/src/router.js deleted file mode 100644 index ec38b0238d..0000000000 --- a/examples/react/router-monorepo-react-query/packages/router/src/router.js +++ /dev/null @@ -1,21 +0,0 @@ -import { jsx as _jsx } from 'react/jsx-runtime' -import { createRouter } from '@tanstack/react-router' -// Import the generated route tree -import { QueryClient } from '@tanstack/react-query' -import { routeTree } from './routeTree.gen' -export const queryClient = new QueryClient() -// Set up a Router instance -export const router = createRouter({ - routeTree, - context: { - queryClient, - }, - defaultPendingComponent: () => - _jsx('div', { children: 'Loading form global pending component...' }), - // This make the loader only wait 200ms before showing the pending component, instead of the default 1000ms - defaultPendingMs: 200, - defaultPreload: 'intent', - // Since we're using React Query, we don't want loader calls to ever be stale - // This will ensure that the loader is always called when the route is preloaded or visited - defaultPreloadStaleTime: 0, -}) diff --git a/examples/react/router-monorepo-react-query/packages/router/src/routes/$postId.js b/examples/react/router-monorepo-react-query/packages/router/src/routes/$postId.js deleted file mode 100644 index 520a05e945..0000000000 --- a/examples/react/router-monorepo-react-query/packages/router/src/routes/$postId.js +++ /dev/null @@ -1,7 +0,0 @@ -import { createFileRoute } from '@tanstack/react-router' -import { postQueryOptions } from '@router-mono-react-query/post-query' -export const Route = createFileRoute('/$postId')({ - loader: ({ context: { queryClient }, params: { postId } }) => { - return queryClient.ensureQueryData(postQueryOptions(postId)) - }, -}) diff --git a/examples/react/router-monorepo-react-query/packages/router/src/routes/__root.js b/examples/react/router-monorepo-react-query/packages/router/src/routes/__root.js deleted file mode 100644 index 6d0b7e71c4..0000000000 --- a/examples/react/router-monorepo-react-query/packages/router/src/routes/__root.js +++ /dev/null @@ -1,14 +0,0 @@ -import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime' -import { Link, createRootRouteWithContext } from '@tanstack/react-router' -export const Route = createRootRouteWithContext()({ - notFoundComponent: () => { - return _jsxs('div', { - children: [ - _jsx('p', { - children: 'This is the notFoundComponent configured on root route', - }), - _jsx(Link, { to: '/', children: 'Start Over' }), - ], - }) - }, -}) diff --git a/examples/react/router-monorepo-react-query/packages/router/src/routes/index.js b/examples/react/router-monorepo-react-query/packages/router/src/routes/index.js deleted file mode 100644 index 3a9d837f7d..0000000000 --- a/examples/react/router-monorepo-react-query/packages/router/src/routes/index.js +++ /dev/null @@ -1,7 +0,0 @@ -import { createFileRoute } from '@tanstack/react-router' -import { postsQueryOptions } from '@router-mono-react-query/post-query' -export const Route = createFileRoute('/')({ - loader: ({ context: { queryClient } }) => { - return queryClient.ensureQueryData(postsQueryOptions) - }, -}) diff --git a/examples/react/router-monorepo-react-query/packages/router/vite.config.js b/examples/react/router-monorepo-react-query/packages/router/vite.config.js deleted file mode 100644 index 64757aaa9d..0000000000 --- a/examples/react/router-monorepo-react-query/packages/router/vite.config.js +++ /dev/null @@ -1,44 +0,0 @@ -import { defineConfig } from 'vite' -import dts from 'vite-plugin-dts' -import * as path from 'node:path' -import { fileURLToPath } from 'node:url' -import { TanStackRouterVite } from '@tanstack/router-plugin/vite' -import react from '@vitejs/plugin-react' -const __filename = fileURLToPath(import.meta.url) -const __dirname = path.dirname(__filename) -export default defineConfig({ - root: __dirname, - cacheDir: '../../node_modules/.vite/packages/router', - plugins: [ - dts({ - entryRoot: 'src', - tsconfigPath: path.join(__dirname, 'tsconfig.json'), - }), - react(), - TanStackRouterVite(), - ], - build: { - outDir: './dist', - emptyOutDir: true, - commonjsOptions: { - transformMixedEsModules: true, - }, - lib: { - entry: 'src/index.ts', - name: 'router', - fileName: 'index', - formats: ['es'], - }, - rollupOptions: { - // External packages that should not be bundled into your library. - external: [ - 'react', - 'react-dom', - 'react/jsx-runtime', - '@tanstack/react-query', - '@tanstack/react-router', - '@router-mono-react-query/post-query', - ], - }, - }, -}) diff --git a/examples/react/router-monorepo-simple/.gitignore b/examples/react/router-monorepo-simple/.gitignore index 34b66dd416..e5756dfdf1 100644 --- a/examples/react/router-monorepo-simple/.gitignore +++ b/examples/react/router-monorepo-simple/.gitignore @@ -3,6 +3,7 @@ node_modules dist dist-ssr *.local +*.js /test-results/ /playwright-report/ diff --git a/examples/react/router-monorepo-simple/packages/router/src/fetch/posts.js b/examples/react/router-monorepo-simple/packages/router/src/fetch/posts.js deleted file mode 100644 index 93bca848b2..0000000000 --- a/examples/react/router-monorepo-simple/packages/router/src/fetch/posts.js +++ /dev/null @@ -1,23 +0,0 @@ -import axios from 'redaxios' -export class PostNotFoundError extends Error {} -export const fetchPost = async (postId) => { - console.info(`Fetching post with id ${postId}...`) - await new Promise((r) => setTimeout(r, 500)) - const post = await axios - .get(`https://jsonplaceholder.typicode.com/posts/${postId}`) - .then((r) => r.data) - .catch((err) => { - if (err.status === 404) { - throw new PostNotFoundError(`Post with id "${postId}" not found!`) - } - throw err - }) - return post -} -export const fetchPosts = async () => { - console.info('Fetching posts...') - await new Promise((r) => setTimeout(r, 500)) - return axios - .get('https://jsonplaceholder.typicode.com/posts') - .then((r) => r.data.slice(0, 10)) -} diff --git a/examples/react/router-monorepo-simple/packages/router/src/index.js b/examples/react/router-monorepo-simple/packages/router/src/index.js deleted file mode 100644 index 1efdec77cd..0000000000 --- a/examples/react/router-monorepo-simple/packages/router/src/index.js +++ /dev/null @@ -1,14 +0,0 @@ -import { router } from './router' -export { router } -export { PostNotFoundError } from './fetch/posts' -// By re exporting the api from TanStack router, we can enforce that other packages -// rely on this one instead, making the type register being applied -export { - Outlet, - Link, - useRouteContext, - useRouter, - RouterProvider, - getRouteApi, - ErrorComponent, -} from '@tanstack/react-router' diff --git a/examples/react/router-monorepo-simple/packages/router/src/routeTree.gen.js b/examples/react/router-monorepo-simple/packages/router/src/routeTree.gen.js deleted file mode 100644 index b54803ece3..0000000000 --- a/examples/react/router-monorepo-simple/packages/router/src/routeTree.gen.js +++ /dev/null @@ -1,47 +0,0 @@ -/* prettier-ignore-start */ -/* eslint-disable */ -// @ts-nocheck -// noinspection JSUnusedGlobalSymbols -// This file is auto-generated by TanStack Router -// Import Routes -import { Route as rootRoute } from './routes/__root' -import { Route as PostIdImport } from './routes/$postId' -import { Route as IndexImport } from './routes/index' -// Create/Update Routes -const PostIdRoute = PostIdImport.update({ - id: '/$postId', - path: '/$postId', - getParentRoute: () => rootRoute, -}) -const IndexRoute = IndexImport.update({ - id: '/', - path: '/', - getParentRoute: () => rootRoute, -}) -const rootRouteChildren = { - IndexRoute: IndexRoute, - PostIdRoute: PostIdRoute, -} -export const routeTree = rootRoute - ._addFileChildren(rootRouteChildren) - ._addFileTypes() -/* prettier-ignore-end */ -/* ROUTE_MANIFEST_START -{ - "routes": { - "__root__": { - "filePath": "__root.tsx", - "children": [ - "/", - "/$postId" - ] - }, - "/": { - "filePath": "index.ts" - }, - "/$postId": { - "filePath": "$postId.ts" - } - } -} -ROUTE_MANIFEST_END */ diff --git a/examples/react/router-monorepo-simple/packages/router/src/router.js b/examples/react/router-monorepo-simple/packages/router/src/router.js deleted file mode 100644 index 72b54ea85f..0000000000 --- a/examples/react/router-monorepo-simple/packages/router/src/router.js +++ /dev/null @@ -1,10 +0,0 @@ -import { jsx as _jsx } from 'react/jsx-runtime' -import { createRouter } from '@tanstack/react-router' -// Import the generated route tree -import { routeTree } from './routeTree.gen' -// Set up a Router instance -export const router = createRouter({ - routeTree, - defaultPendingComponent: () => - _jsx('div', { children: 'Loading form global pending component...' }), -}) diff --git a/examples/react/router-monorepo-simple/packages/router/src/routes/$postId.js b/examples/react/router-monorepo-simple/packages/router/src/routes/$postId.js deleted file mode 100644 index 9edafbeff7..0000000000 --- a/examples/react/router-monorepo-simple/packages/router/src/routes/$postId.js +++ /dev/null @@ -1,5 +0,0 @@ -import { createFileRoute } from '@tanstack/react-router' -import { fetchPost } from '../fetch/posts' -export const Route = createFileRoute('/$postId')({ - loader: ({ params }) => fetchPost(params.postId), -}) diff --git a/examples/react/router-monorepo-simple/packages/router/src/routes/__root.js b/examples/react/router-monorepo-simple/packages/router/src/routes/__root.js deleted file mode 100644 index 0676db8a44..0000000000 --- a/examples/react/router-monorepo-simple/packages/router/src/routes/__root.js +++ /dev/null @@ -1,14 +0,0 @@ -import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime' -import { Link, createRootRoute } from '@tanstack/react-router' -export const Route = createRootRoute({ - notFoundComponent: () => { - return _jsxs('div', { - children: [ - _jsx('p', { - children: 'This is the notFoundComponent configured on root route', - }), - _jsx(Link, { to: '/', children: 'Start Over' }), - ], - }) - }, -}) diff --git a/examples/react/router-monorepo-simple/packages/router/src/routes/index.js b/examples/react/router-monorepo-simple/packages/router/src/routes/index.js deleted file mode 100644 index 1d6cab46b7..0000000000 --- a/examples/react/router-monorepo-simple/packages/router/src/routes/index.js +++ /dev/null @@ -1,7 +0,0 @@ -import { createFileRoute } from '@tanstack/react-router' -import { fetchPosts } from '../fetch/posts' -export const Route = createFileRoute('/')({ - loader: () => { - return fetchPosts() - }, -}) diff --git a/examples/react/router-monorepo-simple/packages/router/vite.config.js b/examples/react/router-monorepo-simple/packages/router/vite.config.js deleted file mode 100644 index 285e67482e..0000000000 --- a/examples/react/router-monorepo-simple/packages/router/vite.config.js +++ /dev/null @@ -1,40 +0,0 @@ -import { defineConfig } from 'vite' -import dts from 'vite-plugin-dts' -import * as path from 'node:path' -import { fileURLToPath } from 'node:url' -import { TanStackRouterVite } from '@tanstack/router-plugin/vite' -import react from '@vitejs/plugin-react' -const __filename = fileURLToPath(import.meta.url) -const __dirname = path.dirname(__filename) -export default defineConfig({ - plugins: [ - dts({ - entryRoot: 'src', - tsconfigPath: path.join(__dirname, 'tsconfig.json'), - }), - react(), - TanStackRouterVite(), - ], - build: { - outDir: './dist', - emptyOutDir: true, - commonjsOptions: { - transformMixedEsModules: true, - }, - lib: { - entry: 'src/index.ts', - name: 'router', - fileName: 'index', - formats: ['es'], - }, - rollupOptions: { - // External packages that should not be bundled into your library. - external: [ - 'react', - 'react-dom', - 'react/jsx-runtime', - '@tanstack/react-router', - ], - }, - }, -})