From ad258cdbfe50130a2965417f18ed2c9b08a14809 Mon Sep 17 00:00:00 2001
From: "Taegeon Go (Alan)" <tae.gun7784@gmail.com>
Date: Tue, 7 May 2024 20:54:59 +0900
Subject: [PATCH 1/4] Update blog index page to fetch posts with default
 parameters if no posts are returned

---
 pages/blog/index.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/pages/blog/index.vue b/pages/blog/index.vue
index 084a9dbb..14c3326f 100644
--- a/pages/blog/index.vue
+++ b/pages/blog/index.vue
@@ -27,10 +27,14 @@
 import { meta } from '@/data/meta'
 import { getPosts } from '@/components/blog'
 
-const posts = await getPosts()
+let posts = await getPosts()
 const route = useRoute()
 const { t } = useI18n()
 
+if (posts.length === 0) {
+  posts = await getPosts('', 'page: 1, pageSize: 100', 'en')
+}
+
 const seoTitle = `${t('blog.title')} | ${meta.siteName} - ${t('meta.tagline')}`
 const seoDescription = t('blog.description')
 const seoUrl = `${meta.url}${route.fullPath}`

From eaee8e3d1ab63d589c4b05d5a6cb9b971467f511 Mon Sep 17 00:00:00 2001
From: "Taegeon Go (Alan)" <tae.gun7784@gmail.com>
Date: Tue, 7 May 2024 20:56:20 +0900
Subject: [PATCH 2/4] Update ArticleCard.vue to use localePath for generating
 the href

---
 components/blog/ArticleCard.vue | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/components/blog/ArticleCard.vue b/components/blog/ArticleCard.vue
index e94460f9..8d06eea6 100644
--- a/components/blog/ArticleCard.vue
+++ b/components/blog/ArticleCard.vue
@@ -1,7 +1,7 @@
 <template>
   <!-- post.slug is the slug of the article -->
   <NuxtLink
-    :href="blog ? i18n + '/blog/' + post.slug : post.link"
+    :href="blog ? localePath(`/blog/${post.slug}`) : post.link"
     :target="!blog && post.link.includes('https') ? '_blank' : '_self'"
     class="rounded-md bg-white/50 group transition h-full shadow-lg flex items-center justify-center overflow-hidden before:absolute before:h-0 before:w-0 before:rounded-full before:duration-300 before:ease-out hover:before:h-[600px] hover:before:w-[600px] before:bg-slate-50 relative"
   >
@@ -42,10 +42,9 @@
 
 <script setup lang="ts">
 import { ArrowRightIcon } from '@heroicons/vue/24/outline'
-const { locale } = useI18n()
-const i18n = locale.value === 'ja' ? '/ja' : ''
+const localePath = useLocalePath()
 
