fix: corriger la syntaxe et ajouter des retours à la ligne manquants dans plusieurs fichiers

app/components/AppFooter.vue

@@ -2,7 +2,7 @@
 import { socials } from '~~/types'
 
 const { t } = useI18n({
-  useScope: 'local',
+  useScope: 'local'
 })
 </script>
 
@@ -43,7 +43,7 @@ const { t } = useI18n({
     <div class="mt-8 w-full flex justify-center text-xs">
       {{
         t('copyright', {
-          date: new Date().getFullYear(),
+          date: new Date().getFullYear()
         })
       }}
     </div>

app/components/AppHeader.vue

@@ -7,16 +7,16 @@ const openContactDrawer = ref(false)
 const router = useRouter()
 defineShortcuts({
   c: () => openContactDrawer.value = !openContactDrawer.value,
-  backspace: () => router.back(),
+  backspace: () => router.back()
 })
 
 const socialsList = [
   {
     label: 'Email',
     icon: 'i-ph-envelope-duotone',
-    to: 'mailto:arthurdanjou@outlook.fr',
+    to: 'mailto:arthurdanjou@outlook.fr'
   },
-  ...socials,
+  ...socials
 ]
 </script>
 
@@ -58,14 +58,17 @@ const socialsList = [
           variant="ghost"
         />
       </UTooltip>
-      <USeparator orientation="vertical" class="h-6" />
+      <USeparator
+        orientation="vertical"
+        class="h-6"
+      />
       <UDropdownMenu
         v-model:open="openContactDrawer"
         :items="socialsList"
         :content="{
           align: 'center',
           side: 'bottom',
-          sideOffset: 8,
+          sideOffset: 8
         }"
       >
         <UTooltip
@@ -83,7 +86,10 @@ const socialsList = [
           />
         </UTooltip>
       </UDropdownMenu>
-      <USeparator orientation="vertical" class="h-6" />
+      <USeparator
+        orientation="vertical"
+        class="h-6"
+      />
       <LangSwitcher />
     </nav>
   </header>

app/components/AppTitle.vue

@@ -2,12 +2,12 @@
 defineProps({
   title: {
     type: String,
-    required: true,
+    required: true
   },
   description: {
     type: String,
-    required: true,
-  },
+    required: true
+  }
 })
 </script>
 

app/components/LangSwitcher.vue

@@ -18,7 +18,7 @@ async function changeLocale(newLocale: string) {
 }
 
 defineShortcuts({
-  l: () => lang.value = currentLocale.value!.code === 'en' ? 'fr' : currentLocale.value!.code === 'fr' ? 'es' : 'en',
+  l: () => lang.value = currentLocale.value!.code === 'en' ? 'fr' : currentLocale.value!.code === 'fr' ? 'es' : 'en'
 })
 </script>
 
@@ -33,7 +33,7 @@ defineShortcuts({
       :content="{
         align: 'center',
         side: 'right',
-        sideOffset: 8,
+        sideOffset: 8
       }"
     >
       <USelect

app/components/ThemeSwitcher.vue

@@ -21,7 +21,7 @@ function toggleDark(event: MouseEvent | { clientX: number, clientY: number }) {
   const y = event.clientY
   const endRadius = Math.hypot(
     Math.max(x, innerWidth - x),
-    Math.max(y, innerHeight - y),
+    Math.max(y, innerHeight - y)
   )
   const transition = document.startViewTransition(async () => {
     switchTheme()
@@ -31,27 +31,27 @@ function toggleDark(event: MouseEvent | { clientX: number, clientY: number }) {
     .then(() => {
       const clipPath = [
         `circle(0px at ${x}px ${y}px)`,
-        `circle(${endRadius}px at ${x}px ${y}px)`,
+        `circle(${endRadius}px at ${x}px ${y}px)`
       ]
       document.documentElement.animate(
         {
           clipPath: colorMode.value === 'dark'
             ? [...clipPath].reverse()
-            : clipPath,
+            : clipPath
         },
         {
           duration: 400,
           easing: 'ease-out',
           pseudoElement: colorMode.value === 'dark'
             ? '::view-transition-old(root)'
-            : '::view-transition-new(root)',
-        },
+            : '::view-transition-new(root)'
+        }
       )
     })
 }
 
 defineShortcuts({
-  t: () => toggleDark({ clientX: window.innerWidth, clientY: 0 }),
+  t: () => toggleDark({ clientX: window.innerWidth, clientY: 0 })
 })
 </script>
 

app/components/content/HoverText.vue

@@ -4,16 +4,16 @@ import type { PropType } from 'vue'
 defineProps({
   text: {
     type: [String, Number],
-    required: true,
+    required: true
   },
   hover: {
     type: String,
-    required: true,
+    required: true
   },
   position: {
     type: String as PropType<'top' | 'right' | 'bottom' | 'left'>,
-    default: 'top',
-  },
+    default: 'top'
+  }
 })
 </script>
 
@@ -25,11 +25,11 @@ defineProps({
       :content="{
         align: 'center',
         side: position,
-        sideOffset: 8,
+        sideOffset: 8
       }"
       :text="hover"
     >
       <strong class="leading-3 cursor-help">{{ text }}</strong>
     </UTooltip>
   </ClientOnly>
-</template>
+</template>

app/components/content/ProseIcon.vue

@@ -2,12 +2,12 @@
 defineProps({
   icon: {
     type: String,
-    required: true,
+    required: true
   },
   color: {
     type: String,
-    default: 'gray',
-  },
+    default: 'gray'
+  }
 })
 
 const colorVariants = {
@@ -23,13 +23,16 @@ const colorVariants = {
   zinc: 'text-zinc-500/80 decoration-zinc-400/40',
   orange: 'text-orange-500/80 decoration-orange-400/40',
   amber: 'text-amber-500/80 decoration-amber-400/40',
-  emerald: 'text-emerald-500/80 decoration-emerald-400/40',
+  emerald: 'text-emerald-500/80 decoration-emerald-400/40'
 }
 </script>
 
 <template>
   <span class="inline-flex items-center transform translate-y-1 gap-1">
-    <UIcon :name="icon" size="16" />
+    <UIcon
+      :name="icon"
+      size="16"
+    />
     <span
       :class="colorVariants[color as keyof typeof colorVariants]"
       class="sofia font-semibold underline-offset-2 underline"
@@ -37,4 +40,4 @@ const colorVariants = {
       <slot />
     </span>
   </span>
-</template>
+</template>

app/components/home/Activity.vue

@@ -45,7 +45,7 @@ type FormattedActivity = {
   state: string
   start: {
     ago: string
-    formatted: { date: string; time: string }
+    formatted: { date: string, time: string }
   }
 } | null
 
@@ -61,7 +61,7 @@ const formattedActivity = computed<FormattedActivity>(() => {
 
   const stateWord = (state && state.split(' ').length >= 2 ? state.split(' ')[1] : t('secret')) as string
   const ago = useTimeAgo(timestamps.start, {
-    messages: activityMessages[locale.value as keyof typeof activityMessages] as UseTimeAgoMessages,
+    messages: activityMessages[locale.value as keyof typeof activityMessages] as UseTimeAgoMessages
   }).value
 
   const formatDate = (date: number, format: string) =>
@@ -75,9 +75,9 @@ const formattedActivity = computed<FormattedActivity>(() => {
       ago,
       formatted: {
         date: formatDate(timestamps.start, 'DD MMM YYYY'),
-        time: formatDate(timestamps.start, 'HH:mm'),
-      },
-    },
+        time: formatDate(timestamps.start, 'HH:mm')
+      }
+    }
   }
 })
 
@@ -89,15 +89,28 @@ const editorIcon = computed(() => {
 
 <template>
   <ClientOnly>
-    <div v-if="formattedActivity" class="flex items-start gap-2 mt-4">
+    <div
+      v-if="formattedActivity"
+      class="flex items-start gap-2 mt-4"
+    >
       <UTooltip :text="isActive ? t('tooltip.online') : t('tooltip.idling')">
         <div class="relative flex h-3 w-3 mt-2">
-          <div v-if="isActive" class="animate-ping absolute inline-flex h-full w-full rounded-full bg-green-500 opacity-75" />
-          <div :class="isActive ? 'bg-green-500' : 'bg-amber-500'" class="relative inline-flex rounded-full h-3 w-3" />
+          <div
+            v-if="isActive"
+            class="animate-ping absolute inline-flex h-full w-full rounded-full bg-green-500 opacity-75"
+          />
+          <div
+            :class="isActive ? 'bg-green-500' : 'bg-amber-500'"
+            class="relative inline-flex rounded-full h-3 w-3"
+          />
         </div>
       </UTooltip>
 
-      <i18n-t v-if="isActive" keypath="working" tag="div">
+      <i18n-t
+        v-if="isActive"
+        keypath="working"
+        tag="div"
+      >
         <template #state>
           <strong>{{ formattedActivity.state.split(' ').map(w => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join(' ') }}</strong>
         </template>
@@ -106,7 +119,10 @@ const editorIcon = computed(() => {
         </template>
         <template #editor>
           <span class="space-x-1">
-            <UIcon :name="editorIcon" size="16" />
+            <UIcon
+              :name="editorIcon"
+              size="16"
+            />
             <strong>{{ formattedActivity.name }}</strong>
           </span>
         </template>
@@ -119,24 +135,41 @@ const editorIcon = computed(() => {
         </template>
       </i18n-t>
 
-      <i18n-t v-else keypath="idling" tag="div" class="space-x-1">
+      <i18n-t
+        v-else
+        keypath="idling"
+        tag="div"
+        class="space-x-1"
+      >
         <template #editor>
           <span class="space-x-1">
-            <UIcon :name="editorIcon" size="16" />
+            <UIcon
+              :name="editorIcon"
+              size="16"
+            />
             <strong>{{ formattedActivity.name }}</strong>
           </span>
         </template>
       </i18n-t>
     </div>
 
-    <div v-else class="my-5 flex md:items-start gap-2">
+    <div
+      v-else
+      class="my-5 flex md:items-start gap-2"
+    >
       <UTooltip :text="t('tooltip.offline')">
         <div class="relative flex h-3 w-3 mt-2">
           <div class="relative cursor-not-allowed inline-flex rounded-full h-3 w-3 bg-red-500" />
         </div>
       </UTooltip>
-      <i18n-t keypath="offline" tag="p" class="not-prose">
-        <template #maths><i>{{ t('maths') }}</i></template>
+      <i18n-t
+        keypath="offline"
+        tag="p"
+        class="not-prose"
+      >
+        <template #maths>
+          <i>{{ t('maths') }}</i>
+        </template>
       </i18n-t>
     </div>
   </ClientOnly>

app/components/home/CatchPhrase.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 const { width } = useWindowSize()
 const { t } = useI18n({
-  useScope: 'local',
+  useScope: 'local'
 })
 </script>
 

app/components/home/Link.vue

@@ -2,11 +2,11 @@
 defineProps({
   label: {
     type: String,
-    required: true,
+    required: true
   },
   href: {
     type: String,
-    required: true,
+    required: true
   },
   icon: {
     type: String,
@@ -14,8 +14,8 @@ defineProps({
   },
   blanked: {
     type: Boolean,
-    default: false,
-  },
+    default: false
+  }
 })
 </script>
 

app/components/home/Name.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 const styleVars = {
-  '--animated-speed': '50s',
+  '--animated-speed': '50s'
 }
 </script>
 

app/components/home/Quote.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 const { t } = useI18n({
-  useScope: 'local',
+  useScope: 'local'
 })
 </script>
 

app/components/home/Stats.vue

@@ -3,7 +3,7 @@ import type { Stats } from '~~/types'
 import { usePrecision } from '@vueuse/math'
 
 const { locale, locales, t } = useI18n({
-  useScope: 'local',
+  useScope: 'local'
 })
 const currentLocale = computed(() => locales.value.find(l => l.code === locale.value))