browser-extension-settings 0.5.6 → 0.6.1

package/README.md

@@ -19,6 +19,4 @@ Copyright (c) 2023 [Pipecraft](https://www.pipecraft.net). Licensed under the [M
 ## >\_
 
 [![Pipecraft](https://img.shields.io/badge/site-pipecraft-brightgreen)](https://www.pipecraft.net)
-[![UTags](https://img.shields.io/badge/site-UTags-brightgreen)](https://utags.pipecraft.net)
-[![DTO](https://img.shields.io/badge/site-DTO-brightgreen)](https://dto.pipecraft.net)
-[![BestXTools](https://img.shields.io/badge/site-bestxtools-brightgreen)](https://www.bestxtools.com)
+[![UTags](https://img.shields.io/badge/site-UTags-brightgreen)](https://utags.link)

package/lib/extension-list.ts

@@ -7,8 +7,8 @@ import {
   createHTML,
   removeClass,
 } from "browser-extension-utils"
-import { openButton, openInNewTabButton } from "./common"
-import { i } from "./messages"
+import { openButton, openInNewTabButton } from "./common.js"
+import { i } from "./messages/index.js"
 
 type InstalledExtension = {
   id: string

package/lib/index.ts

@@ -5,4 +5,4 @@ export {
   getSettingsValue,
   saveSettingsValues,
   resetSettingsValues,
-} from "./settings"
+} from "./settings.js"

package/lib/messages/de.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "Einstellungen",
+  "settings.otherExtensions": "Andere Erweiterungen",
+  "settings.locale": "Sprache",
+  "settings.displaySettingsButtonInSideMenu": "Einstellungsschaltfläche im Seitenmenü anzeigen",
+  "settings.menu.settings": "⚙️ Einstellungen",
+  "settings.extensions.utags.title": "🏷️ UTags - Benutzer-Tags zu Links hinzufügen",
+  "settings.extensions.links-helper.title": "🔗 Link-Assistent",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - V2EX Minimalistischer Stil",
+  "settings.extensions.replace-ugly-avatars.title": "Hässliche Avatare ersetzen",
+  "settings.extensions.more-by-pipecraft.title": "Weitere nützliche Benutzerskripte finden",
+}
+
+export default messages

package/lib/messages/en.ts

@@ -1,6 +1,7 @@
 const messages = {
   "settings.title": "Settings",
   "settings.otherExtensions": "Other Extensions",
+  "settings.locale": "Language",
   "settings.displaySettingsButtonInSideMenu": "Display Settings Button in Side Menu",
   "settings.menu.settings": "⚙️ Settings",
   "settings.extensions.utags.title": "🏷️ UTags - Add usertags to links",

package/lib/messages/es.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "Configuración",
+  "settings.otherExtensions": "Otras extensiones",
+  "settings.locale": "Idioma",
+  "settings.displaySettingsButtonInSideMenu": "Mostrar botón de configuración en el menú lateral",
+  "settings.menu.settings": "⚙️ Configuración",
+  "settings.extensions.utags.title": "🏷️ UTags - Agregar etiquetas de usuario a los enlaces",
+  "settings.extensions.links-helper.title": "🔗 Asistente de enlaces",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - Estilo minimalista V2EX",
+  "settings.extensions.replace-ugly-avatars.title": "Reemplazar avatares feos",
+  "settings.extensions.more-by-pipecraft.title": "Encontrar más scripts de usuario útiles",
+}
+
+export default messages

package/lib/messages/fr.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "Paramètres",
+  "settings.otherExtensions": "Autres extensions",
+  "settings.locale": "Langue",
+  "settings.displaySettingsButtonInSideMenu": "Afficher le bouton des paramètres dans le menu latéral",
+  "settings.menu.settings": "⚙️ Paramètres",
+  "settings.extensions.utags.title": "🏷️ UTags - Ajouter des balises utilisateur aux liens",
+  "settings.extensions.links-helper.title": "🔗 Assistant de liens",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - Style minimaliste V2EX",
+  "settings.extensions.replace-ugly-avatars.title": "Remplacer les avatars laids",
+  "settings.extensions.more-by-pipecraft.title": "Trouver plus de scripts utilisateur utiles",
+}
+
+export default messages

package/lib/messages/index.ts

@@ -1,8 +1,56 @@
-import { initI18n } from "browser-extension-i18n"
-import messagesEn from "./en"
-import messagesZh from "./zh-cn"
-
-export const i = initI18n({
-  "en,en-US": messagesEn,
-  "zh,zh-CN": messagesZh,
-})
+import { initAvailableLocales, initI18n, extractLocaleFromNavigator } from "browser-extension-i18n"
+import messagesEn from "./en.js"
+import messagesZh from "./zh-cn.js"
+import messagesZhHk from "./zh-hk.js"
+import messagesZhTw from "./zh-tw.js"
+import messagesRu from "./ru.js"
+import messagesKo from "./ko.js"
+import messagesJa from "./ja.js"
+import messagesFr from "./fr.js"
+import messagesDe from "./de.js"
+import messagesIt from "./it.js"
+import messagesEs from "./es.js"
+import messagesPt from "./pt.js"
+import messagesVi from "./vi.js"
+
+const localeMap = {
+  en: messagesEn,
+  "en-US": messagesEn,
+  zh: messagesZh,
+  "zh-CN": messagesZh,
+  "zh-HK": messagesZhHk,
+  "zh-TW": messagesZhTw,
+  ru: messagesRu,
+  "ru-RU": messagesRu,
+  ko: messagesKo,
+  "ko-KR": messagesKo,
+  ja: messagesJa,
+  "ja-JP": messagesJa,
+  fr: messagesFr,
+  "fr-FR": messagesFr,
+  de: messagesDe,
+  "de-DE": messagesDe,
+  it: messagesIt,
+  "it-IT": messagesIt,
+  es: messagesEs,
+  "es-ES": messagesEs,
+  pt: messagesPt,
+  "pt-PT": messagesPt,
+  "pt-BR": messagesPt,
+  vi: messagesVi,
+  "vi-VN": messagesVi,
+}
+
+const locales = Object.keys(localeMap)
+
+initAvailableLocales(locales)
+
+export const prefferedLocale = extractLocaleFromNavigator() || "en"
+console.log("[settings] prefferedLocale:", prefferedLocale)
+// eslint-disable-next-line import/no-mutable-exports
+export let i = initI18n(localeMap, prefferedLocale)
+
+export function resetI18n(locale?: string) {
+  console.log("[settings] prefferedLocale:", prefferedLocale, "locale:", locale)
+  i = initI18n(localeMap, locale || prefferedLocale)
+}

package/lib/messages/it.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "Impostazioni",
+  "settings.otherExtensions": "Altre estensioni",
+  "settings.locale": "Lingua",
+  "settings.displaySettingsButtonInSideMenu": "Mostra il pulsante delle impostazioni nel menu laterale",
+  "settings.menu.settings": "⚙️ Impostazioni",
+  "settings.extensions.utags.title": "🏷️ UTags - Aggiungi tag utente ai collegamenti",
+  "settings.extensions.links-helper.title": "🔗 Assistente collegamenti",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - Stile minimalista V2EX",
+  "settings.extensions.replace-ugly-avatars.title": "Sostituisci avatar brutti",
+  "settings.extensions.more-by-pipecraft.title": "Trova più script utente utili",
+}
+
+export default messages

package/lib/messages/ja.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "設定",
+  "settings.otherExtensions": "その他の拡張機能",
+  "settings.locale": "言語",
+  "settings.displaySettingsButtonInSideMenu": "サイドメニューに設定ボタンを表示",
+  "settings.menu.settings": "⚙️ 設定",
+  "settings.extensions.utags.title": "🏷️ UTags - リンクにユーザータグを追加",
+  "settings.extensions.links-helper.title": "🔗 リンクヘルパー",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - V2EX ミニマルスタイル",
+  "settings.extensions.replace-ugly-avatars.title": "醜いアバターを置き換える",
+  "settings.extensions.more-by-pipecraft.title": "より便利なユーザースクリプトを見つける",
+}
+
+export default messages

package/lib/messages/ko.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "설정",
+  "settings.otherExtensions": "다른 확장 프로그램",
+  "settings.locale": "언어",
+  "settings.displaySettingsButtonInSideMenu": "사이드 메뉴에 설정 버튼 표시",
+  "settings.menu.settings": "⚙️ 설정",
+  "settings.extensions.utags.title": "🏷️ UTags - 링크에 사용자 태그 추가",
+  "settings.extensions.links-helper.title": "🔗 링크 도우미",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - V2EX 미니멀 스타일",
+  "settings.extensions.replace-ugly-avatars.title": "못생긴 아바타 교체",
+  "settings.extensions.more-by-pipecraft.title": "더 유용한 사용자 스크립트 찾기",
+}
+
+export default messages

package/lib/messages/pt.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "Configurações",
+  "settings.otherExtensions": "Outras extensões",
+  "settings.locale": "Idioma",
+  "settings.displaySettingsButtonInSideMenu": "Exibir botão de configurações no menu lateral",
+  "settings.menu.settings": "⚙️ Configurações",
+  "settings.extensions.utags.title": "🏷️ UTags - Adicionar tags de usuário aos links",
+  "settings.extensions.links-helper.title": "🔗 Assistente de links",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - Estilo minimalista V2EX",
+  "settings.extensions.replace-ugly-avatars.title": "Substituir avatares feios",
+  "settings.extensions.more-by-pipecraft.title": "Encontrar mais scripts de usuário úteis",
+}
+
+export default messages

package/lib/messages/ru.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "Настройки",
+  "settings.otherExtensions": "Другие расширения",
+  "settings.locale": "Язык",
+  "settings.displaySettingsButtonInSideMenu": "Показать кнопку настроек в боковом меню",
+  "settings.menu.settings": "⚙️ Настройки",
+  "settings.extensions.utags.title": "🏷️ UTags - Добавить пользовательские теги к ссылкам",
+  "settings.extensions.links-helper.title": "🔗 Помощник ссылок",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - V2EX Минималистичный стиль",
+  "settings.extensions.replace-ugly-avatars.title": "Заменить некрасивые аватары",
+  "settings.extensions.more-by-pipecraft.title": "Найти больше полезных пользовательских скриптов",
+}
+
+export default messages

package/lib/messages/vi.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "Cài đặt",
+  "settings.otherExtensions": "Tiện ích mở rộng khác",
+  "settings.locale": "Ngôn ngữ",
+  "settings.displaySettingsButtonInSideMenu": "Hiển thị nút cài đặt trong menu bên",
+  "settings.menu.settings": "⚙️ Cài đặt",
+  "settings.extensions.utags.title": "🏷️ UTags - Thêm thẻ người dùng vào liên kết",
+  "settings.extensions.links-helper.title": "🔗 Trợ lý liên kết",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - Phong cách tối giản V2EX",
+  "settings.extensions.replace-ugly-avatars.title": "Thay thế avatar xấu",
+  "settings.extensions.more-by-pipecraft.title": "Tìm thêm script người dùng hữu ích",
+}
+
+export default messages

package/lib/messages/zh-cn.ts

@@ -1,6 +1,7 @@
 export const messages = {
   "settings.title": "设置",
   "settings.otherExtensions": "其他扩展",
+  "settings.locale": "语言",
   "settings.displaySettingsButtonInSideMenu": "在侧边栏菜单中显示设置按钮",
   "settings.menu.settings": "⚙️ 设置",
   "settings.extensions.utags.title": "🏷️ 小鱼标签 (UTags) - 为链接添加用户标签",

package/lib/messages/zh-hk.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "設定",
+  "settings.otherExtensions": "其他擴充功能",
+  "settings.locale": "語言",
+  "settings.displaySettingsButtonInSideMenu": "在側邊欄選單中顯示設定按鈕",
+  "settings.menu.settings": "⚙️ 設定",
+  "settings.extensions.utags.title": "🏷️ 小魚標籤 (UTags) - 為連結添加用戶標籤",
+  "settings.extensions.links-helper.title": "🔗 連結助手",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - V2EX 極簡風格",
+  "settings.extensions.replace-ugly-avatars.title": "賜你個頭像吧",
+  "settings.extensions.more-by-pipecraft.title": "更多有趣的腳本",
+}
+
+export default messages

package/lib/messages/zh-tw.ts

@@ -0,0 +1,15 @@
+export const messages = {
+  "settings.title": "設定",
+  "settings.otherExtensions": "其他擴充功能",
+  "settings.locale": "語言",
+  "settings.displaySettingsButtonInSideMenu": "在側邊欄選單中顯示設定按鈕",
+  "settings.menu.settings": "⚙️ 設定",
+  "settings.extensions.utags.title": "🏷️ 小魚標籤 (UTags) - 為連結新增使用者標籤",
+  "settings.extensions.links-helper.title": "🔗 連結助手",
+  "settings.extensions.v2ex.rep.title": "V2EX.REP - 专注提升 V2EX 主题回复浏览体验",
+  "settings.extensions.v2ex.min.title": "v2ex.min - V2EX 極簡風格",
+  "settings.extensions.replace-ugly-avatars.title": "替換醜陋的頭像",
+  "settings.extensions.more-by-pipecraft.title": "更多有趣的腳本",
+}
+
+export default messages

package/lib/settings.ts

@@ -18,16 +18,16 @@ import {
   runWhenHeadExists,
 } from "browser-extension-utils"
 import styleText from "data-text:./style.scss"
-import { createSwitchOption } from "./switch"
+import { createSwitchOption } from "./switch.js"
 import {
   createExtensionList,
   addCurrentExtension,
   activeExtension,
   activeExtensionList,
   deactiveExtensionList,
-} from "./extension-list"
-import { besVersion, settingButton } from "./common"
-import { i } from "./messages"
+} from "./extension-list.js"
+import { besVersion, settingButton } from "./common.js"
+import { i, prefferedLocale, resetI18n } from "./messages/index.js"
 
 const prefix = "browser_extension_settings_"
 
@@ -82,9 +82,9 @@ type SettingsSelectItem = {
   title: string
   icon?: string
   type: "select"
-  options: { string: { string: any } }
+  options: Record<string, string | number>
   group?: number
-  defaultValue?: any
+  defaultValue?: string | number
 }
 
 type SettingsTipItem = {
@@ -181,6 +181,23 @@ export function hideSettings() {
   closeModal()
 }
 
+function destroySettings() {
+  closeModal()
+  const settingsContainer = getSettingsContainer()
+  if (settingsContainer) {
+    settingsContainer.remove()
+  }
+}
+
+function isSettingsShown() {
+  const settingsContainer = getSettingsContainer()
+  if (settingsContainer) {
+    return settingsContainer.style.display === "block"
+  }
+
+  return false
+}
+
 const onDocumentClick = (event: Event) => {
   const target = event.target as HTMLElement
   if (target?.closest(`.${prefix}container`)) {
@@ -321,7 +338,7 @@ function createSettingsElement() {
     })
 
     addElement(settingsMain, "a", {
-      textContent: "Settings",
+      textContent: i("settings.title"),
       class: "navigation_go_previous",
       onclick() {
         activeExtensionList()
@@ -483,7 +500,11 @@ function createSettingsElement() {
             })
             break
           }
+
           // No default
+          default: {
+            break
+          }
         }
       }
     }
@@ -551,13 +572,30 @@ function addCommonSettings(settingsTable: SettingsTable) {
     }
   }
 
+  // Switch locale
+  // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+  settingsTable.locale = {
+    title: i("settings.locale"),
+    type: "select",
+    defaultValue: prefferedLocale,
+    options: {
+      // eslint-disable-next-line @typescript-eslint/naming-convention
+      English: "en",
+      中文: "zh",
+      // eslint-disable-next-line @typescript-eslint/naming-convention
+      Русский: "ru",
+    },
+    group: ++maxGroup,
+  } as SettingsSelectItem
+
+  // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
   settingsTable.displaySettingsButtonInSideMenu = {
     title: i("settings.displaySettingsButtonInSideMenu"),
     defaultValue: !(
       typeof GM === "object" && typeof GM.registerMenuCommand === "function"
     ),
-    group: maxGroup + 1,
-  }
+    group: ++maxGroup,
+  } as SettingsSwitchItem
 }
 
 function handleShowSettingsUrl() {
@@ -588,12 +626,31 @@ export const initSettings = async (options: SettingsOptions) => {
     // console.log(JSON.stringify(settings, null, 2))
     await updateOptions()
     addSideMenu()
+
+    const newLocale =
+      (getSettingsValue("locale") as string | undefined) || prefferedLocale
+    console.log("lastLocale:", lastLocale, "newLocale:", newLocale)
+    if (lastLocale !== newLocale) {
+      const isShown = isSettingsShown()
+      destroySettings()
+      resetI18n(newLocale)
+      lastLocale = newLocale
+      if (isShown) {
+        setTimeout(showSettings, 100)
+      }
+    }
+
     if (typeof options.onValueChange === "function") {
       options.onValueChange()
     }
   })
 
   settings = await getSettings()
