50 lines
1.4 KiB
TypeScript
50 lines
1.4 KiB
TypeScript
import { description } from "reacord/package.json"
|
|
import { lazy, Suspense } from "react"
|
|
import { Meta, Title } from "react-head"
|
|
import { Link, Route, Routes } from "react-router-dom"
|
|
import { lazyNamed } from "./helpers/lazy-named"
|
|
|
|
export function App() {
|
|
return (
|
|
<>
|
|
<Title>Reacord</Title>
|
|
<Meta name="description" content={description} />
|
|
<nav>
|
|
<Link to="/">Home</Link>{" "}
|
|
<Link to="docs/getting-started">Getting Started</Link>{" "}
|
|
<Link to="docs/api">API Reference</Link>
|
|
</nav>
|
|
<Suspense fallback={<></>}>
|
|
<Routes>
|
|
<Route path="/" element={<LandingPage />} />
|
|
<Route path="docs" element={<DocumentPageLayout />}>
|
|
{docs.map(({ route, component: Component }) => (
|
|
<Route key={route} path={route} element={<Component />} />
|
|
))}
|
|
</Route>
|
|
</Routes>
|
|
</Suspense>
|
|
</>
|
|
)
|
|
}
|
|
|
|
const LandingPage = lazyNamed(
|
|
"LandingPage",
|
|
() => import("./pages/landing-page"),
|
|
)
|
|
|
|
const DocumentPageLayout = lazyNamed(
|
|
"DocumentPage",
|
|
() => import("./pages/document-page"),
|
|
)
|
|
|
|
const docs = Object.entries(import.meta.glob("./docs/*.md")).map(
|
|
([path, loadModule]) => ({
|
|
route: path.replace("./docs/", "").replace(/\.md$/, ""),
|
|
component: lazy(async () => {
|
|
const m = await loadModule()
|
|
return { default: m.default || m }
|
|
}),
|
|
}),
|
|
)
|