fix: case where no plugins are 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) | `320` (default locale) |  |
-| ‼️ | [`de_DE`](./de_DE.json) | `301/320` (94.1%) | ─ |
-|  | [`en_UK`](./en_UK.json) | `320/320` (100%) | `en_US` |
-| ‼️ | [`es_ES`](./es_ES.json) | `301/320` (94.1%) | ─ |
-| ‼️ | [`fr_FR`](./fr_FR.json) | `301/320` (94.1%) | ─ |
-| ‼️ | [`hi_IN`](./hi_IN.json) | `301/320` (94.1%) | ─ |
-| ‼️ | [`ja_JA`](./ja_JA.json) | `301/320` (94.1%) | ─ |
-| ‼️ | [`pt_BR`](./pt_BR.json) | `301/320` (94.1%) | ─ |
-| ‼️ | [`zh_CN`](./zh_CN.json) | `301/320` (94.1%) | ─ |
+|  | [`en_US`](./en_US.json) | `321` (default locale) |  |
+| ‼️ | [`de_DE`](./de_DE.json) | `301/321` (93.8%) | ─ |
+|  | [`en_UK`](./en_UK.json) | `321/321` (100%) | `en_US` |
+| ‼️ | [`es_ES`](./es_ES.json) | `301/321` (93.8%) | ─ |
+| ‼️ | [`fr_FR`](./fr_FR.json) | `301/321` (93.8%) | ─ |
+| ‼️ | [`hi_IN`](./hi_IN.json) | `301/321` (93.8%) | ─ |
+| ‼️ | [`ja_JA`](./ja_JA.json) | `301/321` (93.8%) | ─ |
+| ‼️ | [`pt_BR`](./pt_BR.json) | `301/321` (93.8%) | ─ |
+| ‼️ | [`zh_CN`](./zh_CN.json) | `301/321` (93.8%) | ─ |
 
 <sub>
 ✅ - Fully translated
@@ -45,11 +45,12 @@ This means to figure out which keys are untranslated, you will need to manually
 
 ### Missing keys:
 
-<details><summary><code>de_DE</code> - 19 missing keys <i>(click to show)</i></summary><br>
+<details><summary><code>de_DE</code> - 20 missing keys <i>(click to show)</i></summary><br>
 
 | Key | English text |
 | --- | ------------ |
 | `plugin_list_title` | `Plugin List` |
+| `plugin_list_no_plugins` | `No plugins are currently installed.` |
 | `plugin_list_permissions_header` | `Permissions:` |
 | `plugin_link_type_source` | `Repository` |
 | `plugin_link_type_other` | `Other / Homepage` |
@@ -71,11 +72,12 @@ This means to figure out which keys are untranslated, you will need to manually
 
 <br></details>
 
-<details><summary><code>es_ES</code> - 19 missing keys <i>(click to show)</i></summary><br>
+<details><summary><code>es_ES</code> - 20 missing keys <i>(click to show)</i></summary><br>
 
 | Key | English text |
 | --- | ------------ |
 | `plugin_list_title` | `Plugin List` |
+| `plugin_list_no_plugins` | `No plugins are currently installed.` |
 | `plugin_list_permissions_header` | `Permissions:` |
 | `plugin_link_type_source` | `Repository` |
 | `plugin_link_type_other` | `Other / Homepage` |
@@ -97,11 +99,12 @@ This means to figure out which keys are untranslated, you will need to manually
 
 <br></details>
 
-<details><summary><code>fr_FR</code> - 19 missing keys <i>(click to show)</i></summary><br>
+<details><summary><code>fr_FR</code> - 20 missing keys <i>(click to show)</i></summary><br>
 
 | Key | English text |
 | --- | ------------ |
 | `plugin_list_title` | `Plugin List` |
+| `plugin_list_no_plugins` | `No plugins are currently installed.` |
 | `plugin_list_permissions_header` | `Permissions:` |
 | `plugin_link_type_source` | `Repository` |
 | `plugin_link_type_other` | `Other / Homepage` |
@@ -123,11 +126,12 @@ This means to figure out which keys are untranslated, you will need to manually
 
 <br></details>
 
-<details><summary><code>hi_IN</code> - 19 missing keys <i>(click to show)</i></summary><br>
+<details><summary><code>hi_IN</code> - 20 missing keys <i>(click to show)</i></summary><br>
 
 | Key | English text |
 | --- | ------------ |
 | `plugin_list_title` | `Plugin List` |
