From b7232d64c49a17ee7b95275bc0c7e0bdac43950c Mon Sep 17 00:00:00 2001
From: wanhose <hello@wanhose.dev>
Date: Thu, 9 Nov 2023 18:52:09 +0100
Subject: [PATCH] feat(browser-extension): add button to add items manually in
 options page

---
 .../src/_locales/de/messages.json             |  6 ++++
 .../src/_locales/en/messages.json             |  6 ++++
 .../src/_locales/es/messages.json             |  6 ++++
 .../src/_locales/fr/messages.json             |  6 ++++
 .../src/_locales/it/messages.json             |  6 ++++
 .../src/_locales/pt_BR/messages.json          |  6 ++++
 .../src/_locales/pt_PT/messages.json          |  6 ++++
 .../src/_locales/ro/messages.json             |  6 ++++
 .../src/_locales/ru/messages.json             |  6 ++++
 packages/browser-extension/src/options.html   | 17 ++++++++++-
 .../browser-extension/src/scripts/options.js  | 29 +++++++++++++++++++
 11 files changed, 99 insertions(+), 1 deletion(-)

diff --git a/packages/browser-extension/src/_locales/de/messages.json b/packages/browser-extension/src/_locales/de/messages.json
index dd4b140..3217294 100644
--- a/packages/browser-extension/src/_locales/de/messages.json
+++ b/packages/browser-extension/src/_locales/de/messages.json
@@ -8,6 +8,12 @@
   "contextMenu_settingsOption": {
     "message": "Ausnahmeliste verwalten"
   },
+  "options_addButton": {
+    "message": "Ausschluss hinzufügen"
+  },
+  "options_addPrompt": {
+    "message": "Domain eingeben"
+  },
   "options_clearButton": {
     "message": "Liste leeren"
   },
diff --git a/packages/browser-extension/src/_locales/en/messages.json b/packages/browser-extension/src/_locales/en/messages.json
index e92f463..0ef8036 100644
--- a/packages/browser-extension/src/_locales/en/messages.json
+++ b/packages/browser-extension/src/_locales/en/messages.json
@@ -8,6 +8,12 @@
   "contextMenu_settingsOption": {
     "message": "Manage exclusion list"
   },
+  "options_addButton": {
+    "message": "Add exclusion"
+  },
+  "options_addPrompt": {
+    "message": "Enter domain"
+  },
   "options_clearButton": {
     "message": "Clear list"
   },
diff --git a/packages/browser-extension/src/_locales/es/messages.json b/packages/browser-extension/src/_locales/es/messages.json
index 71fcfcd..08e67b5 100644
--- a/packages/browser-extension/src/_locales/es/messages.json
+++ b/packages/browser-extension/src/_locales/es/messages.json
@@ -8,6 +8,12 @@
   "contextMenu_settingsOption": {
     "message": "Gestionar lista de exclusión"
   },
+  "options_addButton": {
+    "message": "Agregar exclusión"
+  },
+  "options_addPrompt": {
+    "message": "Ingrese el dominio"
+  },
   "options_clearButton": {
     "message": "Borrar lista"
   },
diff --git a/packages/browser-extension/src/_locales/fr/messages.json b/packages/browser-extension/src/_locales/fr/messages.json
index 61193e3..4d1755c 100644
--- a/packages/browser-extension/src/_locales/fr/messages.json
+++ b/packages/browser-extension/src/_locales/fr/messages.json
@@ -8,6 +8,12 @@
   "contextMenu_settingsOption": {
     "message": "Gérer la liste d'exclusion"
   },
+  "options_addButton": {
+    "message": "Ajouter une exclusion"
+  },
+  "options_addPrompt": {
+    "message": "Entrez le domaine"
+  },
   "options_clearButton": {
     "message": "Effacer la liste"
   },
diff --git a/packages/browser-extension/src/_locales/it/messages.json b/packages/browser-extension/src/_locales/it/messages.json
index 8ff36e4..2a8f141 100644
--- a/packages/browser-extension/src/_locales/it/messages.json
+++ b/packages/browser-extension/src/_locales/it/messages.json
@@ -8,6 +8,12 @@
   "contextMenu_settingsOption": {
     "message": "Gestisci elenco di esclusione"
   },
+  "options_addButton": {
+    "message": "Aggiungi esclusione"
+  },
+  "options_addPrompt": {
+    "message": "Inserisci il dominio"
+  },
   "options_clearButton": {
     "message": "Cancella elenco"
   },
diff --git a/packages/browser-extension/src/_locales/pt_BR/messages.json b/packages/browser-extension/src/_locales/pt_BR/messages.json
index f84475f..24a3496 100644
--- a/packages/browser-extension/src/_locales/pt_BR/messages.json
+++ b/packages/browser-extension/src/_locales/pt_BR/messages.json
@@ -8,6 +8,12 @@
   "contextMenu_settingsOption": {
     "message": "Gerenciar lista de exclusão"
   },
+  "options_addButton": {
+    "message": "Adicionar exclusão"
+  },
+  "options_addPrompt": {
+    "message": "Digite o domínio"
+  },
   "options_clearButton": {
     "message": "Limpar lista"
   },
