this repo has no description
1import { createFileRoute, Outlet, useMatches } from "@tanstack/react-router";
2
3import { ChapterPager } from "~/chapters/chapter-navigation";
4import { SectionHeader } from "~/chapters/section-header";
5
6export const Route = createFileRoute("/_chapters")({
7 staticData: {
8 routeTitle: "FILL_THIS_IN",
9 routeSubtitle: "FILL_THIS_IN",
10 },
11 component: RouteComponent,
12});
13
14function RouteComponent() {
15 const matches = useMatches();
16 const leaf = matches[matches.length - 1];
17 const routeTitle = leaf.staticData.routeTitle;
18 const routeSubtitle = leaf.staticData.routeSubtitle;
19
20 if (!routeTitle || routeTitle === "FILL_THIS_IN") {
21 throw new Error(`Route "${leaf?.routeId}" must define staticData.routeTitle`);
22 }
23
24 if (!routeSubtitle || routeSubtitle === "FILL_THIS_IN") {
25 throw new Error(`Route "${leaf?.routeId}" must define staticData.routeSubtitle`);
26 }
27
28 return (
29 <main className="min-h-screen bg-(--bg-primary) p-6">
30 <div className="max-w-7xl mx-auto">
31 <SectionHeader title={routeTitle} subtitle={routeSubtitle} />
32
33 <Outlet />
34 <ChapterPager />
35 </div>
36 </main>
37 );
38}