feat: add internationalization support with next-intl

app/components/auth/sign-button.tsx

@@ -5,6 +5,7 @@ import Image from "next/image"
 import { signOut, useSession } from "next-auth/react"
 import { LogIn } from "lucide-react"
 import { useRouter } from 'next/navigation'
+import { useTranslations, useLocale } from "next-intl"
 import Link from "next/link"
 import { cn } from "@/lib/utils"
 
@@ -14,7 +15,9 @@ interface SignButtonProps {
 
 export function SignButton({ size = "default" }: SignButtonProps) {
   const router = useRouter()
+  const locale = useLocale()
   const { data: session, status } = useSession()
+  const t = useTranslations("auth.signButton")
   const loading = status === "loading"
 
   if (loading) {
@@ -23,9 +26,9 @@ export function SignButton({ size = "default" }: SignButtonProps) {
 
   if (!session?.user) {
     return (
-      <Button onClick={() => router.push('/login')} className={cn("gap-2", size === "lg" ? "px-8" : "")} size={size}>
+      <Button onClick={() => router.push(`/${locale}/login`)} className={cn("gap-2", size === "lg" ? "px-8" : "")} size={size}>
         <LogIn className={size === "lg" ? "w-5 h-5" : "w-4 h-4"} />
-        登录/注册
+        {t("login")}
       </Button>
     )
   }
@@ -33,13 +36,13 @@ export function SignButton({ size = "default" }: SignButtonProps) {
   return (
     <div className="flex items-center gap-4">
       <Link 
-        href="/profile"
+        href={`/${locale}/profile`}
         className="flex items-center gap-2 hover:opacity-80 transition-opacity"
       >
         {session.user.image && (
           <Image
             src={session.user.image}
-            alt={session.user.name || "用户头像"}
+            alt={session.user.name || t("userAvatar")}
             width={24}
             height={24}
             className="rounded-full"
@@ -47,8 +50,8 @@ export function SignButton({ size = "default" }: SignButtonProps) {
         )}
         <span className="text-sm">{session.user.name}</span>
       </Link>
-      <Button onClick={() => signOut({ callbackUrl: "/" })} variant="outline" className={cn("flex-shrink-0", size === "lg" ? "px-8" : "")} size={size}>
-        登出
+      <Button onClick={() => signOut({ callbackUrl: `/${locale}` })} variant="outline" className={cn("flex-shrink-0", size === "lg" ? "px-8" : "")} size={size}>
+        {t("logout")}
       </Button>
     </div>
   )