Docs Sidebar

1// In your layout.tsx or page.tsx
2import { DocsSidebar } from '@/components/docs/docs-sidebar';
3import { docsNavigation } from './docs-nav-data'; // Your navigation data
4
5// Optional: Auto-numbering formatters
6const formatSectionTitle = (title, index) =>
7  `[${String(index + 1).padStart(2, '0')}] ${title}`;
8const formatItemTitle = (title, itemIndex, sectionIndex, subSectionIndex) => {
9  if (subSectionIndex !== undefined) return title;
10  const secNum = String(sectionIndex + 1).padStart(2, '0');
11  const itemNum = itemIndex + 1;
12  return `[${secNum}.${itemNum}] ${title}`;
13};
14
15function MyDocsLayout({ children }) {
16  return (
17    <div className="flex">
18      <DocsSidebar
19        navigation={docsNavigation}
20        formatSectionTitle={formatSectionTitle}
21        formatItemTitle={formatItemTitle}
22      />
23      <main>{children}</main>
24    </div>
25  );
26}