v2.5.0: make key stats selection explicit

admin-web/static/app.js

@@ -1153,7 +1153,9 @@ function renderUsers() {
     return `
     <tr class="${user.enabled ? "" : "disabled-row"} ${pending ? "pending-row" : ""} ${selected ? "selected-row" : ""}" data-select-user-traffic="${escapeAttr(user.name)}" aria-selected="${selected ? "true" : "false"}">
       <td data-label="${escapeAttr(t("tableUser"))}">
-        <strong>${escapeHtml(user.name)}</strong>${user.main ? ` <small>${escapeHtml(t("main"))}</small>` : ""}
+        <button class="key-name-button" type="button" data-user-traffic="${escapeAttr(user.name)}">
+          <strong>${escapeHtml(user.name)}</strong>${user.main ? ` <small>${escapeHtml(t("main"))}</small>` : ""}
+        </button>
       </td>
       <td data-label="${escapeAttr(t("tableStatus"))}">
         <div class="status-control">

admin-web/static/index.html

@@ -400,6 +400,6 @@
       </div>
     </div>
   </div>
-  <script src="/app.js?v=2.5.0-admin14" type="module"></script>
+  <script src="/app.js?v=2.5.0-admin15" type="module"></script>
 </body>
 </html>

admin-web/static/styles.css

@@ -875,6 +875,25 @@ td small {
   white-space: nowrap;
 }
 
+.key-name-button {
+  min-height: auto;
+  padding: 0;
+  border-radius: 0;
+  background: transparent;
+  color: var(--text);
+  box-shadow: none;
+  display: inline-flex;
+  align-items: baseline;
+  gap: 5px;
+  text-align: left;
+}
+
+.key-name-button:hover {
+  color: var(--blue);
+  transform: none;
+  box-shadow: none;
+}
+
 .mini-actions {
   justify-content: flex-start;
   flex-wrap: nowrap;

tests/test_admin_features.py

@@ -136,6 +136,7 @@ class AdminFeatureTests(unittest.TestCase):
 
         self.assertNotIn('class="actions"', app_js)
         self.assertIn('class="action-buttons"', app_js)
+        self.assertIn('class="key-name-button"', app_js)
         self.assertNotIn("td.actions", styles)
         self.assertRegex(index, r'<table class="keys-table">[\s\S]*?<tbody id="usersTable">')