+| `plugin_list_no_plugins` | `No plugins are currently installed.` |
 | `plugin_list_permissions_header` | `Permissions:` |
 | `plugin_link_type_source` | `Repository` |
 | `plugin_link_type_other` | `Other / Homepage` |
@@ -149,11 +153,12 @@ This means to figure out which keys are untranslated, you will need to manually
 
 <br></details>
 
-<details><summary><code>ja_JA</code> - 19 missing keys <i>(click to show)</i></summary><br>
+<details><summary><code>ja_JA</code> - 20 missing keys <i>(click to show)</i></summary><br>
 
 | Key | English text |
 | --- | ------------ |
 | `plugin_list_title` | `Plugin List` |
+| `plugin_list_no_plugins` | `No plugins are currently installed.` |
 | `plugin_list_permissions_header` | `Permissions:` |
 | `plugin_link_type_source` | `Repository` |
 | `plugin_link_type_other` | `Other / Homepage` |
@@ -175,11 +180,12 @@ This means to figure out which keys are untranslated, you will need to manually
 
 <br></details>
 
-<details><summary><code>pt_BR</code> - 19 missing keys <i>(click to show)</i></summary><br>
+<details><summary><code>pt_BR</code> - 20 missing keys <i>(click to show)</i></summary><br>
 
 | Key | English text |
 | --- | ------------ |
 | `plugin_list_title` | `Plugin List` |
+| `plugin_list_no_plugins` | `No plugins are currently installed.` |
 | `plugin_list_permissions_header` | `Permissions:` |
 | `plugin_link_type_source` | `Repository` |
 | `plugin_link_type_other` | `Other / Homepage` |
@@ -201,11 +207,12 @@ This means to figure out which keys are untranslated, you will need to manually
 
 <br></details>
 
-<details><summary><code>zh_CN</code> - 19 missing keys <i>(click to show)</i></summary><br>
+<details><summary><code>zh_CN</code> - 20 missing keys <i>(click to show)</i></summary><br>
 
 | Key | English text |
 | --- | ------------ |
 | `plugin_list_title` | `Plugin List` |
+| `plugin_list_no_plugins` | `No plugins are currently installed.` |
 | `plugin_list_permissions_header` | `Permissions:` |
 | `plugin_link_type_source` | `Repository` |
 | `plugin_link_type_other` | `Other / Homepage` |

assets/translations/en_US.json

@@ -200,6 +200,7 @@
     "color_lightness_lighter": "Lighter",
 
     "plugin_list_title": "Plugin List",
+    "plugin_list_no_plugins": "No plugins are currently installed.",
     "plugin_list_permissions_header": "Permissions:",
 
     "plugin_link_type_source": "Repository",

dist/BetterYTM.css

@@ -930,6 +930,12 @@ body .bytm-ripple.slower {
   font-size: 1.45rem;
 }
 
+.bytm-plugin-list-no-plugins {
+  font-size: 1.7rem;
+  text-align: center;
+  padding: 8px 0px;
+}
+
 .bytm-plugin-list-row {
   --bytm-plugin-list-row-max-height: 120px;
 

src/dialogs/pluginList.css

@@ -1,3 +1,9 @@
+.bytm-plugin-list-no-plugins {
+  font-size: 1.7rem;
+  text-align: center;
+  padding: 8px 0px;
+}
+
 .bytm-plugin-list-row {
   --bytm-plugin-list-row-max-height: 120px;
 

src/dialogs/pluginList.ts

@@ -42,6 +42,14 @@ async function renderBody() {
   const listContainerEl = document.createElement("div");
   listContainerEl.id = "bytm-plugin-list-container";
 
+  if(registeredPlugins.size === 0) {
+    const noPluginsEl = document.createElement("div");
+    noPluginsEl.classList.add("bytm-plugin-list-no-plugins");
+    noPluginsEl.textContent = t("plugin_list_no_plugins");
+    listContainerEl.appendChild(noPluginsEl);
+    return listContainerEl;
+  }
+
   for(const [, { def: { plugin, intents } }] of registeredPlugins.entries()) {
     const rowEl = document.createElement("div");
     rowEl.classList.add("bytm-plugin-list-row");