From 04b580661b9ae018292e731706209f430729b416 Mon Sep 17 00:00:00 2001
From: Arthur Danjou <arthurdanjou@outlook.fr>
Date: Tue, 29 Jul 2025 12:42:21 +0000
Subject: [PATCH] =?UTF-8?q?Ajout=20de=20la=20gestion=20de=20l'=C3=A9tat=20?=
 =?UTF-8?q?de=20fermeture=20pour=20les=20alertes=20de=20traduction=20et=20?=
 =?UTF-8?q?encapsulation=20des=20dates=20dans=20des=20composants=20ClientO?=
 =?UTF-8?q?nly?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/post/Alert.vue | 10 ++++++++--
 app/pages/projects/index.vue  |  4 +++-
 app/pages/writings/index.vue  |  4 +++-
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/app/components/post/Alert.vue b/app/components/post/Alert.vue
index 86100ea..2b65d01 100644
--- a/app/components/post/Alert.vue
+++ b/app/components/post/Alert.vue
@@ -2,16 +2,22 @@
 const { t, locale } = useI18n({
   useScope: 'local',
 })
+
+const closed = ref(false)
 </script>
 
 <template>
   <UAlert
-    v-if="locale !== 'en'"
+    v-if="locale !== 'en' && !closed"
     :description="t('alert.description')"
     :title="t('alert.title')"
     color="red"
     icon="i-ph-warning-duotone"
-    variant="outline"
+    variant="soft"
+    :close="{
+      color: 'red',
+    }"
+    @update:open="closed = true"
   />
 </template>
 
diff --git a/app/pages/projects/index.vue b/app/pages/projects/index.vue
index 3a1c7d8..4bee3f0 100644
--- a/app/pages/projects/index.vue
+++ b/app/pages/projects/index.vue
@@ -66,7 +66,9 @@ const { data: projects } = await useAsyncData('all-projects', () => {
             <div
               class="text-sm text-neutral-500 duration-300 flex items-center gap-1"
             >
-              <p>{{ useDateFormat(project.publishedAt, 'DD MMM YYYY').value }} </p>
+              <ClientOnly>
+                <p>{{ useDateFormat(project.publishedAt, 'DD MMM YYYY').value }} </p>
+              </ClientOnly>
               <span class="w-2" />
               <div class="flex gap-2 flex-wrap">
                 <ClientOnly>
diff --git a/app/pages/writings/index.vue b/app/pages/writings/index.vue
index 9ff260b..c0d203b 100644
--- a/app/pages/writings/index.vue
+++ b/app/pages/writings/index.vue
@@ -61,7 +61,9 @@ const groupedWritings = computed(() => {
                 <div
                   class="text-sm text-neutral-500 duration-300 flex items-center gap-1"
                 >
-                  <p>{{ useDateFormat(writing.publishedAt, 'DD MMM').value }} </p>
+                  <ClientOnly>
+                    <p>{{ useDateFormat(writing.publishedAt, 'DD MMM').value }} </p>
+                  </ClientOnly>
                   <span>·</span>
                   <p>{{ writing.readingTime }}min</p>
                   <span class="w-2" />