34 lines
1.1 KiB
TypeScript
34 lines
1.1 KiB
TypeScript
import { useEffect, useState } from 'react'
|
|
import { SiteHeader } from './components/SiteHeader'
|
|
import { DocsPage } from './pages/DocsPage'
|
|
import { HomePage } from './pages/HomePage'
|
|
|
|
function App() {
|
|
const [pathname, setPathname] = useState(() => window.location.pathname.replace(/\/$/, '') || '/')
|
|
|
|
useEffect(() => {
|
|
const onPopState = () => setPathname(window.location.pathname.replace(/\/$/, '') || '/')
|
|
window.addEventListener('popstate', onPopState)
|
|
return () => window.removeEventListener('popstate', onPopState)
|
|
}, [])
|
|
|
|
const navigate = (nextPath: string) => {
|
|
const normalized = nextPath.replace(/\/$/, '') || '/'
|
|
window.history.pushState({}, '', normalized)
|
|
setPathname(normalized)
|
|
}
|
|
|
|
const isDocsPage = pathname === '/docs'
|
|
|
|
return (
|
|
<div className="min-h-screen bg-slate-950 text-slate-200">
|
|
<div className="mx-auto flex min-h-screen w-full max-w-6xl flex-col border-x border-slate-800 bg-slate-950">
|
|
<SiteHeader page={isDocsPage ? 'docs' : 'home'} onNavigate={navigate} />
|
|
{isDocsPage ? <DocsPage /> : <HomePage />}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default App
|