From ddd296a9303daee59cf0720e3b0f697fd438e3d4 Mon Sep 17 00:00:00 2001
From: MacRimi <123239993+MacRimi@users.noreply.github.com>
Date: Fri, 14 Feb 2025 19:09:50 +0100
Subject: [PATCH] Update page.tsx

---
 web/app/changelog/page.tsx | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/web/app/changelog/page.tsx b/web/app/changelog/page.tsx
index 50d3f2f..dd03508 100644
--- a/web/app/changelog/page.tsx
+++ b/web/app/changelog/page.tsx
@@ -1,15 +1,20 @@
 import fs from "fs"
 import path from "path"
-import ReactMarkdown from "react-markdown"
+import { remark } from "remark"
+import html from "remark-html"
 
 async function getChangelog() {
   const changelogPath = path.join(process.cwd(), "..", "CHANGELOG.md")
   try {
     const fileContents = fs.readFileSync(changelogPath, "utf8")
-    return fileContents
+
+    // Convertir Markdown a HTML
+    const result = await remark().use(html).process(fileContents)
+
+    return result.toString()
   } catch (error) {
     console.error("Error reading changelog file:", error)
-    return "Changelog content not found."
+    return "<p>Changelog content not found.</p>"
   }
 }
 
@@ -20,9 +25,10 @@ export default async function ChangelogPage() {
     <div className="bg-white text-gray-900 min-h-screen">
       <div className="container mx-auto px-4 py-16 max-w-4xl">
         <h1 className="text-4xl font-bold mb-8">Changelog</h1>
-        <div className="prose prose-lg max-w-none bg-gray-100 p-4 border border-gray-300 rounded-md">
-          <ReactMarkdown>{changelogContent}</ReactMarkdown>
-        </div>
+        <div
+          className="prose prose-lg max-w-none bg-gray-100 p-4 border border-gray-300 rounded-md"
+          dangerouslySetInnerHTML={{ __html: changelogContent }} // Renderizar como HTML
+        />
       </div>
     </div>
   )