Add category-based filtering in settings search (#2086)

Co-authored-by: huchenlei <huchenlei@proton.me>

src/components/dialog/content/SettingDialogContent.vue

@@ -90,6 +90,7 @@ import { flattenTree } from '@/utils/treeUtil'
 import { isElectron } from '@/utils/envUtil'
 import { normalizeI18nKey } from '@/utils/formatUtil'
 import { useI18n } from 'vue-i18n'
+import { st } from '@/i18n'
 
 const props = defineProps<{
   defaultPanel?: 'about' | 'keybinding' | 'extension' | 'server-config'
@@ -232,14 +233,26 @@ const handleSearch = (query: string) => {
   const filteredSettings = allSettings.filter((setting) => {
     const idLower = setting.id.toLowerCase()
     const nameLower = setting.name.toLowerCase()
-    const translatedName = t(
-      `settings.${normalizeI18nKey(setting.id)}.name`
+    const translatedName = st(
+      `settings.${normalizeI18nKey(setting.id)}.name`,
+      setting.name
+    ).toLocaleLowerCase()
+    const info = getSettingInfo(setting)
+    const translatedCategory = st(
+      `settingsCategories.${normalizeI18nKey(info.category)}`,
+      info.category
+    ).toLocaleLowerCase()
+    const translatedSubCategory = st(
+      `settingsCategories.${normalizeI18nKey(info.subCategory)}`,
+      info.subCategory
     ).toLocaleLowerCase()
 
     return (
       idLower.includes(queryLower) ||
       nameLower.includes(queryLower) ||
-      translatedName.includes(queryLower)
+      translatedName.includes(queryLower) ||
+      translatedCategory.includes(queryLower) ||
+      translatedSubCategory.includes(queryLower)
     )
   })