33 lines
1.0 KiB
TypeScript
33 lines
1.0 KiB
TypeScript
import { Button, Card } from './ui'
|
|
import { t } from '@/lib/i18n'
|
|
import type { DocLink, DocSection } from '@/hooks/useDocs'
|
|
|
|
interface DocsSidebarProps {
|
|
docs: DocLink[]
|
|
selectedDoc: DocSection
|
|
onSelectDoc: (docId: DocSection) => void
|
|
}
|
|
|
|
export function DocsSidebar({ docs, selectedDoc, onSelectDoc }: DocsSidebarProps): React.ReactElement {
|
|
return (
|
|
<aside className="lg:w-64 flex-shrink-0">
|
|
<Card variant="default" className="bg-cyber-dark sticky top-4 backdrop-blur-sm">
|
|
<h2 className="text-lg font-bold mb-4 text-neon-cyan font-mono">{t('docs.title')}</h2>
|
|
<nav className="space-y-2">
|
|
{docs.map((doc) => (
|
|
<Button
|
|
key={doc.id}
|
|
type="button"
|
|
variant={selectedDoc === doc.id ? 'primary' : 'ghost'}
|
|
onClick={() => onSelectDoc(doc.id)}
|
|
className="w-full text-left justify-start"
|
|
>
|
|
{doc.title}
|
|
</Button>
|
|
))}
|
|
</nav>
|
|
</Card>
|
|
</aside>
|
|
)
|
|
}
|