Mirrors/ProxMenux
1
0
Fork 0
mirror of https://github.com/MacRimi/ProxMenux.git synced 2025-06-28 20:26:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update page.tsx

Browse Source
This commit is contained in:
MacRimi 2025-02-15 15:14:19 +01:00 committed by GitHub
parent 2aca62719e
commit fb47e65b5f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 19 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
web/app/guides/[slug]/page.tsx
View File

@ -2,6 +2,11 @@ import fs from "fs"
import path from "path" import path from "path"
import { remark } from "remark" import { remark } from "remark"
import html from "remark-html" import html from "remark-html"
import dynamic from "next/dynamic"
import React from "react"
const CopyableCode = dynamic(() => import("@/components/CopyableCode"), { ssr: false })
async function getGuideContent(slug: string) { async function getGuideContent(slug: string) {
const guidePath = path.join(process.cwd(), "..", "guides", `${slug}.md`) const guidePath = path.join(process.cwd(), "..", "guides", `${slug}.md`)
@ -18,23 +23,26 @@ export async function generateStaticParams() {
})) }))
} }
export default async function GuidePage({ params }: { params: { slug: string } }) {
const guideContent = await getGuideContent(params.slug)
// Función para envolver los bloques de código con CopyableCode function wrapCodeBlocksWithCopyable(content: string) {
const wrapCodeBlocks = (content: string) => { return content.split(/(<pre><code>[\s\S]*?<\/code><\/pre>)/g).map((segment, index) => {
return content.replace( const match = segment.match(/<pre><code>([\s\S]*?)<\/code><\/pre>/)
/<pre><code>([\s\S]*?)<\/code><\/pre>/g, if (match) {
(match, code) => `<CopyableCode code="${encodeURIComponent(code.trim())}" />`, const codeContent = match[1].trim()
) return React.createElement(CopyableCode, { code: codeContent, key: index })
}
return segment
})
} }
const wrappedContent = wrapCodeBlocks(guideContent) export default async function GuidePage({ params }: { params: { slug: string } }) {
const guideContent = await getGuideContent(params.slug)
const wrappedContent = wrapCodeBlocksWithCopyable(guideContent)
return ( return (
<div className="min-h-screen bg-white text-gray-900"> <div className="min-h-screen bg-white text-gray-900">
<div className="container mx-auto px-4 py-16 max-w-3xl"> <div className="container mx-auto px-4 py-16 max-w-3xl">
<div className="prose max-w-none" dangerouslySetInnerHTML={{ __html: wrappedContent }} /> <div className="prose max-w-none">{wrappedContent}</div>
</div> </div>
</div> </div>
) )