38 lines
1.3 KiB
TypeScript
38 lines
1.3 KiB
TypeScript
import { createRouter as createTanStackRouter } from '@tanstack/react-router'
|
|
import { routerWithQueryClient } from '@tanstack/react-router-with-query'
|
|
import { getQueryClient } from './lib/query-client'
|
|
import { routeTree } from './routeTree.gen'
|
|
|
|
export const getRouter = createRouter
|
|
|
|
export function createRouter() {
|
|
const queryClient = getQueryClient()
|
|
const router = createTanStackRouter({
|
|
routeTree,
|
|
context: { queryClient },
|
|
scrollRestoration: true,
|
|
defaultPreloadStaleTime: 0,
|
|
defaultPendingComponent: () => (
|
|
<div className="flex min-h-[50dvh] items-center justify-center" role="status" aria-label="正在加载">
|
|
<i className="ri-loader-4-line animate-spin text-2xl text-muted" aria-hidden="true" />
|
|
</div>
|
|
),
|
|
defaultNotFoundComponent: () => (
|
|
<main className="flex min-h-screen items-center justify-center bg-background px-6 text-center">
|
|
<div>
|
|
<p className="text-7xl font-bold text-primary">404</p>
|
|
<h1 className="mt-3 text-xl font-semibold">页面不存在</h1>
|
|
<p className="mt-2 text-sm text-muted">请从左侧导航进入已配置的功能页面。</p>
|
|
</div>
|
|
</main>
|
|
),
|
|
})
|
|
return routerWithQueryClient(router, queryClient)
|
|
}
|
|
|
|
declare module '@tanstack/react-router' {
|
|
interface Register {
|
|
router: ReturnType<typeof getRouter>
|
|
}
|
|
}
|