feat: topic i18n

data/topics.json

@@ -7,8 +7,8 @@
     ]
   },
   {
-    "name": "ChatGPT",
-    "description": "The world is undergoing a fusion, and we are in the center of it.",
+    "name": "Artificial Intelligence",
+    "description": "The world is undergoing changes, and we are at the center of it.",
     "includeKeywords": [
       "GPT",
       "Midjourney",

src/app/(home)/topic/[topic]/page.tsx

@@ -3,6 +3,7 @@ import { Metadata } from "next"
 import { HomeFeed } from "~/components/home/HomeFeed"
 import { HomeSidebar } from "~/components/home/HomeSidebar"
 import { APP_NAME } from "~/lib/env"
+import { useTranslation } from "~/lib/i18n"
 
 import topics from "../../../../../data/topics.json"
 
@@ -19,13 +20,14 @@ export function generateMetadata({
   }
 }
 
-function Topic({
+export default async function Topic({
   params,
 }: {
   params: {
     topic: string
   }
 }) {
+  const { t } = await useTranslation("index")
   params.topic = decodeURIComponent(params.topic)
   const info = topics.find((t) => t.name === params.topic)
 
@@ -33,8 +35,13 @@ function Topic({
     <section className="pt-24">
       <div className="max-w-screen-lg px-5 mx-auto flex">
         <div className="flex-1 min-w-[300px]">
-          <h2 className="text-4xl font-bold mb-4">Topic: {params.topic}</h2>
-          <p className="text-zinc-400 mb-6">{info?.description}</p>
+          <h2 className="text-4xl font-bold mb-4">{t(params.topic)}</h2>
+          <p className="text-zinc-400 mb-2">{t(info?.description || "")}</p>
+          {info?.includeKeywords?.length || 0 > 0 ? (
+            <p className="text-zinc-400 mb-6">
+              {t("Topic Keywords")}: {info?.includeKeywords?.join(", ")}
+            </p>
+          ) : null}
           <HomeFeed type="topic" noteIds={info?.notes} />
         </div>
         <HomeSidebar />
@@ -42,5 +49,3 @@ function Topic({
     </section>
   )
 }
-
-export default Topic

src/components/home/HomeFeed.tsx

@@ -248,10 +248,6 @@ export const HomeFeed: React.FC<{
   if (params.topic) {
     params.topic = decodeURIComponent(params.topic)
   }
-  console.log(
-    params.topic,
-    topics.find((t) => t.name === params.topic)?.includeKeywords,
-  )
 
   const feed = useGetFeed({
     type,
@@ -375,7 +371,8 @@ export const HomeFeed: React.FC<{
                           key={`${post.characterId}-${post.noteId}`}
                           post={post}
                           previousPost={
-                            type === "latest" && index >= 1
+                            (type === "latest" || type === "topic") &&
+                            index >= 1
                               ? array[index - 1]
                               : undefined
                           }

src/components/home/HomeSidebar.tsx

@@ -32,9 +32,9 @@ export function HomeSidebar({ hideSearch }: { hideSearch?: boolean }) {
                   href={`/topic/${topic.name}`}
                   className="flex flex-col sm:hover:bg-hover px-4 py-2 -mx-4 rounded-lg transition-colors"
                 >
-                  <span className="font-medium">{topic.name}</span>
+                  <span className="font-medium">{t(topic.name)}</span>
                   <span className="text-zinc-400 text-sm">
-                    {topic.description}
+                    {t(topic.description)}
                   </span>
                 </UniLink>
               </li>

src/lib/i18n/locales/zh/index.json

@@ -57,5 +57,13 @@
   "xLog's open design allows it to integrate with many other open protocols and applications without friction.": "xLog 的开放式设计使其能够与许多其他开放协议和应用程序无缝集成，没有任何限制。",
   "Dashboard": "仪表盘",
   "Suggested creators for you": "为你推荐的创作者",
-  "Hot Topics": "热门话题"
+  "Hot Topics": "热门话题",
+  "Topic Keywords" : "话题关键词",
+  "Let's talk about xLog, whether to praise or criticize it." : "让我们来谈谈 xLog，无论赞美和批评。",
+  "Artificial Intelligence": "人工智能",
+  "The world is undergoing changes, and we are at the center of it.": "世界正在发生变革，而我们正处其中心。",
+  "Life Journal": "生活日记",
+  "Discover new perspectives and insights in others' weekly, monthly, or yearly journal.": "在别人的周月年记中发现新观点和见解。",
+  "Fiction": "虚构小说",
+  "Experience a world of imagination through these fiction stories." : "体验一个充满想象力的虚构世界。"
 }