- Install rehype-slug (proper heading anchors) + github-slugger (matching TOC) - TOC component: auto-generated from h2/h3 headings, clickable anchors - Dark mode toggle: ThemeToggle (localStorage + system default), class-based - /docs index page (lists all docs by section) - Markdown.tsx uses rehype-slug for stable heading ids - globals.css: @custom-variant dark (.dark class) for class-based dark mode - layout.tsx: nav includes ThemeToggle Note: per user instruction, installed real deps (rehype-slug, github-slugger, @types/hast) instead of hacky inline any-cast hacks.
42 lines
1.3 KiB
TypeScript
42 lines
1.3 KiB
TypeScript
import Link from "next/link";
|
|
import { listDocuments } from "@mcpedia/core";
|
|
|
|
export const dynamic = "force-dynamic";
|
|
|
|
const SECTIONS = ["docs", "writeups", "research", "notes"] as const;
|
|
|
|
export default async function DocsIndexPage() {
|
|
const all = await listDocuments();
|
|
const bySection = SECTIONS.map((section) => ({
|
|
section,
|
|
docs: all.filter((d) => d.section === section),
|
|
}));
|
|
|
|
return (
|
|
<div className="space-y-8">
|
|
<h1 className="text-2xl font-semibold tracking-tight">All Documents</h1>
|
|
{bySection.map(({ section, docs }) => (
|
|
<section key={section}>
|
|
<h2 className="text-lg font-medium capitalize mb-3">{section}</h2>
|
|
{docs.length === 0 ? (
|
|
<p className="text-sm text-zinc-500">No documents in this section.</p>
|
|
) : (
|
|
<ul className="space-y-2">
|
|
{docs.map((d) => (
|
|
<li key={d.slug}>
|
|
<Link href={`/${d.slug}`} className="hover:underline">
|
|
{d.title}
|
|
</Link>
|
|
<span className="text-xs text-zinc-500 ml-2">
|
|
{d.author || "unknown"}
|
|
</span>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
)}
|
|
</section>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|