made reviewed changes

src/js/popup.js

@@ -527,7 +527,7 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
       }
     });
 
-    document.addEventListener("keydown", (e) => {
+    document.addEventListener("keydown", (e) => {     
       const selectables = [...document.querySelectorAll("[tabindex='0'], [tabindex='-1']")];
       const element = document.activeElement;
       const index = selectables.indexOf(element) || 0;
@@ -618,10 +618,8 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
       const DefaultText =document.getElementById("default-text");
       const DefaultBox =document.getElementById("container-page-assigned");
       currentContainer.innerText = identity.name;
-      if (currentContainer.innerText === "Default"){
-        DefaultBox.style.display="none";
-        DefaultText.style.display="none";
-        currentContainer.style.display="none";
+      if (identity.name === "Default"){
+        document.getElementById("container-page-assigned-label").style.display = "none";
       }
       currentContainer.setAttribute("data-identity-color", identity.color);
     }
@@ -702,13 +700,13 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
     /*  If no container is present disable the Edit Containers button */
     const editContainer = document.querySelector("#edit-containers-link");
     if (Logic.identities().length === 0) {
-      editContainer.classList.add("disable-edit-containers");
+      editContainer.classList.add("disable-edit-containers");   
     } else {
       editContainer.classList.remove("disable-edit-containers");
     }
 
     return Promise.resolve();
-  },
+  },  
 });
 
 // P_CONTAINER_INFO: More info about a container.
@@ -896,7 +894,7 @@ Logic.registerPanel(P_CONTAINERS_EDIT, {
       tr.querySelector(".container-name").textContent = identity.name;
       tr.querySelector(".edit-container").setAttribute("title", `Edit ${identity.name} container`);
       tr.querySelector(".remove-container").setAttribute("title", `Remove ${identity.name} container`);
-
+      tr.setAttribute("tabindex","0");
 
       Logic.addEnterHandler(tr, e => {
         if (e.target.matches(".edit-container-icon") || e.target.parentNode.matches(".edit-container-icon")) {
@@ -906,14 +904,50 @@ Logic.registerPanel(P_CONTAINERS_EDIT, {
         }
       });
     });
-
+   
     const list = document.querySelector("#edit-identities-list");
 
     list.innerHTML = "";
     list.appendChild(fragment);
-
+    list.addEventListener("keydown", (e) => {
+      console.log("hi");
+      const selectables = [...document.querySelectorAll("[tabindex='0'], [tabindex='-1']")];
+      console.log(selectables[0].innerHTML);
+      const element = document.activeElement;
+      const index = selectables.indexOf(element) || 0;
+      function next() {
+        const nextElement = selectables[index + 1];
+        if (nextElement) {
+          nextElement.focus();
+        }
+      }
+      function previous() {
+        const previousElement = selectables[index - 1];
+        if (previousElement) {
+          previousElement.focus();
+        }
+      }
+      switch (e.keyCode) {
+      case 40:
+        next();
+        break;
+      case 38:
+        previous();
+        break;
+      default:
+        if ((e.keyCode >= 49 && e.keyCode <= 57) &&
+            Logic._currentPanel === "containersEdit") {
+          const element = selectables[e.keyCode - 48];
+          if (element) {
+            element.click();
+          }
+        }
+        break;
+      }
+    });
     return Promise.resolve(null);
   },
+  
 });
 
 // P_CONTAINER_EDIT: Editor for a container.

src/popup.html

@@ -98,9 +98,9 @@
     <div id="current-tab">
       <h3>Current Tab</h3>
       <div id="current-page"></div>
-      <label for="container-page-assigned">
+      <label for="container-page-assigned" id="container-page-assigned-label">
         <input type="checkbox" id="container-page-assigned" />
-        <span class="truncate-text" id="default-text">
+        <span class="truncate-text">
           Always open in
           <span id="current-container"></span>
         </span>