app/partials/TableOfContents.tsx

@@ -16,23 +16,19 @@ export function TableOfContents() {
 
 	const getHeadings = () => {
 		return data.sections
-			.flatMap((section) => [section, ...section.children])
 			.map((section) => {
 				if (!section.hash) return null;
 
 				const el = document.getElementById(section.hash);
-				console.log(section.hash, el);
 				if (!el) return null;
 
 				const style = window.getComputedStyle(el);
 				const scrollMt = Number.parseFloat(style.scrollMarginTop);
 
 				const top = window.scrollY + el.getBoundingClientRect().top - scrollMt;
-				return { id: section.hash, top, level: section.level };
+				return { id: section.hash, top };
 			})
-			.filter(
-				(x): x is { id: string; top: number; level: number } => x !== null,
-			);
+			.filter((x): x is { id: string; top: number } => x !== null);
 	};
 
 	createEffect(() => {
@@ -50,11 +46,8 @@ export function TableOfContents() {
 			}
 			setCurrentSection(current);
 		}
-
 		window.addEventListener("scroll", onScroll, { passive: true });
-
 		onScroll();
-
 		return () => {
 			window.removeEventListener("scroll", onScroll);
 		};
@@ -62,12 +55,10 @@ export function TableOfContents() {
 
 	function isActive(section: DocSection) {
 		if (section.hash === currentSection()) return true;
-		if (!section.children) return false;
+		return false;
+		// if (!section.children) return false;
 
-		return (
-			section.children.findIndex((child) => child.hash === currentSection()) !==
-			-1
-		);
+		// return section.children.findIndex(isActive) > -1;
 	}
 
 	return (
@@ -96,26 +87,6 @@ export function TableOfContents() {
 										{section.content}
 									</Link>
 								</h3>
-								{section.children.length > 0 && (
-									<ol class="mt-2 space-y-2 pl-4">
-										<For each={section.children}>
-											{(subsection) => (
-												<li>
-													<Link
-														href={`#${subsection.hash}`}
-														class={clsx(
-															isActive(subsection)
-																? "text-violet-500"
-																: "font-normal text-slate-500 hover:text-slate-700",
-														)}
-													>
-														{subsection.content}
-													</Link>
-												</li>
-											)}
-										</For>
-									</ol>
-								)}
 							</li>
 						)}
 					</For>

app/services/DocCache.ts

@@ -22,7 +22,6 @@ export type DocSection = {
 	content: string;
 	hash?: string;
 	subsections: string[];
-	children: DocSection[];
 	level?: number;
 };
 
@@ -99,32 +98,15 @@ class DocCache {
 		if (["heading", "paragraph"].includes(node.type)) {
 			const content = this.nodeToString(node).trim();
 
-			if (node.type === "heading" && node.attributes?.level <= 3) {
+			if (node.type === "heading" && node.attributes?.level <= 2) {
 				const hash = (node.attributes?.id as string) ?? this.slugify(content);
 				const subsections: string[] = [];
-
-				if (node.attributes?.level === 2) {
-					sections.push({
-						content,
-						hash,
-						subsections,
-						children: [],
-						level: node.attributes?.level,
-					});
-				} else if (node.attributes?.level === 3) {
-					const lastSection = sections.at(-1);
-
-					if (lastSection) {
-						lastSection.subsections.push(hash);
-						lastSection.children.push({
-							content,
-							hash,
-							subsections,
-							children: [],
-							level: node.attributes?.level,
-						});
-					}
-				}
+				sections.push({
+					content,
+					hash,
+					subsections,
+					level: node.attributes?.level,
+				});
 			} else {
 				sections.at(-1)?.subsections.push(content);
 			}

temp.json

@@ -1 +0,0 @@
-[{"content":"qu-est-ce-que-le-hook-use-reducer","hash":"qu-est-ce-que-le-hook-use-reducer","level":2,"subsections":[{"content":"quand-utiliser-use-reducer","hash":"quand-utiliser-use-reducer","level":3,"subsections":[{"content":"a-quoi-ressemble-un-reducer","hash":"a-quoi-ressemble-un-reducer","level":2,"subsections":[{"content":"comment-utiliser-use-reducer","hash":"comment-utiliser-use-reducer","level":2,"subsections":[{"content":"on-nettoie-tout-ca","hash":"on-nettoie-tout-ca","level":2,"subsections":[{"content":"typage-des-actions","hash":"typage-des-actions","level":3,"subsections":[{"content":"action-creators","hash":"action-creators","level":3,"subsections":[{"content":"les-fichiers-complets","hash":"les-fichiers-complets","level":2,"subsections":[{"content":"fichier-counter-jsx-ou-counter-tsx","hash":"fichier-counter-jsx-ou-counter-tsx","level":3,"subsections":[{"content":"c-est-l-heure-des-questions","hash":"c-est-l-heure-des-questions","level":2,"subsections":[{"content":"conclusion","hash":"conclusion","level":2,"subsections":[]}]}]}]}]}]}]}]}]}]}]}]