richard/mini-game-ai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 修复服务端渲染时的翻译不匹配问题

Browse Source
This commit is contained in:
richarjiang
2026-01-24 16:38:47 +08:00
parent e2280b12e2
commit b7402edf6a
11 changed files with 319 additions and 184 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/components/layout/Footer.tsx
View File

@@ -2,26 +2,34 @@
import Link from "next/link";
import { Sparkles, Github, Twitter } from "lucide-react";
import { useTranslation } from "@/lib/i18n";
import { useTranslation, getServerTranslations } from "@/lib/i18n";
import { useState, useEffect } from "react";
function useFooterLinks() {
const [mounted, setMounted] = useState(false);
useEffect(() => setMounted(true), []);
const { t } = useTranslation();
const getT = (key: string) => {
if (!mounted) return getServerTranslations("en").t(key);
return t(key);
};
return {
product: [
{ name: t("common.features"), href: "/features" },
{ name: t("nav.pricing"), href: "/pricing" },
{ name: getT("common.features"), href: "/features" },
{ name: getT("nav.pricing"), href: "/pricing" },
{ name: "API", href: "/api" },
{ name: t("nav.docs"), href: "/docs" },
{ name: getT("nav.docs"), href: "/docs" },
],
tools: [
{ name: t("sidebar.videoToFrames"), href: "/tools/video-frames" },
{ name: t("sidebar.imageCompression"), href: "/tools/image-compress" },
{ name: t("sidebar.audioCompression"), href: "/tools/audio-compress" },
{ name: t("home.tools.aiTools.title"), href: "/tools/ai-tools" },
{ name: getT("sidebar.videoToFrames"), href: "/tools/video-frames" },
{ name: getT("sidebar.imageCompression"), href: "/tools/image-compress" },
{ name: getT("sidebar.audioCompression"), href: "/tools/audio-compress" },
{ name: getT("home.tools.aiTools.title"), href: "/tools/ai-tools" },
],
company: [
{ name: t("nav.about"), href: "/about" },
{ name: getT("nav.about"), href: "/about" },
{ name: "Blog", href: "/blog" },
{ name: "Careers", href: "/careers" },
{ name: "Contact", href: "/contact" },
@@ -47,9 +55,16 @@ const sectionTitles: Record<string, string> = {
};
export function Footer() {
const [mounted, setMounted] = useState(false);
useEffect(() => setMounted(true), []);
const { t } = useTranslation();
const footerLinks = useFooterLinks();
const getT = (key: string) => {
if (!mounted) return getServerTranslations("en").t(key);
return t(key);
};
return (
<footer className="border-t border-border/40 bg-background/50">
<div className="container py-12 md:py-16">
@@ -60,10 +75,10 @@ export function Footer() {
<div className="flex h-8 w-8 items-center justify-center rounded-lg bg-primary">
<Sparkles className="h-5 w-5 text-primary-foreground" />
</div>
<span className="text-xl font-bold">{t("common.appName")}</span>
<span className="text-xl font-bold">{getT("common.appName")}</span>
</Link>
<p className="mt-4 text-sm text-muted-foreground">
{t("footer.tagline")}
{getT("footer.tagline")}
</p>
</div>
@@ -139,7 +154,7 @@ export function Footer() {
{/* Bottom section */}
<div className="mt-12 flex flex-col items-center justify-between border-t border-border/40 pt-8 md:flex-row">
<p className="text-sm text-muted-foreground">
© {new Date().getFullYear()} {t("common.appName")}. All rights reserved.
© {new Date().getFullYear()} {getT("common.appName")}. All rights reserved.
</p>
<div className="mt-4 flex space-x-6 md:mt-0">
{socialLinks.map((link) => {