diff --git a/packages/browser-extension/src/_locales/pt_PT/messages.json b/packages/browser-extension/src/_locales/pt_PT/messages.json
index f84475f..24a3496 100644
--- a/packages/browser-extension/src/_locales/pt_PT/messages.json
+++ b/packages/browser-extension/src/_locales/pt_PT/messages.json
@@ -8,6 +8,12 @@
   "contextMenu_settingsOption": {
     "message": "Gerenciar lista de exclusão"
   },
+  "options_addButton": {
+    "message": "Adicionar exclusão"
+  },
+  "options_addPrompt": {
+    "message": "Digite o domínio"
+  },
   "options_clearButton": {
     "message": "Limpar lista"
   },
diff --git a/packages/browser-extension/src/_locales/ro/messages.json b/packages/browser-extension/src/_locales/ro/messages.json
index 2eca065..3244155 100644
--- a/packages/browser-extension/src/_locales/ro/messages.json
+++ b/packages/browser-extension/src/_locales/ro/messages.json
@@ -8,6 +8,12 @@
   "contextMenu_settingsOption": {
     "message": "Gestionați lista de excludere"
   },
+  "options_addButton": {
+    "message": "Adăugați excludere"
+  },
+  "options_addPrompt": {
+    "message": "Introduceți domeniul"
+  },
   "options_clearButton": {
     "message": "Ștergeți lista"
   },
diff --git a/packages/browser-extension/src/_locales/ru/messages.json b/packages/browser-extension/src/_locales/ru/messages.json
index bdb6e1c..898d3d0 100644
--- a/packages/browser-extension/src/_locales/ru/messages.json
+++ b/packages/browser-extension/src/_locales/ru/messages.json
@@ -8,6 +8,12 @@
   "contextMenu_settingsOption": {
     "message": "Управление списком исключений"
   },
+  "options_addButton": {
+    "message": "Добавить исключение"
+  },
+  "options_addPrompt": {
+    "message": "Введите домен"
+  },
   "options_clearButton": {
     "message": "Очистить список"
   },
diff --git a/packages/browser-extension/src/options.html b/packages/browser-extension/src/options.html
index 3c9f0ca..3706212 100644
--- a/packages/browser-extension/src/options.html
+++ b/packages/browser-extension/src/options.html
@@ -17,6 +17,22 @@
     </header>
     <main>
       <div class="button-group">
+        <button data-variant="large" id="add-button">
+          <span data-i18n="options_addButton"></span>
+          <svg
+            fill="none"
+            height="14"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            stroke-width="2"
+            stroke="currentColor"
+            viewBox="0 0 24 24"
+            width="14"
+          >
+            <line x1="12" y1="5" x2="12" y2="19"></line>
+            <line x1="5" y1="12" x2="19" y2="12"></line>
+          </svg>
+        </button>
         <button data-variant="large" id="clear-button">
           <span data-i18n="options_clearButton"></span>
           <svg
@@ -76,7 +92,6 @@
           </svg>
         </button>
       </div>
-
       <input id="filter-input" data-i18n-placeholder="options_filterPlaceholder" />
       <ul id="exclusion-list">
         <li id="exclusion-list-item-template" style="display: none">
diff --git a/packages/browser-extension/src/scripts/options.js b/packages/browser-extension/src/scripts/options.js
index 707cdc6..d648362 100644
--- a/packages/browser-extension/src/scripts/options.js
+++ b/packages/browser-extension/src/scripts/options.js
@@ -4,6 +4,12 @@
 
 const dispatch = chrome.runtime.sendMessage;
 
+/**
+ * @description Domain RegExp
+ */
+
+const domainRx = /^([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{2,}$/g;
+
 /**
  * @description Exclusion list, URLs where the user prefers to disable the extension
  * @type {string[]}
@@ -46,6 +52,26 @@ function createList() {
   }
 }
 
+/**
+ * @async
+ * @description Add a new item to the exclusion list
+ * @returns {Promise<void>}
+ */
+
+async function handleAddClick() {
+  const exclusionValue = window.prompt(chrome.i18n.getMessage('options_addPrompt'));
+
+  if (exclusionValue?.trim() && (domainRx.test(exclusionValue) || exclusionValue === 'localhost')) {
+    const filterInputElement = document.getElementById('filter-input');
+    const state = { enabled: false };
+    await dispatch({ hostname: exclusionValue, state, type: 'SET_HOSTNAME_STATE' });
+
+    exclusionList = [...new Set([...exclusionList, exclusionValue])].sort();
+    createList();
+    updateList(filterInputElement.value.trim());
+  }
+}
+
 /**
  * @async
  * @description Clear all items from the exclusion list
@@ -74,6 +100,9 @@ async function handleContentLoaded() {
   exclusionList = await dispatch({ type: 'GET_EXCLUSION_LIST' });
   createList();
 
+  const addButtonElement = document.getElementById('add-button');
+  addButtonElement.addEventListener('click', handleAddClick);
+
   const clearButtonElement = document.getElementById('clear-button');
   clearButtonElement.addEventListener('click', handleClearClick);