diff --git a/components/docs/DocsSidebar.tsx b/components/docs/DocsSidebar.tsx index 97f2929..fcd0ab2 100644 --- a/components/docs/DocsSidebar.tsx +++ b/components/docs/DocsSidebar.tsx @@ -1,18 +1,17 @@ 'use client' import Link from 'next/link' -import { useEffect, useState } from 'react' import { usePathname } from 'next/navigation' -import { ChevronDown } from 'lucide-react' -import type { NavSection, ProductNav } from '@/lib/content' +import type { ProductNav } from '@/lib/content' +import { NavSection } from './NavSection' /** - * Frontmatter-derived nav with the product switch on top: auths-mcp and - * Identity & signing are separate worlds that never intermix. The switch - * navigates to each product's landing page; the shown product follows the URL. + * Frontmatter-derived nav with the area switch on top. Areas are separate + * worlds that never intermix; the switch navigates to each area's landing page + * and the shown area follows the URL. * - * Sections come in two shapes: flat (always open) and collapsible — one row - * with a chevron for large topics, auto-expanded while the reader is inside. + * Every section renders through the one shared {@link NavSection} disclosure — + * same caret, same behaviour, in every area. */ function productForPath(nav: ProductNav[], pathname: string): ProductNav['product'] { @@ -22,7 +21,7 @@ function productForPath(nav: ProductNav[], pathname: string): ProductNav['produc return 'mcp' } -/** A product's first navigable page — where its switch tab points. */ +/** An area's first navigable page — where its switch tab points. */ function landingHref(p: ProductNav): string { for (const section of p.sections) { const first = section.items.find((i) => i.badge !== 'soon') @@ -31,83 +30,14 @@ function landingHref(p: ProductNav): string { return '#' } -function SectionItems({ section, pathname }: { section: NavSection; pathname: string }) { - return ( - - ) -} - -/** A large topic folded to one row; opens on click and while a child is active. */ -function CollapsibleSection({ section, pathname }: { section: NavSection; pathname: string }) { - const containsActive = section.items.some((i) => i.href === pathname) - const [open, setOpen] = useState(containsActive) - useEffect(() => { - if (containsActive) setOpen(true) - }, [containsActive]) - - return ( -
- - {open ? : null} -
- ) -} - export function DocsSidebar({ nav }: { nav: ProductNav[] }) { const pathname = usePathname() const currentProduct = productForPath(nav, pathname) const active = nav.find((p) => p.product === currentProduct) ?? nav[0] return ( -