feat: implement internationalization for theme modal and resume title handling

Author: JOYCEQL

src/components/shared/ThemeModal.tsx

@@ -2,6 +2,7 @@
 
 import { useState } from "react";
 import { motion } from "framer-motion";
+import { useTranslations } from "next-intl";
 import {
   AlertDialog,
   AlertDialogAction,
@@ -10,7 +11,7 @@ import {
   AlertDialogDescription,
   AlertDialogFooter,
   AlertDialogHeader,
-  AlertDialogTitle
+  AlertDialogTitle,
 } from "@/components/ui/alert-dialog";
 
 interface ThemedAlertDialogProps {
@@ -24,23 +25,24 @@ const ThemeModal = ({
   isOpen,
   onClose,
   onConfirm,
-  title
+  title,
 }: ThemedAlertDialogProps) => {
   const [isHovered, setIsHovered] = useState(false);
+  const t = useTranslations("themeModal.delete");
 
   const modalContent = {
     delete: {
-      title: "确定要删除吗",
+      title: t("title"),
       description: (
         <>
           <span>
-            您确定要删除
+            {t.raw("description").split("{title}")[0]}
             <span className="px-2 font-semibold text-primary">{title}</span>
           </span>
-          吗？
+          {t.raw("description").split("{title}")[1]}
         </>
       ),
-      confirmText: "删除",
+      confirmText: t("confirmText"),
       illustration: (
         <svg
           className="h-32 w-32"
@@ -70,8 +72,8 @@ const ThemeModal = ({
             strokeLinecap="round"
           />
         </svg>
-      )
-    }
+      ),
+    },
   };
 
   const content = modalContent["delete"];
@@ -110,7 +112,7 @@ const ThemeModal = ({
 
             <AlertDialogFooter className="mt-8 flex w-full gap-4 sm:flex-row">
               <AlertDialogCancel className="flex-1 rounded-full dark:bg-gray-800 dark:text-neutral-200  text-base font-semibold text-gray-800 ">
-                取消
+                {t("cancelText")}
               </AlertDialogCancel>
               <AlertDialogAction
                 onClick={onConfirm}

src/i18n/locales/en.json

@@ -5,7 +5,9 @@
     "description": "Magic Resume is an open source resume editor, free, privacy-first. No registration required, all data stored locally, support data backup and export, ensuring your resume data is always available.",
     "dashboard": "Dashboard",
     "edit": "Edit",
-    "delete": "Delete"
+    "delete": "Delete",
+    "newResume": "New Resume",
+    "copy": "Copy"
   },
   "home": {
     "header": {
@@ -615,5 +617,13 @@
   },
   "templates": {
     "switchTemplate": "Switch Template"
+  },
+  "themeModal": {
+    "delete": {
+      "title": "Confirm Deletion",
+      "description": "Are you sure you want to delete {title}?",
+      "confirmText": "Delete",
+      "cancelText": "Cancel"
+    }
   }
 }

src/i18n/locales/zh.json

@@ -5,7 +5,9 @@
     "description": "魔方简历是一款开源的简历编辑器，免费，隐私优先。无需注册登录，数据完全存储在本地，支持数据导出备份，确保您的简历数据随时可用。",
     "dashboard": "仪表盘",
     "edit": "编辑",
-    "delete": "删除"
+    "delete": "删除",
+    "newResume": "新建简历",
+    "copy": "复制"
   },
   "home": {
     "header": {
@@ -617,5 +619,13 @@
   },
   "templates": {
     "switchTemplate": "切换模板"
+  },
+  "themeModal": {
+    "delete": {
+      "title": "确定要删除吗",
+      "description": "您确定要删除{title}吗？",
+      "confirmText": "删除",
+      "cancelText": "取消"
+    }
   }
 }

src/store/useResumeStore.ts

@@ -136,7 +136,10 @@ export const useResumeStore = create(
           createdAt: new Date().toISOString(),
           updatedAt: new Date().toISOString(),
           templateId: template?.id,
-          title: `新建简历 ${id.slice(0, 6)}`,
+          title: `${locale === "en" ? "New Resume" : "新建简历"} ${id.slice(
+            0,
+            6
+          )}`,
         };
 
         set((state) => ({
@@ -227,10 +230,22 @@ export const useResumeStore = create(
       duplicateResume: (resumeId) => {
         const newId = generateUUID();
         const originalResume = get().resumes[resumeId];
+
+        // 获取当前语言环境
+        const locale =
+          typeof document !== "undefined"
+            ? document.cookie
+                .split("; ")
+                .find((row) => row.startsWith("NEXT_LOCALE="))
+                ?.split("=")[1] || "zh"
+            : "zh";
+
         const duplicatedResume = {
           ...originalResume,
           id: newId,
-          title: `${originalResume.title} (复制)`,
+          title: `${originalResume.title} (${
+            locale === "en" ? "Copy" : "复制"
+          })`,
           createdAt: new Date().toISOString(),
           updatedAt: new Date().toISOString(),
         };