feat: Update Snippet component to use For loop for rendering snippets

This commit is contained in:
Gauthier Daniels 2025-04-22 14:19:25 +02:00
parent 51771c4871
commit 32ee8dd628

View File

@ -131,25 +131,25 @@ export function Snippet(props: SnippetProps) {
</div> </div>
</nav> </nav>
{selectedTab() && ( <For each={props.snippets}>
<div class="mt-6"> {(tab) => (
{selectedTab().code && ( <div class={clsx("mt-6", isActive(tab) ? "block" : "hidden")}>
{tab.code && (
<Highlight <Highlight
class={clsx( class={clsx(
"!pt-0 !px-1 max-h-96 overflow-auto mb-2", "!pt-0 !px-1 max-h-96 overflow-auto mb-2",
props.dark && "dark text-white", props.dark && "dark text-white",
)} )}
language={(selectedTab() as SnippetTab).codeLanguage} language={tab.codeLanguage}
withLineNumbers={(selectedTab() as SnippetTab).withLineNumbers} withLineNumbers={tab.withLineNumbers}
> >
{(selectedTab() as SnippetTab).code} {tab.code}
</Highlight> </Highlight>
)} )}
{!selectedTab().code && ( {!tab.code && <div class="pb-1">{tab.children}</div>}
<div class="pb-1">{(selectedTab() as CommonTab).children}</div>
)}
</div> </div>
)} )}
</For>
</div> </div>
</div> </div>
); );