补全翻译

src/app/(features)/memorize/FolderSelector.tsx

@@ -5,24 +5,26 @@ import { folder } from "../../../../generated/prisma/client";
 import { Folder } from "lucide-react";
 import { useRouter } from "next/navigation";
 import { Center } from "@/components/Center";
+import { useTranslations } from "next-intl";
 
 interface FolderSelectorProps {
   folders: (folder & { total_pairs: number })[];
 }
 
 const FolderSelector: React.FC<FolderSelectorProps> = ({ folders }) => {
+  const t = useTranslations("memorize/folder-selector");
   const router = useRouter();
   return (
     <Center>
       <Container className="p-6 gap-4 flex flex-col">
         {(folders.length === 0 && (
           <h1 className="text-2xl text-gray-900 font-light">
-            No folders found.
+            {t("noFolders")}
           </h1>
         )) || (
           <>
             <h1 className="text-2xl text-gray-900 font-light">
-              Select a folder:
+              {t("selectFolder")}
             </h1>
             <div className="text-gray-900 border border-gray-200 rounded-2xl max-h-96 overflow-y-auto">
               {folders.map((folder) => (
@@ -36,9 +38,12 @@ const FolderSelector: React.FC<FolderSelectorProps> = ({ folders }) => {
                   <Folder />
                   <div className="flex-1 flex gap-2">
                     <span className="group-hover:text-blue-500">
-                      {folder.id}. {folder.name}
+                      {t("folderInfo", {
+                        id: folder.id,
+                        name: folder.name,
+                        count: folder.total_pairs,
+                      })}
                     </span>
-                    <span>({folder.total_pairs})</span>
                   </div>
                 </div>
               ))}