Files
page-agent/packages/website/src/router.tsx
Simon 4f80ec1459 refactor: upgrade ESLint 9→10 and simplify React lint toolchain
- Upgrade eslint and @eslint/js to v10
- Replace eslint-plugin-react-x + eslint-plugin-react-dom + eslint-plugin-react-hooks
  with unified @eslint-react/eslint-plugin
- Raise dev Node.js requirement to ^22.13.0 || >=24 (runtime packages unaffected)
- Add .npmrc with engine-strict=true
- Move all @eslint-react rule overrides to eslint.config.js,
  eliminating plugin-specific inline eslint-disable comments
- Fix real issues caught by new rules: useless assignments,
  leaked setTimeout, ref naming, useState setter naming
2026-04-08 20:31:31 +08:00

73 lines
1.9 KiB
TypeScript

import { Suspense, lazy, useEffect, useLayoutEffect } from 'react'
import { Route, Switch, useLocation } from 'wouter'
import Footer from './components/Footer'
import Header from './components/Header'
import HomePage from './pages/home'
const docsImport = () => import('./pages/docs')
const DocsPages = lazy(docsImport)
function ScrollToTop() {
const [pathname] = useLocation()
useLayoutEffect(() => {
window.scrollTo(0, 0)
}, [pathname])
return null
}
export default function Router() {
useEffect(() => {
if ('requestIdleCallback' in globalThis) {
const id = requestIdleCallback(() => docsImport())
return () => cancelIdleCallback(id)
}
const id = setTimeout(() => docsImport(), 1)
return () => clearTimeout(id)
}, [])
return (
<div className="flex min-h-screen flex-col">
<Header />
<Suspense>
<ScrollToTop />
<Switch>
<Route path="/">
<main
id="main-content"
className="flex-1 bg-linear-to-br from-blue-50 to-purple-50 dark:from-gray-900 dark:to-gray-800"
>
<HomePage />
</main>
</Route>
<Route path="/docs" nest>
<div className="flex-1 bg-white dark:bg-gray-900">
<Suspense
fallback={
<div className="flex items-center justify-center gap-3 py-20 text-gray-400">
<div className="w-4 h-4 border-2 border-blue-500 border-t-transparent rounded-full animate-spin" />
Loading...
</div>
}
>
<DocsPages />
</Suspense>
</div>
</Route>
<Route>
<div className="flex-1 bg-white dark:bg-gray-900 flex items-center justify-center">
<div className="text-center">
<h1 className="text-4xl font-bold mb-4 text-gray-900 dark:text-white">404</h1>
<p className="text-xl text-gray-600 dark:text-gray-300">Page not found</p>
</div>
</div>
</Route>
</Switch>
</Suspense>
<Footer />
</div>
)
}