ref: better plugin list with no plugins installed

assets/translations/README.md

@@ -16,15 +16,15 @@ To submit or edit a translation, please follow [this guide](../../contributing.m
 ### Translation progress:
 |   | Locale | Translated keys | Based on |
 | :----: | ------ | --------------- | :------: |
-|  | [`en_US`](./en_US.json) | `322` (default locale) |  |
-| ✅ | [`de_DE`](./de_DE.json) | `322/322` (100%) | ─ |
-|  | [`en_UK`](./en_UK.json) | `322/322` (100%) | `en_US` |
-| ✅ | [`es_ES`](./es_ES.json) | `322/322` (100%) | ─ |
-| ✅ | [`fr_FR`](./fr_FR.json) | `322/322` (100%) | ─ |
-| ✅ | [`hi_IN`](./hi_IN.json) | `322/322` (100%) | ─ |
-| ✅ | [`ja_JA`](./ja_JA.json) | `322/322` (100%) | ─ |
-| ✅ | [`pt_BR`](./pt_BR.json) | `322/322` (100%) | ─ |
-| ✅ | [`zh_CN`](./zh_CN.json) | `322/322` (100%) | ─ |
+|  | [`en_US`](./en_US.json) | `323` (default locale) |  |
+| ✅ | [`de_DE`](./de_DE.json) | `323/323` (100%) | ─ |
+|  | [`en_UK`](./en_UK.json) | `323/323` (100%) | `en_US` |
+| ✅ | [`es_ES`](./es_ES.json) | `323/323` (100%) | ─ |
+| ✅ | [`fr_FR`](./fr_FR.json) | `323/323` (100%) | ─ |
+| ✅ | [`hi_IN`](./hi_IN.json) | `323/323` (100%) | ─ |
+| ✅ | [`ja_JA`](./ja_JA.json) | `323/323` (100%) | ─ |
+| ✅ | [`pt_BR`](./pt_BR.json) | `323/323` (100%) | ─ |
+| ✅ | [`zh_CN`](./zh_CN.json) | `323/323` (100%) | ─ |
 
 <sub>
 ✅ - Fully translated

assets/translations/de_DE.json

@@ -201,7 +201,8 @@
     "color_lightness_lighter": "Heller",
 
     "plugin_list_title": "Plugin-Liste",
-    "plugin_list_no_plugins": "Momentan sind keine Plugins installiert.",
+    "plugin_list_no_plugins": "Derzeit sind keine Plugins installiert.\nBesuche %1diese Seite%2 für mehr Informationen.",
+    "plugin_list_no_plugins_tooltip": "Derzeit sind keine Plugins installiert.",
     "plugin_list_permissions_header": "Berechtigungen:",
 
     "plugin_link_type_source": "Quellcode",

assets/translations/en_US.json

@@ -201,7 +201,8 @@
     "color_lightness_lighter": "Lighter",
 
     "plugin_list_title": "Plugin List",
-    "plugin_list_no_plugins": "No plugins are currently installed.",
+    "plugin_list_no_plugins": "No plugins are currently installed.\nVisit %1this page%2 for more information.",
+    "plugin_list_no_plugins_tooltip": "No plugins are currently installed.",
     "plugin_list_permissions_header": "Permissions:",
 
     "plugin_link_type_source": "Repository",

assets/translations/es_ES.json

@@ -201,7 +201,8 @@
     "color_lightness_lighter": "Más claro",
 
     "plugin_list_title": "Lista de plugins",
-    "plugin_list_no_plugins": "Actualmente no hay ningún plugin instalado.",
+    "plugin_list_no_plugins": "Actualmente no hay plugins instalados.\nVisite %1esta página%2 para obtener más información.",
+    "plugin_list_no_plugins_tooltip": "No hay ningún plugin instalado actualmente.",
     "plugin_list_permissions_header": "Permisos:",
 
     "plugin_link_type_source": "Repositorio",

assets/translations/fr_FR.json

@@ -201,7 +201,8 @@
     "color_lightness_lighter": "Plus clair",
 
     "plugin_list_title": "Liste des plugins",
-    "plugin_list_no_plugins": "Aucun plugin n'est actuellement installé.",
+    "plugin_list_no_plugins": "Aucun plugin n'est actuellement installé.\nVisitez %1cette page%2 pour plus d'informations.",
+    "plugin_list_no_plugins_tooltip": "Aucun plugin n'est actuellement installé.",
     "plugin_list_permissions_header": "Permissions:",
 
     "plugin_link_type_source": "Dépôt",

assets/translations/hi_IN.json

@@ -201,7 +201,8 @@
     "color_lightness_lighter": "हल्का",
 
     "plugin_list_title": "प्लगइन सूची",
-    "plugin_list_no_plugins": "वर्तमान में कोई प्लगइन स्थापित नहीं हैं।",
+    "plugin_list_no_plugins": "कोई प्लगइन वर्तमान में स्थापित नहीं हैं।\nअधिक जानकारी के लिए %1इस पृष्ठ%2 पर जाएं।",
+    "plugin_list_no_plugins_tooltip": "कोई प्लगइन वर्तमान में स्थापित नहीं हैं।",
     "plugin_list_permissions_header": "अनुमतियाँ:",
 
     "plugin_link_type_source": "संग्रह",

assets/translations/ja_JA.json

@@ -201,7 +201,8 @@
     "color_lightness_lighter": "明るい",
 
     "plugin_list_title": "プラグインリスト",
-    "plugin_list_no_plugins": "現在インストールされているプラグインはありません。",
+    "plugin_list_no_plugins": "現在インストールされているプラグインはありません。\n詳細については %1このページ%2 をご覧ください。",
+    "plugin_list_no_plugins_tooltip": "現在インストールされているプラグインはありません。",
     "plugin_list_permissions_header": "権限：",
 
     "plugin_link_type_source": "リポジトリ",

assets/translations/pt_BR.json

@@ -201,7 +201,8 @@
     "color_lightness_lighter": "Mais claro",
 
     "plugin_list_title": "Lista de plugins",
-    "plugin_list_no_plugins": "Nenhum plugin está atualmente instalado.",
+    "plugin_list_no_plugins": "Nenhum plugin está atualmente instalado.\nVisite %1esta página%2 para mais informações.",
+    "plugin_list_no_plugins_tooltip": "Nenhum plugin está atualmente instalado.",
     "plugin_list_permissions_header": "Permissões:",
 
     "plugin_link_type_source": "Repositório",

assets/translations/zh_CN.json

@@ -201,7 +201,8 @@
     "color_lightness_lighter": "更亮",
 
     "plugin_list_title": "插件列表",
-    "plugin_list_no_plugins": "当前未安装任何插件。",
+    "plugin_list_no_plugins": "当前未安装任何插件。\n访问 %1此页面%2 以获取更多信息。",
+    "plugin_list_no_plugins_tooltip": "当前未安装任何插件。",
     "plugin_list_permissions_header": "权限：",
 
     "plugin_link_type_source": "存储库",

dist/BetterYTM.css

@@ -945,6 +945,7 @@ body .bytm-ripple.slower {
   font-size: 1.7rem;
   text-align: center;
   padding: var(--bytm-plugin-list-row-padding-ver) 0px;
+  white-space: pre-wrap;
 }
 
 .bytm-plugin-list-row {

src/dialogs/pluginList.css

@@ -13,6 +13,7 @@
   font-size: 1.7rem;
   text-align: center;
   padding: var(--bytm-plugin-list-row-padding-ver) 0px;
+  white-space: pre-wrap;
 }
 
 .bytm-plugin-list-row {

src/dialogs/pluginList.ts

@@ -1,7 +1,9 @@
 import { BytmDialog } from "../components/index.js";
 import { getRegisteredPlugins } from "../interface.js";
 import { getLocale, t } from "../utils/translations.js";
+import { setInnerHtml } from "../utils/dom.js";
 import { PluginIntent } from "../types.js";
+import packageJson from "../../package.json" with { type: "json" };
 import "./pluginList.css";
 
 let pluginListDialog: BytmDialog | null = null;
@@ -44,7 +46,8 @@ async function renderBody() {
     const noPluginsEl = document.createElement("div");
     noPluginsEl.classList.add("bytm-plugin-list-no-plugins");
     noPluginsEl.tabIndex = 0;
-    noPluginsEl.textContent = noPluginsEl.title = noPluginsEl.ariaLabel = t("plugin_list_no_plugins");
+    setInnerHtml(noPluginsEl, t("plugin_list_no_plugins", `<a class="bytm-link" href="${packageJson.homepage}#plugins" target="_blank" rel="noopener noreferrer">`, "</a>"));
+    noPluginsEl.title = noPluginsEl.ariaLabel = t("plugin_list_no_plugins_tooltip");
     listContainerEl.appendChild(noPluginsEl);
     return listContainerEl;
   }