Merge branch 'issue-316/changelog-integration' into 'develop'

Issue #316: ADD Changelog translated page

See merge request !298

package.json

@@ -15,16 +15,23 @@
     "@mui/material": "^5.16.0",
     "axios": "^1.7.2",
     "framer-motion": "^11.3.30",
+    "gray-matter": "^4.0.3",
     "next": "14.2.3",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-icons": "^5.2.1",
     "react-image-crop": "^11.0.7",
     "react-swipeable": "^7.0.1",
+    "rehype-stringify": "^10.0.1",
+    "remark": "^15.0.1",
+    "remark-html": "^16.0.1",
+    "remark-parse": "^11.0.0",
+    "remark-rehype": "^11.1.2",
     "tailwind-scrollbar": "^3.1.0"
   },
   "devDependencies": {
     "@svgr/webpack": "^8.1.0",
+    "@tailwindcss/typography": "^0.5.16",
     "autoprefixer": "^10.4.19",
     "eslint": "^8.57.0",
     "eslint-config-next": "14.1.0",

src/app/atualizacoes/page.js

+import { remark } from 'remark';
+import remarkParse from 'remark-parse';
+import remarkRehype from 'remark-rehype';
+import rehypeStringify from 'rehype-stringify';
+import Overlay from "../components/Overlay"
+
+export default async function ChangelogPage() {
+  const res = await fetch(
+    'https://gitlab.c3sl.ufpr.br/mecred/frontend-mecred/-/raw/develop/CHANGELOG.md',
+    { cache: 'no-store' }
+  );
+
+  if (!res.ok) {
+    return <p>Erro ao carregar changelog.</p>;
+  }
+
+  const markdown = await res.text();
+
+  const processedContent = await remark()
+    .use(remarkParse)
+    .use(remarkRehype)
+    .use(rehypeStringify)
+    .process(markdown);
+
+  const contentHtml = processedContent.toString();
+
+  return (
+    <Overlay>
+      <div className="max-h-screen overflow-y-auto">
+        <main className="prose max-w-3xl mx-auto px-4 py-8">
+          <div dangerouslySetInnerHTML={{ __html: contentHtml }} />
+        </main>
+      </div>
+    </Overlay>
+  );
+}

src/app/components/About.js

@@ -336,7 +336,7 @@ export default function AboutComponent() {
             title="Versão"
             description="A MEC RED está em constante evolução! Atualizações frequentes trazem novas funcionalidades, melhorias de desempenho e correções, sempre priorizando a melhor experiência para os usuários."
             access="Clique aqui para acessar o histórico de atualizações"
-            link="https://gitlab.c3sl.ufpr.br/mecred/frontend-mecred/-/blob/develop/CHANGELOG.md?ref_type=heads"
+            link="/atualizacoes"
           />
           <DevelopmentInfo
             title="Desenvolvedores"

tailwind.config.js

@@ -97,6 +97,7 @@ module.exports = {
 
 
   plugins: [
+    require('@tailwindcss/typography'),
     function ({ addUtilities }) {
       const newUtilities = {
         '.text-main-text': {