From 50b1a4eab52615946d3ad032d7cbe84b381d5db2 Mon Sep 17 00:00:00 2001
From: KoloMl <thekolomoets@hotmail.com>
Date: Thu, 4 Apr 2024 03:03:04 +0400
Subject: [PATCH] Start handling clicks on the tags

---
 src/lib/components/MaintenancePopup.js | 28 ++++++++++++++++++++++++++
 1 file changed, 28 insertions(+)

diff --git a/src/lib/components/MaintenancePopup.js b/src/lib/components/MaintenancePopup.js
index 3f17a03..ae906f6 100644
--- a/src/lib/components/MaintenancePopup.js
+++ b/src/lib/components/MaintenancePopup.js
@@ -51,6 +51,7 @@ export class MaintenancePopup extends BaseComponent {
     this.#mediaBoxTools = mediaBoxTools;
 
     MaintenancePopup.#watchActiveProfile(this.#onActiveProfileChanged.bind(this));
+    this.#tagsListElement.addEventListener('click', this.#handleTagClick.bind(this));
   }
 
   /**
@@ -90,6 +91,33 @@ export class MaintenancePopup extends BaseComponent {
       });
   }
 
+  /**
+   * Detect and process clicks made directly to the tags.
+   * @param {MouseEvent} event
+   */
+  #handleTagClick(event) {
+    /** @type {HTMLElement} */
+    let tagElement = event.target;
+
+    if (!tagElement.classList.contains('tag')) {
+      tagElement = tagElement.closest('.tag');
+    }
+
+    if (!tagElement) {
+      return;
+    }
+
+    if (tagElement.classList.contains('is-present')) {
+      tagElement.classList.toggle('is-removed');
+    }
+
+    if (tagElement.classList.contains('is-missing')) {
+      tagElement.classList.toggle('is-added');
+    }
+
+    // TODO: Execute the submission on timeout or after user moved the mouse away from the popup.
+  }
+
   /**
    * @return {boolean}
    */