From acabbae9513c0fcf4d0549a2fe69f4553b2404dc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20FAMIBELLE-PRONZOLA?= <c.pronzola@tuta.io>
Date: Wed, 23 Jul 2025 12:22:21 +0400
Subject: [PATCH] fix: corrige rendu markdown dans comparaison versions

---
 components/versions/version-comparison.js | 29 ++++++++++++++++++-----
 1 file changed, 23 insertions(+), 6 deletions(-)

diff --git a/components/versions/version-comparison.js b/components/versions/version-comparison.js
index 30d3c27..2d28af1 100644
--- a/components/versions/version-comparison.js
+++ b/components/versions/version-comparison.js
@@ -10,6 +10,7 @@ import {useState, useEffect} from 'react'
 import {useSession} from 'next-auth/react'
 import Snackbar from '@mui/material/Snackbar'
 import Alert from '@mui/material/Alert'
+import MarkdownRenderer from '../markdown-renderer/index.js'
 import {handleVote, getUserVote} from '../../lib/directus.js'
 import {formatDate} from '@/lib/format.js'
 
@@ -74,16 +75,32 @@ export default function VersionComparison({versionData, versionCompare}) {
       <Grid container spacing={2}>
         <Grid xs={6}>
           <Paper sx={{padding: 1, backgroundColor: '#E8F5E9'}}>
-            <Typography variant='body1' sx={{color: '#388E3C', fontWeight: 'bold'}}>
-              {main.contenu}
-            </Typography>
+            <Box sx={{color: '#388E3C', fontWeight: 'bold'}}>
+              <MarkdownRenderer
+                content={main.contenu}
+                color='#388E3C'
+                fallbackComponent={({children, ...props}) => (
+                  <Typography variant='body1' sx={{color: '#388E3C', fontWeight: 'bold'}} {...props}>
+                    {children}
+                  </Typography>
+                )}
+              />
+            </Box>
           </Paper>
         </Grid>
         <Grid xs={6}>
           <Paper sx={{padding: 1, backgroundColor: outdated ? '#F9E8E8' : '#E3F2FD'}}>
-            <Typography variant='body1' sx={{color: outdated ? '#D32F2F' : '#1976D2', fontWeight: 'bold'}}>
-              {current.contenu}
-            </Typography>
+            <Box sx={{color: outdated ? '#D32F2F' : '#1976D2', fontWeight: 'bold'}}>
+              <MarkdownRenderer
+                content={current.contenu}
+                color={outdated ? '#D32F2F' : '#1976D2'}
+                fallbackComponent={({children, ...props}) => (
+                  <Typography variant='body1' sx={{color: outdated ? '#D32F2F' : '#1976D2', fontWeight: 'bold'}} {...props}>
+                    {children}
+                  </Typography>
+                )}
+              />
+            </Box>
             {!outdated && session?.user && (
               <>
                 <Box>