({
wikiStructure,
currentPageId,
onPageSelect,
})
| 43 | } |
| 44 | |
| 45 | const WikiTreeView: React.FC<WikiTreeViewProps> = ({ |
| 46 | wikiStructure, |
| 47 | currentPageId, |
| 48 | onPageSelect, |
| 49 | }) => { |
| 50 | const [expandedSections, setExpandedSections] = useState<Set<string>>( |
| 51 | new Set(wikiStructure.rootSections) |
| 52 | ); |
| 53 | |
| 54 | const toggleSection = (sectionId: string, event: React.MouseEvent) => { |
| 55 | event.stopPropagation(); |
| 56 | setExpandedSections(prev => { |
| 57 | const newSet = new Set(prev); |
| 58 | if (newSet.has(sectionId)) { |
| 59 | newSet.delete(sectionId); |
| 60 | } else { |
| 61 | newSet.add(sectionId); |
| 62 | } |
| 63 | return newSet; |
| 64 | }); |
| 65 | }; |
| 66 | |
| 67 | const renderSection = (sectionId: string, level = 0) => { |
| 68 | const section = wikiStructure.sections.find(s => s.id === sectionId); |
| 69 | if (!section) return null; |
| 70 | |
| 71 | const isExpanded = expandedSections.has(sectionId); |
| 72 | |
| 73 | return ( |
| 74 | <div key={sectionId} className="mb-2"> |
| 75 | <button |
| 76 | className={`flex items-center w-full text-left px-2 py-1.5 rounded-md text-sm font-medium text-[var(--foreground)] hover:bg-[var(--background)]/70 transition-colors ${ |
| 77 | level === 0 ? 'bg-[var(--background)]/50' : '' |
| 78 | }`} |
| 79 | onClick={(e) => toggleSection(sectionId, e)} |
| 80 | > |
| 81 | {isExpanded ? ( |
| 82 | <FaChevronDown className="mr-2 text-xs" /> |
| 83 | ) : ( |
| 84 | <FaChevronRight className="mr-2 text-xs" /> |
| 85 | )} |
| 86 | <span className="truncate">{section.title}</span> |
| 87 | </button> |
| 88 | |
| 89 | {isExpanded && ( |
| 90 | <div className={`ml-4 mt-1 space-y-1 ${level > 0 ? 'pl-2 border-l border-[var(--border-color)]/30' : ''}`}> |
| 91 | {/* Render pages in this section */} |
| 92 | {section.pages.map(pageId => { |
| 93 | const page = wikiStructure.pages.find(p => p.id === pageId); |
| 94 | if (!page) return null; |
| 95 | |
| 96 | return ( |
| 97 | <button |
| 98 | key={pageId} |
| 99 | className={`w-full text-left px-3 py-1.5 rounded-md text-sm transition-colors ${ |
| 100 | currentPageId === pageId |
| 101 | ? 'bg-[var(--accent-primary)]/20 text-[var(--accent-primary)] border border-[var(--accent-primary)]/30' |
| 102 | : 'text-[var(--foreground)] hover:bg-[var(--background)] border border-transparent' |
nothing calls this directly
no test coverage detected