diff --git a/web/app/guides/[slug]/page.tsx b/web/app/guides/[slug]/page.tsx index 8436ceb..1ee7454 100644 --- a/web/app/guides/[slug]/page.tsx +++ b/web/app/guides/[slug]/page.tsx @@ -3,7 +3,10 @@ import path from "path" import { remark } from "remark" import html from "remark-html" import dynamic from "next/dynamic" +import React from "react" +import parse from "html-react-parser" +// Importamos `CopyableCode` de forma dinĂ¡mica para evitar problemas de SSR const CopyableCode = dynamic(() => import("@/components/CopyableCode"), { ssr: false }) async function getGuideContent(slug: string) { @@ -23,23 +26,27 @@ export async function generateStaticParams() { function wrapCodeBlocksWithCopyable(content: string) { - return content.replace( - /
([\s\S]*?)<\/code><\/pre>/g,
-    (match, lang, code) =>
-      `
` - ) + return parse(content, { + replace: (domNode: any) => { + if (domNode.name === "pre" && domNode.children.length > 0) { + const codeElement = domNode.children.find((child: any) => child.name === "code") + if (codeElement) { + const codeContent = codeElement.children[0]?.data?.trim() || "" + return + } + } + } + }) } export default async function GuidePage({ params }: { params: { slug: string } }) { - let guideContent = await getGuideContent(params.slug) - guideContent = wrapCodeBlocksWithCopyable(guideContent) + const guideContent = await getGuideContent(params.slug) + const parsedContent = wrapCodeBlocksWithCopyable(guideContent) return (
-
+
{parsedContent}
)