---
import Window from "../layouts/Window.astro";
import SettingsPane from "../components/SettingsPane.astro";
import Tree, { type TreeGroup } from "../components/Tree.astro";
import { loadDocs } from "../lib/docs";
import { allPages, crumbsFor } from "../lib/site";
import { cardFor, ogPath } from "../lib/og";
import { markdownPath } from "../lib/llms";
export async function getStaticPaths() {
const docs = await loadDocs();
return [...docs.values()].map((doc) => ({ params: { slug: doc.url.slice(1, -1) }, props: { id: doc.id } }));
}
const docs = await loadDocs();
const doc = docs.get(Astro.props.id)!;
// the list is the page's own sections, with their subsections folded under them; a page with
// fewer than two sections has nothing to list
const groups: TreeGroup[] = [];
for (const h of doc.headings) {
if (h.depth === 2) groups.push({ id: h.id, title: h.text, items: [] });
else if (h.depth === 3) groups.at(-1)?.items.push({ id: h.id, label: h.text });
}
const solo = groups.length < 2;
const { description } = cardFor(doc, docs);
const label = doc.place.isIndex ? `${doc.place.section.title} overview` : doc.place.label;
---
<Window title={doc.id === "README" ? "overview" : doc.title} description={description} og={ogPath(doc)} markdown={markdownPath(doc)} crumbs={crumbsFor(doc)} pages={allPages(doc)} layout={doc.settings ? 330 : solo ? "solo" : 220}>
{doc.settings ? (
<SettingsPane doc={doc} />
) : (
<div class={`pane${solo ? " solo" : ""}`}>
{!solo && <Tree label={label} icon={doc.place.icon} groups={groups} ariaLabel="on this page" />}
<article class="paper prose" data-pagefind-body data-pagefind-meta={`title:${label}`} set:html={doc.html} />
</div>
)}
<script>
import "../scripts/outline";
</script>
</Window>