63 lines
2.1 KiB
TypeScript
63 lines
2.1 KiB
TypeScript
import Link from "next/link";
|
||
import { ChevronRight } from "lucide-react";
|
||
import type { SidebarPageItem } from "@/lib/api";
|
||
import { pageGlyph } from "@/lib/pageGlyph";
|
||
import AboutSiteHeader from "./AboutSiteHeader";
|
||
|
||
/** 侧栏单页兄弟目录（高亮当前 slug）；标题栏与首页「关于本站」一致 */
|
||
export default function SiteDocPageNav({
|
||
pages,
|
||
currentSlug,
|
||
title = "文档目录",
|
||
canManage,
|
||
}: {
|
||
pages: SidebarPageItem[];
|
||
currentSlug?: string;
|
||
title?: string;
|
||
canManage?: boolean;
|
||
}) {
|
||
if (pages.length === 0 && !canManage) return null;
|
||
|
||
return (
|
||
<section className="j13-module j13-about flex min-h-0 flex-col" aria-label={title}>
|
||
<AboutSiteHeader title={title} canManage={canManage} />
|
||
{pages.length === 0 ? (
|
||
<p className="meta mt-2 px-0.5">暂无介绍</p>
|
||
) : (
|
||
<ul className="j13-about-list j13-rail-scroll">
|
||
{pages.map((p) => {
|
||
const Icon = pageGlyph(p.slug);
|
||
const current = currentSlug === p.slug;
|
||
return (
|
||
<li key={p.id}>
|
||
<Link
|
||
href={`/p/${p.slug}`}
|
||
className="j13-about-item"
|
||
aria-current={current ? "page" : undefined}
|
||
style={
|
||
current
|
||
? {
|
||
background: "var(--accent-soft)",
|
||
borderColor: "var(--nav-active-line)",
|
||
}
|
||
: undefined
|
||
}
|
||
>
|
||
<span className="j13-about-ico" aria-hidden="true">
|
||
<Icon size={15} strokeWidth={2} />
|
||
</span>
|
||
<span className="j13-about-body">
|
||
<span className="j13-about-name">{p.title}</span>
|
||
{p.excerpt ? <span className="j13-about-excerpt">{p.excerpt}</span> : null}
|
||
</span>
|
||
<ChevronRight className="j13-about-chev" size={15} aria-hidden="true" />
|
||
</Link>
|
||
</li>
|
||
);
|
||
})}
|
||
</ul>
|
||
)}
|
||
</section>
|
||
);
|
||
}
|