diff --git a/frontend/src/components/sidebar/CategoryList.tsx b/frontend/src/components/sidebar/CategoryList.tsx index 37f3476e..81dcb97f 100644 --- a/frontend/src/components/sidebar/CategoryList.tsx +++ b/frontend/src/components/sidebar/CategoryList.tsx @@ -1,3 +1,5 @@ +import { useState } from 'react' +import { ChevronDown, ChevronUp } from 'lucide-react' import { cn } from '@/lib/utils' interface CategoryItem { @@ -13,16 +15,23 @@ interface CategoryListProps { onSelect: (id: string | null) => void } +const VISIBLE_COUNT = 4 + export function CategoryList({ categories, activeId, onSelect }: CategoryListProps) { + const [expanded, setExpanded] = useState(false) + if (categories.length === 0) return null + const hasMore = categories.length > VISIBLE_COUNT + const visible = expanded ? categories : categories.slice(0, VISIBLE_COUNT) + return (
Categories