feat: i18n 切换

app/[lng]/page.tsx

@@ -12,6 +12,7 @@ import SettingsLink from "@/components/SettingsLink";
 import PaperManagementWrapper from "@/components/PaperManagementWrapper";
 //i18n
 import { useTranslation } from "@/app/i18n";
+import { FooterBase } from "@/components/Footer/FooterBase";
 import { IndexProps } from "@/utils/global";
 
 // import Error from "@/app/global-error";
@@ -47,16 +48,19 @@ export default async function Index({ params: { lng } }: IndexProps) {
       <PaperManagementWrapper lng={lng} />
       <QuillWrapper lng={lng} />
       <footer className="w-full border-t border-t-foreground/10 p-8 flex justify-center text-center text-xs">
-        <p>
+        <div className="flex items-center space-x-4">
+          {" "}
+          {/* 添加flex容器来水平排列子元素 */}
           <a
             href="https://github.com/14790897/paper-ai"
             target="_blank"
-            className="font-bold hover:underline"
+            className="font-bold text-blue-600 hover:underline hover:text-blue-800"
             rel="noreferrer"
           >
             {t("give me a star in GitHub")}
           </a>
-        </p>
+          <FooterBase t={t} lng={lng} />
+        </div>
       </footer>
     </div>
   );

components/Footer/FooterBase.js

@@ -0,0 +1,25 @@
+import Link from "next/link";
+import { Trans } from "react-i18next/TransWithoutContext";
+import { languages } from "@/app/i18n/settings";
+
+export const FooterBase = ({ t, lng }) => {
+  return (
+    <div>
+      {/* <footer style={{ marginTop: 50 }}> */}
+      <Trans i18nKey="languageSwitcher" t={t}>
+        Language Manager:Switch from <strong>{{ lng }}</strong> to:{" "}
+      </Trans>
+      {languages
+        .filter((l) => lng !== l)
+        .map((l, index) => {
+          return (
+            <span key={l}>
+              {index > 0 && " or "}
+              <Link href={`/${l}`}>{l}</Link>
+            </span>
+          );
+        })}
+      {/* </footer> */}
+    </div>
+  );
+};

components/Footer/index.js

@@ -0,0 +1,25 @@
+import Link from "next/link";
+import { Trans } from "react-i18next/TransWithoutContext";
+import { languages } from "../../../i18n/settings";
+import { useTranslation } from "../../../i18n";
+
+export const Footer = async ({ lng }) => {
+  const { t } = await useTranslation(lng, "footer");
+  return (
+    <footer style={{ marginTop: 50 }}>
+      <Trans i18nKey="languageSwitcher" t={t}>
+        Switch from <strong>{{ lng }}</strong> to:{" "}
+      </Trans>
+      {languages
+        .filter((l) => lng !== l)
+        .map((l, index) => {
+          return (
+            <span key={l}>
+              {index > 0 && " or "}
+              <Link href={`/${l}`}>{l}</Link>
+            </span>
+          );
+        })}
+    </footer>
+  );
+};