fix: remplacer le libellé de date par une icône universelle

components/teks/diferans-dialog.js

@@ -1,9 +1,6 @@
 import React, {forwardRef, useState} from 'react'
 import PropTypes from 'prop-types'
 
-import {format} from 'date-fns'
-import {fr} from 'date-fns/locale'
-
 import Button from '@mui/material/Button'
 import Dialog from '@mui/material/Dialog'
 import DialogTitle from '@mui/material/DialogTitle'
@@ -50,7 +47,7 @@ export default function DiferansDialog({difference}) {
         <List sx={{width: '100%', maxWidth: 360, bgcolor: 'background.paper'}}>
           {difference.map(({id, admin_user, date, jsonDiff}) => {
             const {firstname} = admin_user
-            const diferansDate = format(new Date(date), 'PPPppp', {locale: fr})
+            const diferansDate = new Intl.DateTimeFormat(undefined, {dateStyle: 'full', timeStyle: 'medium'}).format(new Date(date))
 
             return (
               <React.Fragment key={id}>

components/teks/teks-kat.js

@@ -3,8 +3,6 @@
 import PropTypes from 'prop-types'
 import {useRouter} from 'next/navigation'
 import Image from 'next/image'
-import {format} from 'date-fns'
-import {fr} from 'date-fns/locale'
 import Card from '@mui/material/Card'
 
 import CardActionArea from '@mui/material/CardActionArea'
@@ -13,6 +11,7 @@ import Typography from '@mui/material/Typography'
 import Box from '@mui/material/Box'
 import Grid from '@mui/material/Grid'
 import ExplicitIcon from '@mui/icons-material/Explicit'
+import EventIcon from '@mui/icons-material/Event'
 import {styled} from '@mui/material/styles'
 
 import {getAlias} from '../../lib/utils/get-alias'
@@ -37,7 +36,7 @@ export default function TeksKat({parole}) {
   const router = useRouter()
   const {titre, artistes, annee, couverture, createdAt, slug} = parole
 
-  const datPiblikasyon = format(new Date(createdAt), 'P', {locale: fr})
+  const datPiblikasyon = new Intl.DateTimeFormat(undefined, {dateStyle: 'short'}).format(new Date(createdAt))
   const aliases = getAlias(artistes, parole.prioriteArtistes)
 
   const handleClick = slug => {
@@ -103,8 +102,15 @@ export default function TeksKat({parole}) {
                   </>
                 )}
               </Typography>
-              <Typography align='center' style={{marginTop: '0.5em'}} variant='body1' color='textSecondary' component='p'>
+              <Typography
-                Publiée le : {datPiblikasyon}
+                align='center'
+                style={{marginTop: '0.5em'}}
+                variant='body1'
+                color='textSecondary'
+                component='p'
+                sx={{display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 0.5}}
+              >
+                <EventIcon fontSize='inherit' /> {datPiblikasyon}
               </Typography>
             </Box>
           </CardContent>