+
+  let lastLocale =
+    (getSettingsValue("locale") as string | undefined) || prefferedLocale
+  resetI18n(lastLocale)
+
   runWhenHeadExists(() => {
     addStyle(getSettingsStyle())
   })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "browser-extension-settings",
-  "version": "0.5.6",
+  "version": "0.6.1",
   "description": "Settings module for developing browser extensions and userscripts",
   "type": "module",
   "main": "./lib/index.ts",
@@ -30,16 +30,19 @@
   },
   "homepage": "https://github.com/utags/browser-extension-settings#readme",
   "dependencies": {
-    "browser-extension-i18n": "^0.0.6",
+    "browser-extension-i18n": "^0.1.2",
     "browser-extension-storage": "^0.1.2",
-    "browser-extension-utils": "^0.1.18"
+    "browser-extension-utils": "^0.2.0"
   },
   "devDependencies": {
-    "@types/chrome": "^0.0.243",
+    "@types/chrome": "^0.1.4",
+    "@vitest/coverage-v8": "^3.2.4",
+    "jsdom": "^26.1.0",
     "npm-run-all": "^4.1.5",
-    "prettier": "^3.0.2",
-    "typescript": "^5.1.6",
-    "xo": "^0.56.0"
+    "prettier": "^3.6.2",
+    "typescript": "^5.9.2",
+    "vitest": "^3.2.4",
+    "xo": "^0.60.0"
   },
   "files": [
     "lib/",
@@ -47,12 +50,13 @@
     "README.md"
   ],
   "engines": {
-    "node": "^14.13.1 || >=16.0.0"
+    "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
   },
   "xo": {
     "space": 2,
     "prettier": true,
     "globals": [
+      "GM",
       "document"
     ],
     "rules": {