-const props = defineProps({
+defineProps({
   post: {
     type: Object,
     default: null,

From 9a98d66935ab60fa94d0f0d70fbeddad92e17656 Mon Sep 17 00:00:00 2001
From: "Taegeon Go (Alan)" <tae.gun7784@gmail.com>
Date: Tue, 7 May 2024 20:58:13 +0900
Subject: [PATCH 3/4] add custom locale to get posts with other locales

---
 components/blog/index.ts | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/components/blog/index.ts b/components/blog/index.ts
index 36fe4b45..05e13caa 100644
--- a/components/blog/index.ts
+++ b/components/blog/index.ts
@@ -7,9 +7,10 @@ import plugin from 'markdown-it-named-headings'
 export async function getPosts(
   filters: string = '',
   pagination: string = 'page: 1, pageSize: 100',
+  customLocale?: string,
 ) {
   const { $i18n } = useNuxtApp()
-  const locale = $i18n.locale
+  const locale = customLocale ?? $i18n.locale.value
   const md = new MarkdownIt().use(plugin)
   const strapiUrl = 'https://community.astar.network'
 
@@ -18,7 +19,7 @@ export async function getPosts(
       posts(
           filters: { ${filters} }
           pagination: { ${pagination} }
-          locale: "${locale.value}"
+          locale: "${locale}"
           sort: "publishedAt:DESC"
       ) {
         data {

From 7f3deb27848cebd026e15a71386dc45b74e85163 Mon Sep 17 00:00:00 2001
From: "Taegeon Go (Alan)" <tae.gun7784@gmail.com>
Date: Tue, 7 May 2024 20:58:23 +0900
Subject: [PATCH 4/4] Update blog post fetching logic to handle custom locales

---
 pages/blog/[slug].vue | 125 ++++++++++++++++++++++--------------------
 1 file changed, 66 insertions(+), 59 deletions(-)

diff --git a/pages/blog/[slug].vue b/pages/blog/[slug].vue
index 79fe9ea9..0ea62958 100644
--- a/pages/blog/[slug].vue
+++ b/pages/blog/[slug].vue
@@ -128,68 +128,75 @@ if (!isNumeric(id)) {
 else {
   const fetchData = async () => {
     const filter = `id: { eq: "${id}" }`
-    const fetchedPosts = await getPosts(filter)
-
-    if (fetchedPosts && fetchedPosts.length > 0) {
-      post.value = fetchedPosts[0] as unknown as Post // Cast to Post
-      console.log(`tags|${post.value.tags}|${post.value.tags.length}|`)
-
-      if (post.value) {
-        const orConditions = post.value.tags
-          .map(tag => `{ tags: { containsi: "${tag}" } }`)
-          .join(', ')
-
-        const filters = `id: { ne: "${id}" } and: { or: [${orConditions}] }`
-        const pagination = 'limit: 6'
-        posts.value = (await getPosts(filters, pagination)) as unknown as Post[]
-
-        const seoTitle = `${post.value.title} | ${meta.siteName}`
-        const seoDescription = post.value.summary
-        const seoUrl = `${meta.url}${route.fullPath}`
-
-        let twitterId = socialUrl.twitter.global.id
-        if (locale.value === 'ja') {
-          twitterId = socialUrl.twitter.japan.id
-        }
-        else if (locale.value === 'ko') {
-          twitterId = socialUrl.twitter.korea.id
-        }
-
-        useServerSeoMeta({
-          title: () => seoTitle,
-          description: () => seoDescription,
-          author: () => 'Astar Network Team',
-          ogSiteName: () => 'Astar Network',
-          ogLocale: () => locale.value,
-          ogTitle: () => seoTitle,
-          ogDescription: () => seoDescription,
-          ogImage: () => post.value?.image,
-          ogImageUrl: () => post.value?.image,
-          ogType: () => 'article',
-          ogUrl: () => seoUrl,
-          twitterSite: () => twitterId,
-          twitterCard: () => 'summary_large_image',
-          twitterTitle: () => seoTitle,
-          twitterDescription: () => seoDescription,
-          twitterImage: () => post.value?.image,
-        })
-
-        useSchemaOrg([
-          defineArticle({
-            author: {
-              name: 'Astar Network Team',
-            },
-          }),
-        ])
-
-        definePageMeta({
-          layout: false,
-        })
-      }
+
+    const localedPosts = await getPosts(filter)
+
+    if (localedPosts && localedPosts.length > 0) {
+      post.value = localedPosts[0] as unknown as Post
     }
     else {
-      router.push('/blog')
+      const defaultPosts = await getPosts(filter, '', 'en')
+
+      if (defaultPosts && defaultPosts.length > 0) {
+        post.value = defaultPosts[0] as unknown as Post
+      }
+    }
+
+    if (!post.value) {
+      router.back()
+      return
     }
+
+    const orConditions = post.value.tags
+      .map(tag => `{ tags: { containsi: "${tag}" } }`)
+      .join(', ')
+
+    const filters = `id: { ne: "${id}" } and: { or: [${orConditions}] }`
+    const pagination = 'limit: 6'
+    posts.value = (await getPosts(filters, pagination)) as unknown as Post[]
+
+    const seoTitle = `${post.value.title} | ${meta.siteName}`
+    const seoDescription = post.value.summary
+    const seoUrl = `${meta.url}${route.fullPath}`
+
+    let twitterId = socialUrl.twitter.global.id
+    if (locale.value === 'ja') {
+      twitterId = socialUrl.twitter.japan.id
+    }
+    else if (locale.value === 'ko') {
+      twitterId = socialUrl.twitter.korea.id
+    }
+
+    useServerSeoMeta({
+      title: () => seoTitle,
+      description: () => seoDescription,
+      author: () => 'Astar Network Team',
+      ogSiteName: () => 'Astar Network',
+      ogLocale: () => locale.value,
+      ogTitle: () => seoTitle,
+      ogDescription: () => seoDescription,
+      ogImage: () => post.value?.image,
+      ogImageUrl: () => post.value?.image,
+      ogType: () => 'article',
+      ogUrl: () => seoUrl,
+      twitterSite: () => twitterId,
+      twitterCard: () => 'summary_large_image',
+      twitterTitle: () => seoTitle,
+      twitterDescription: () => seoDescription,
+      twitterImage: () => post.value?.image,
+    })
+
+    useSchemaOrg([
+      defineArticle({
+        author: {
+          name: 'Astar Network Team',
+        },
+      }),
+    ])
+
+    definePageMeta({
+      layout: false,
+    })
   }
 
   fetchData()