feat: add i18n for customize toolbar (#2592)

apps/renderer/src/modules/customize-toolbar/modal.tsx

@@ -24,6 +24,7 @@ import { DEFAULT_ACTION_ORDER } from "./constant"
 import { DroppableContainer, SortableActionButton } from "./dnd"
 
 const CustomizeToolbar = () => {
+  const { t } = useTranslation("settings")
   const actionOrder = useUISettingSelector((s) => s.toolbarOrder)
 
   const sensors = useSensors(
@@ -79,8 +80,8 @@ const CustomizeToolbar = () => {
   return (
     <div className="mx-auto w-full max-w-[800px] space-y-4">
       <div className="mb-4">
-        <h2 className="text-lg font-semibold">Quick Actions</h2>
-        <p className="text-sm text-gray-500">Customize and reorder your frequently used actions</p>
+        <h2 className="text-lg font-semibold">{t("customizeToolbar.quick_actions.title")}</h2>
+        <p className="text-sm text-gray-500">{t("customizeToolbar.quick_actions.description")}</p>
       </div>
       {/* Refer to https://github.com/clauderic/dnd-kit/blob/master/stories/2%20-%20Presets/Sortable/MultipleContainers.tsx */}
       <DndContext sensors={sensors} collisionDetection={closestCenter} onDragOver={handleDragOver}>
@@ -100,8 +101,10 @@ const CustomizeToolbar = () => {
 
           {/* More panel */}
           <div className="mb-4">
-            <h2 className="text-lg font-semibold">More Actions</h2>
-            <p className="text-sm text-gray-500">Will be shown in the dropdown menu</p>
+            <h2 className="text-lg font-semibold">{t("customizeToolbar.more_actions.title")}</h2>
+            <p className="text-sm text-gray-500">
+              {t("customizeToolbar.more_actions.description")}
+            </p>
           </div>
 
           <DroppableContainer id="container-more">
@@ -119,7 +122,7 @@ const CustomizeToolbar = () => {
 
       <div className="flex justify-end">
         <Button variant="outline" onClick={resetActionOrder}>
-          Reset to Default Layout
+          {t("customizeToolbar.reset_layout")}
         </Button>
       </div>
     </div>

locales/settings/en.json

@@ -97,6 +97,11 @@
   "appearance.zen_mode.description": "Zen mode is an undisturbed reading mode that allows you to focus on the content without any interference. Enabling Zen mode will hide the sidebar.",
   "appearance.zen_mode.label": "Zen mode",
   "common.give_star": "<HeartIcon />Love our product? <Link>Give us a star on GitHub!</Link>",
+  "customizeToolbar.more_actions.description": "Will be shown in the dropdown menu",
+  "customizeToolbar.more_actions.title": "More Actions",
+  "customizeToolbar.quick_actions.description": "Customize and reorder your frequently used actions",
+  "customizeToolbar.quick_actions.title": "Quick Actions",
+  "customizeToolbar.reset_layout": "Reset to Default Layout",
   "customizeToolbar.title": "Customize Toolbar",
   "data_control.app_cache_limit.description": "The maximum size of the app cache. Once the cache reaches this size, the oldest items will be deleted to free up space.",
   "data_control.app_cache_limit.label": "App Cache Limit",

locales/settings/zh-CN.json

@@ -97,6 +97,11 @@
   "appearance.zen_mode.description": "禅定模式是一种不受干扰的阅读模式，让你能够专注于内容而不受任何干扰。启用禅定模式将会隐藏侧边栏。",
   "appearance.zen_mode.label": "禅定模式",
   "common.give_star": "<HeartIcon />喜欢我们的产品吗？ <Link>在 GitHub 上给我们「标星」吧！</Link>",
+  "customizeToolbar.more_actions.description": "将显示在下拉菜单中",
+  "customizeToolbar.more_actions.title": "更多操作",
+  "customizeToolbar.quick_actions.description": "自定义并重新排列您常用的操作",
+  "customizeToolbar.quick_actions.title": "快捷操作",
+  "customizeToolbar.reset_layout": "重置为默认布局",
   "customizeToolbar.title": "自定义工具栏",
   "data_control.app_cache_limit.description": "应用缓存大小的上限。一旦缓存达到此上限，最早的项目将被删除以释放空间。",
   "data_control.app_cache_limit.label": "应用缓存限制",