news: show the publication date

components/News/Details.vue

@@ -40,6 +40,10 @@
               <strong>
                 {{ newsItem.leadText }}
               </strong>
+
+              <p>
+                {{ formattedPublicationDate }}
+              </p>
             </v-col>
           </v-row>
 
@@ -90,6 +94,8 @@
 
 <script setup lang="ts">
 import { useDisplay } from 'vuetify'
+import { parseISO, format } from 'date-fns'
+import { fr } from 'date-fns/locale'
 import { useEntityFetch } from '~/composables/data/useEntityFetch'
 import News from '~/models/Maestro/News'
 
@@ -112,6 +118,25 @@ const getImageUrl = (attachment: string): string | null => {
   }
   return `${config.public.apiBaseUrl}/uploads/news/${attachment}`
 }
+
+const formattedPublicationDate = computed(() => {
+  if (pending.value || !newsItem.value) {
+    return ''
+  }
+
+  const date = parseISO(newsItem.value.startPublication)
+
+  let formattedPublicationDate = format(date, "'Le' dd MMMM yyyy", {
+    locale: fr,
+  })
+
+  formattedPublicationDate = formattedPublicationDate.replace(
+    'Le 01 ',
+    'Le 1er '
+  )
+
+  return formattedPublicationDate
+})
 </script>
 
 <style scoped>