"use client"; import { ChevronDown, ChevronRight, FolderTree } from "lucide-react"; import { useMemo, useState } from "react"; import { cn } from "@/lib/utils"; import type { TreeNode } from "@/types/catalog"; export function CatalogRail({ tree, selectedId, onSelect, }: { tree: TreeNode[]; selectedId: number | null; onSelect: (id: number | null) => void; }) { const [collapsed, setCollapsed] = useState>(new Set()); const visible = useMemo(() => { const hidden = new Set(); for (const node of tree) { if (hidden.has(node.parentId)) { hidden.add(node.id); continue; } if (collapsed.has(node.parentId)) { hidden.add(node.id); } } return tree.filter((n) => !hidden.has(n.id)); }, [tree, collapsed]); const toggle = (id: number) => { setCollapsed((prev) => { const next = new Set(prev); if (next.has(id)) next.delete(id); else next.add(id); return next; }); }; return ( ); }