From d7586dd4c26f5d96699eee80468f68f997ec53ce Mon Sep 17 00:00:00 2001
From: shivangikakkar <shivangikakkar15@gmail.com>
Date: Fri, 28 Sep 2018 03:48:46 +0530
Subject: [PATCH 1/3] resolves #256 disables edit-container button when no
 container is present

resolve lint errors

review changes
---
 src/css/popup.css | 6 ++++++
 src/js/popup.js   | 7 +++++++
 src/popup.html    | 2 +-
 3 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/css/popup.css b/src/css/popup.css
index af78306..6eb6496 100644
--- a/src/css/popup.css
+++ b/src/css/popup.css
@@ -45,6 +45,7 @@ body {
   --small-text-size: 0.833rem; /* 10px */
   --small-radius: 3px;
   --icon-button-size: calc(calc(var(--block-line-separation-size) * 2) + 1.66rem); /* 20px */
+  --inactive-opacity: 0.3;
 }
 
 @media (min-resolution: 1dppx) {
@@ -578,6 +579,11 @@ span ~ .panel-header-text {
   max-inline-size: 204px;
 }
 
+.disable-edit-containers {
+  opacity: var(--inactive-opacity);
+  pointer-events: none;
+}
+
 .userContext-wrapper {
   align-items: center;
   display: flex;
diff --git a/src/js/popup.js b/src/js/popup.js
index 2964f02..649384a 100644
--- a/src/js/popup.js
+++ b/src/js/popup.js
@@ -687,6 +687,13 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
     document.addEventListener("mousedown", () => {
       document.removeEventListener("focus", focusHandler);
     });
+    /*  If no container is present disable the Edit Containers button */
+    const editContainer = document.querySelector("#edit-containers");
+    if (Logic.identities().length === 0) {
+      editContainer.classList.add("disable-edit-containers");
+    } else {
+      editContainer.classList.remove("disable-edit-containers");
+    }
 
     return Promise.resolve();
   },
diff --git a/src/popup.html b/src/popup.html
index a28dd32..c342edd 100644
--- a/src/popup.html
+++ b/src/popup.html
@@ -116,7 +116,7 @@
       </table>
     </div>
     <div class="panel-footer edit-identities">
-      <div class="edit-containers-text panel-footer-secondary">
+      <div class="edit-containers-text panel-footer-secondary" id="edit-containers">
         <a href="#" tabindex="0" id="edit-containers-link">Edit Containers</a>
       </div>
       <a href="#" tabindex="0" class="add-container-link pop-button" id="container-add-link" title="Create new container">

From 752d18ffca5aecba16edbd3771db36396f913c0c Mon Sep 17 00:00:00 2001
From: shivangikakkar <shivangikakkar15@gmail.com>
Date: Thu, 18 Oct 2018 21:33:48 +0530
Subject: [PATCH 2/3] prevent event handler when edit containers disabled

---
 src/js/popup.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/js/popup.js b/src/js/popup.js
index 649384a..0c1fe11 100644
--- a/src/js/popup.js
+++ b/src/js/popup.js
@@ -507,7 +507,9 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
     });
 
     Logic.addEnterHandler(document.querySelector("#edit-containers-link"), () => {
-      Logic.showPanel(P_CONTAINERS_EDIT);
+      if (!document.querySelector("#edit-containers").classList.contains("disable-edit-containers")){
+        Logic.showPanel(P_CONTAINERS_EDIT);
+      }
     });
 
     Logic.addEnterHandler(document.querySelector("#sort-containers-link"), async function () {

From dcc3b76cdab9118ed3f3a629a66c75793aa14484 Mon Sep 17 00:00:00 2001
From: shivangikakkar <shivangikakkar15@gmail.com>
Date: Sun, 21 Oct 2018 17:12:56 +0530
Subject: [PATCH 3/3] simplifying the solution

---
 src/js/popup.js | 6 +++---
 src/popup.html  | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/js/popup.js b/src/js/popup.js
index 0c1fe11..f9b5efb 100644
--- a/src/js/popup.js
+++ b/src/js/popup.js
@@ -506,8 +506,8 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
       Logic.showPanel(P_CONTAINER_EDIT, { name: Logic.generateIdentityName() });
     });
 
-    Logic.addEnterHandler(document.querySelector("#edit-containers-link"), () => {
-      if (!document.querySelector("#edit-containers").classList.contains("disable-edit-containers")){
+    Logic.addEnterHandler(document.querySelector("#edit-containers-link"), (e) => {
+      if (!e.target.classList.contains("disable-edit-containers")){
         Logic.showPanel(P_CONTAINERS_EDIT);
       }
     });
@@ -690,7 +690,7 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
       document.removeEventListener("focus", focusHandler);
     });
     /*  If no container is present disable the Edit Containers button */
-    const editContainer = document.querySelector("#edit-containers");
+    const editContainer = document.querySelector("#edit-containers-link");
     if (Logic.identities().length === 0) {
       editContainer.classList.add("disable-edit-containers");
     } else {
diff --git a/src/popup.html b/src/popup.html
index c342edd..a28dd32 100644
--- a/src/popup.html
+++ b/src/popup.html
@@ -116,7 +116,7 @@
       </table>
     </div>
     <div class="panel-footer edit-identities">
-      <div class="edit-containers-text panel-footer-secondary" id="edit-containers">
+      <div class="edit-containers-text panel-footer-secondary">
         <a href="#" tabindex="0" id="edit-containers-link">Edit Containers</a>
       </div>
       <a href="#" tabindex="0" class="add-container-link pop-button" id="container-add-link" title="Create new container">