temp

frontend/app/pages/index.vue

@@ -1,9 +1,11 @@
 <script setup lang="ts">
 import type { ArticleSummary, Paginated } from '#shared/types/blog'
 
+const { locale, t } = useLocale()
+
 const { data, error } = await useFetch<Paginated<ArticleSummary>>('/api/articles', {
-  key: 'home-articles',
-  query: { page: 1 },
+  key: () => `home-articles-${locale.value}`,
+  query: { page: 1, lang: locale },
 })
 
 const featured = computed(() => data.value?.items[0] ?? null)
@@ -20,9 +22,9 @@ useHead({ titleTemplate: '%s', link: [{ rel: 'canonical', href: canonical }] })
 
 useSeoMeta({
   title: SITE_NAME,
-  description: 'Articoli, guide e analisi.',
+  description: () => t('tagline'),
   ogTitle: SITE_NAME,
-  ogDescription: 'Articoli, guide e analisi.',
+  ogDescription: () => t('tagline'),
   ogType: 'website',
   ogUrl: canonical,
   ogImage: `${config.siteUrl}/logo.png`,
@@ -67,9 +69,9 @@ useSeoMeta({
       </div>
     </section>
 
-    <p v-if="error">Non è stato possibile caricare gli articoli. Riprova più tardi.</p>
+    <p v-if="error">{{ t('loadError') }}</p>
 
-    <p v-else-if="!featured">Non è stato ancora pubblicato nulla.</p>
+    <p v-else-if="!featured">{{ t('noArticlesYet') }}</p>
 
     <template v-else>
       <article class="featured" :class="{ 'has-cover': featuredCover }">
@@ -90,26 +92,26 @@ useSeoMeta({
 
         <div class="featured-text">
           <p class="kicker">
-            {{ featured.category ? featured.category.name : 'Ultimo' }}
+            {{ featured.category ? featured.category.name : t('latestFallback') }}
           </p>
           <h2>
             <NuxtLink :to="`/blog/${featured.slug}`">{{ featured.title }}</NuxtLink>
           </h2>
           <p class="kicker date">
             <time :datetime="isoDate(featured.publishedAt)">
-              {{ formatDate(featured.publishedAt) }}
+              {{ formatDate(featured.publishedAt, locale) }}
             </time>
           </p>
           <p class="read-more">
             <NuxtLink :to="`/blog/${featured.slug}`">
-              Leggi l'articolo
+              {{ t('readArticle') }}
             </NuxtLink>
           </p>
         </div>
       </article>
 
       <p class="more">
-        <NuxtLink to="/blog">Vedi tutti gli articoli</NuxtLink>
+        <NuxtLink to="/blog">{{ t('seeAllArticles') }}</NuxtLink>
       </p>
     </template>
   </div>