From efc98479203dddad88ae08ba85024c7a1c8a5aa8 Mon Sep 17 00:00:00 2001
From: Francis McKenzie <info@macca.tech>
Date: Mon, 16 May 2022 12:53:32 +0200
Subject: [PATCH] Wildcard subdomains - UI improvements

---
 src/css/popup.css |  6 +++++-
 src/js/popup.js   | 11 +++++++----
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/css/popup.css b/src/css/popup.css
index b46ffcb2e..b4be485a1 100644
--- a/src/css/popup.css
+++ b/src/css/popup.css
@@ -1601,7 +1601,11 @@ manage things like container crud */
 }
 
 #edit-sites-assigned .hostname .subdomain.wildcardSubdomain {
-  opacity: 0.2;
+  background-color: var(--identity-icon-color);
+  border-radius: 8px;
+  margin-right: 4px;
+  padding-left: 10px;
+  padding-right: 10px;
 }
 
 .assigned-sites-list > div {
diff --git a/src/js/popup.js b/src/js/popup.js
index db40ffcdb..2f8f8dc62 100644
--- a/src/js/popup.js
+++ b/src/js/popup.js
@@ -1373,6 +1373,7 @@ Logic.registerPanel(P_CONTAINER_ASSIGNMENTS, {
 
     // Populating the panel: name and icon
     document.getElementById("edit-assignments-title").textContent = identity.name;
+    document.getElementById("edit-sites-assigned").setAttribute("data-identity-color", identity.color);
 
     const userContextId = Logic.currentUserContextId();
     const assignments = await Logic.getAssignmentObjectByContainer(userContextId);
@@ -1423,7 +1424,7 @@ Logic.registerPanel(P_CONTAINER_ASSIGNMENTS, {
         });
         // Wildcard click-to-toggle subdomains
         trElement.querySelectorAll(".subdomain").forEach((subdomainLink) => {
-          subdomainLink.addEventListener("click", async (e) => {
+          subdomainLink.addEventListener("click", (e) => {
             const wildcardHostname = e.target.getAttribute("data-wildcardHostname");
             Utils.setWildcardHostnameForAssignment(assumedUrl, wildcardHostname);
             if (wildcardHostname) {
@@ -1450,14 +1451,14 @@ Logic.registerPanel(P_CONTAINER_ASSIGNMENTS, {
     if (wildcardHostname && wildcardHostname !== hostname) {
       if (hostname.endsWith(wildcardHostname)) {
         return {
-          wildcard: hostname.substring(0, hostname.length - wildcardHostname.length),
+          wildcard: "★",
           remaining: wildcardHostname
         };
       } else {
         // In case something got corrupted, allow user to fix error
-        // by clicking "____" link to clear corrupted wildcard hostname
+        // by clicking '★' link to clear corrupted wildcard hostname
         return {
-          wildcard: "___",
+          wildcard: "★",
           remaining: hostname
         };
       }
@@ -1476,6 +1477,7 @@ Logic.registerPanel(P_CONTAINER_ASSIGNMENTS, {
     // Add wildcard subdomain(s)
     if (subdomains.wildcard) {
       result.appendChild(this.assignmentSubdomainLink(null, subdomains.wildcard));
+      result.appendChild(document.createTextNode("."));
     }
 
     // Add non-wildcard subdomains
@@ -1499,6 +1501,7 @@ Logic.registerPanel(P_CONTAINER_ASSIGNMENTS, {
     result.className = "subdomain";
     if (wildcardHostnameOnClick) {
       result.setAttribute("data-wildcardHostname", wildcardHostnameOnClick);
+      result.title = `*.${wildcardHostnameOnClick}`;
     } else {
       result.classList.add("wildcardSubdomain");
     }