Skip to content

Commit 80e45cc

Browse files
BalastrongKevinVandylachlancollins
authoredJun 29, 2024··
docs(examples): Add example using TanStack Query and Router (#5625)
* docs: add example with query and router * chore: update lockfile * fix tests * prettier stuff * Downgrade prettier --------- Co-authored-by: Kevin Vandy <kevinvandy656@gmail.com> Co-authored-by: Lachlan Collins <1667261+lachlancollins@users.noreply.github.com>
·
v9.0.0-alpha.10v8.19.1
1 parent bbe4ba3 commit 80e45cc

33 files changed

+10205
-3129
lines changed
 

‎docs/config.json

+4
Original file line numberDiff line numberDiff line change
@@ -617,6 +617,10 @@
617617
{
618618
"to": "framework/react/examples/custom-features",
619619
"label": "Custom Features"
620+
},
621+
{
622+
"to": "framework/react/examples/query-router-search-params",
623+
"label": "Query Router Search Params"
620624
}
621625
]
622626
},

‎examples/angular/filters/src/app/app.component.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
@if (!header.isPlaceholder) {
1111
<div
1212
[ngClass]="{
13-
'cursor-pointer select-none': header.column.getCanSort()
13+
'cursor-pointer select-none': header.column.getCanSort(),
1414
}"
1515
>
1616
<ng-container

‎examples/qwik/basic/package.json

-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
"type": "module",
66
"scripts": {
77
"dev": "vite",
8-
"build": "tsc && vite build",
98
"preview": "serve dist"
109
},
1110
"devDependencies": {

‎examples/qwik/filters/package.json

-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
"type": "module",
66
"scripts": {
77
"dev": "vite",
8-
"build": "tsc && vite build",
98
"preview": "serve dist"
109
},
1110
"devDependencies": {

‎examples/qwik/row-selection/package.json

-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
"type": "module",
66
"scripts": {
77
"dev": "vite",
8-
"build": "tsc && vite build",
98
"preview": "serve dist"
109
},
1110
"devDependencies": {

‎examples/qwik/sorting/package.json

-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
"type": "module",
66
"scripts": {
77
"dev": "vite",
8-
"build": "tsc && vite build",
98
"preview": "serve dist"
109
},
1110
"devDependencies": {

‎examples/react/query-router-search-params/.gitignore

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
node_modules
2+
.DS_Store
3+
dist
4+
dist-ssr
5+
*.local

‎examples/react/query-router-search-params/README.md

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
# Example
2+
3+
To run this example:
4+
5+
- `npm install` or `yarn`
6+
- `npm run start` or `yarn start`

‎examples/react/query-router-search-params/index.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Vite App</title>
7+
<script type="module" src="https://cdn.skypack.dev/twind/shim"></script>
8+
</head>
9+
<body>
10+
<div id="root"></div>
11+
<script type="module" src="/src/main.tsx"></script>
12+
</body>
13+
</html>

‎examples/react/query-router-search-params/package.json

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"name": "tanstack-table-example-query-router-search-params",
3+
"version": "0.0.0",
4+
"private": true,
5+
"scripts": {
6+
"dev": "vite",
7+
"build": "vite build",
8+
"serve": "vite preview",
9+
"start": "vite"
10+
},
11+
"dependencies": {
12+
"@tanstack/react-query": "^5.32.0",
13+
"@tanstack/react-router": "^1.36.3",
14+
"@tanstack/react-table": "^8.17.3",
15+
"react": "^18.3.0",
16+
"react-dom": "^18.3.0"
17+
},
18+
"devDependencies": {
19+
"@faker-js/faker": "^8.4.1",
20+
"@tanstack/router-vite-plugin": "^1.37.0",
21+
"@rollup/plugin-replace": "^5.0.5",
22+
"@types/react": "^18.3.0",
23+
"@types/react-dom": "^18.3.0",
24+
"@vitejs/plugin-react": "^4.2.1",
25+
"typescript": "5.4.5",
26+
"vite": "^5.2.10"
27+
}
28+
}

‎examples/react/query-router-search-params/src/App.tsx

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
2+
import { createRouter, RouterProvider } from '@tanstack/react-router'
3+
import { routeTree } from './routeTree.gen'
4+
5+
const router = createRouter({ routeTree })
6+
7+
declare module '@tanstack/react-router' {
8+
interface Register {
9+
router: typeof router
10+
}
11+
}
12+
13+
const queryClient = new QueryClient()
14+
15+
export default function App() {
16+
return (
17+
<QueryClientProvider client={queryClient}>
18+
<RouterProvider router={router} />
19+
</QueryClientProvider>
20+
)
21+
}

0 commit comments

Comments
 (0)
Please sign in to comment.