Merge pull request #131 from JohnsonMao/refactor/i18n-metadata

🌐 modify i18n metadata and refactor architectural

data/i18n/locales/en.json

@@ -1,5 +1,6 @@
 {
   "common": {
+    "title": "Mao's Corner",
     "home": "Home",
     "posts": "Posts",
     "about": "About",
@@ -9,12 +10,12 @@
     "morePosts": "More Posts"
   },
   "homePage": {
-    "title": "Mao's Corner",
-    "description": "Welcome to Mao's Learning Corner, where I document my study notes. Looking forward to exploring the vast realms of knowledge together with you."
+    "title": "Hi! I'm Mao, a frontend engineer.",
+    "description": "Welcome to Mao's Corner, where I document my learning notes."
   },
   "postsPage": {
-    "title": "Mao's Corner",
-    "description": "Welcome to Mao's Learning Corner, where I document my study notes. Looking forward to exploring the vast realms of knowledge together with you."
+    "title": "Welcome to visit my posts!",
+    "description": "If you have any questions or thoughts about any content, please feel free to share in the comments section. I look forward to engaging in conversation and discussion with you."
   },
   "notFound": {
     "message": "Sorry we couldn't find this page."

data/i18n/locales/zh.json

@@ -1,5 +1,6 @@
 {
   "common": {
+    "title": "Mao's Corner",
     "home": "首頁",
     "posts": "文章",
     "about": "關於",
@@ -9,12 +10,12 @@
     "morePosts": "更多文章"
   },
   "homePage": {
-    "title": "Mao's Corner",
-    "description": "歡迎來到阿毛的學習角落，這裡記錄著我的學習筆記，期待與你一同探索廣闊的知識領域。"
+    "title": "嗨！我是阿毛，是一位前端工程師。",
+    "description": "歡迎來到阿毛的角落，這裡記錄著我學習的筆記。"
   },
   "postsPage": {
-    "title": "Mao's Corner",
-    "description": "歡迎來到阿毛的學習角落，這裡記錄著我的學習筆記，期待與你一同探索廣闊的知識領域。"
+    "title": "歡迎參觀我的文章！",
+    "description": "如果你對任何內容有疑問或想法，請隨時在留言區分享，我期待與你進行交流和討論。"
   },
   "notFound": {
     "message": "抱歉！找不到此頁面。"

data/metadata.ts

@@ -13,12 +13,13 @@ export async function createMetadata(
   locale: Locale = defaultLocale
 ): Promise<Metadata> {
   const {
-    homePage: { title, description },
+    common: { title },
+    homePage: { description },
   } = await getDictionary(locale);
 
   return {
     title: {
-      template: `%s | ${title}`,
+      template: `%s - ${title}`,
       default: title,
     },
     description,

src/app/[lang]/page.tsx → src/app/[lang]/(home)/page.tsx

@@ -6,7 +6,7 @@ import { H1 } from '@/components/Heading';
 import List from '@/components/List';
 import { getAllDataFrontmatter } from '@/utils/mdx';
 
-import type { RootParams } from './layout';
+import type { RootParams } from '../layout';
 import Article from './Article';
 
 export async function generateMetadata({

src/app/[lang]/layout.tsx

@@ -19,12 +19,12 @@ export async function generateMetadata({
   params: { lang },
 }: RootParams): Promise<Metadata> {
   const { alternates } = await createMetadata(lang);
-  const { homePage } = await getDictionary(lang);
-  const { title } = homePage;
+  const { common } = await getDictionary(lang);
+  const { title } = common;
 
   return {
     title: {
-      template: `%s | ${title}`,
+      template: `%s - ${title}`,
       default: title,
     },
     alternates: {

src/app/[lang]/posts/InfiniteList.tsx

@@ -5,7 +5,7 @@ import { useSearchParams } from 'next/navigation';
 import Link from '@/components/Link';
 import List from '@/components/List';
 import { clamp } from '@/utils/math';
-import Article from '../Article';
+import Article from '../(home)/Article';
 
 type InfiniteListProps = {
   items: DataFrontmatter[];

tests/app/[lang]/card.test.tsx

@@ -1,7 +1,7 @@
 import { render, screen } from '@testing-library/react';
 
 import { formatDate } from '@/utils/date';
-import Article from '@/app/[lang]/Article';
+import Article from '@/app/[lang]/(home)/Article';
 
 describe('Article component', () => {
   it('should render correct element', () => {

tests/app/[lang]/page.test.tsx

@@ -1,6 +1,6 @@
 import { render, screen } from '@testing-library/react';
 import en from '~/data/i18n/locales/en.json';
-import Page, { generateMetadata } from '@/app/[lang]/page';
+import Page, { generateMetadata } from '@/app/[lang]/(home)/page';
 
 jest.mock('@/utils/mdx', () => ({
   getAllDataFrontmatter: () => [],