From 72cf4aab8ca4d8428442d5350b179e59af6a7867 Mon Sep 17 00:00:00 2001
From: sneak <sneak@sneak.berlin>
Date: Thu, 26 Feb 2026 16:04:23 +0700
Subject: [PATCH] Swap address row click behavior: row selects active, [info]
 opens detail

Clicking an address row now makes it the active address (bold title,
updates headline and active address display, broadcasts to dapps).
The [info] button on each row opens the address detail page. This
replaces the previous [ ]/ACTIVE toggle.
---
 src/popup/views/home.js | 42 ++++++++++++++++++++++-------------------
 1 file changed, 23 insertions(+), 19 deletions(-)

diff --git a/src/popup/views/home.js b/src/popup/views/home.js
index 6927716..845f961 100644
--- a/src/popup/views/home.js
+++ b/src/popup/views/home.js
@@ -103,17 +103,16 @@ function render(ctx) {
         wallet.addresses.forEach((addr, ai) => {
             html += `<div class="address-row py-1 border-b border-border-light cursor-pointer hover:bg-hover" data-wallet="${wi}" data-address="${ai}">`;
             const isActive = state.activeAddress === addr.address;
-            const activeHtml = isActive
-                ? `<span class="font-bold text-xs">ACTIVE</span>`
-                : `<span class="btn-select-active text-xs cursor-pointer" data-addr="${addr.address}">[ ]</span>`;
+            const infoBtn = `<span class="btn-addr-info text-xs cursor-pointer border border-border px-1 hover:bg-fg hover:text-bg" data-wallet="${wi}" data-address="${ai}">[info]</span>`;
             const dot = addressDotHtml(addr.address);
-            html += `<div class="text-xs font-bold">Address ${wi + 1}.${ai + 1}</div>`;
+            const titleBold = isActive ? "font-bold" : "";
+            html += `<div class="text-xs ${titleBold}">Address ${wi + 1}.${ai + 1}</div>`;
             if (addr.ensName) {
                 html += `<div class="text-xs font-bold flex items-center">${dot}${addr.ensName}</div>`;
             }
             html += `<div class="flex text-xs items-center justify-between">`;
             html += `<span class="flex items-center break-all">${addr.ensName ? "" : dot}${addr.address}</span>`;
-            html += `<span class="flex-shrink-0 ml-1">${activeHtml}</span>`;
+            html += `<span class="flex-shrink-0 ml-1">${infoBtn}</span>`;
             html += `</div>`;
             const addrUsd = formatUsd(getAddressValueUsd(addr));
             html += `<div class="text-xs text-muted text-right">${addrUsd}</div>`;
@@ -130,24 +129,29 @@ function render(ctx) {
     container.innerHTML = html;
 
     container.querySelectorAll(".address-row").forEach((row) => {
-        row.addEventListener("click", () => {
-            state.selectedWallet = parseInt(row.dataset.wallet, 10);
-            state.selectedAddress = parseInt(row.dataset.address, 10);
-            ctx.showAddressDetail();
+        row.addEventListener("click", async () => {
+            const wi = parseInt(row.dataset.wallet, 10);
+            const ai = parseInt(row.dataset.address, 10);
+            const addr = state.wallets[wi].addresses[ai].address;
+            if (state.activeAddress !== addr) {
+                state.activeAddress = addr;
+                await saveState();
+                render(ctx);
+                const runtime =
+                    typeof browser !== "undefined"
+                        ? browser.runtime
+                        : chrome.runtime;
+                runtime.sendMessage({ type: "AUTISTMASK_ACTIVE_CHANGED" });
+            }
         });
     });
 
-    container.querySelectorAll(".btn-select-active").forEach((btn) => {
-        btn.addEventListener("click", async (e) => {
+    container.querySelectorAll(".btn-addr-info").forEach((btn) => {
+        btn.addEventListener("click", (e) => {
             e.stopPropagation();
-            state.activeAddress = btn.dataset.addr;
-            await saveState();
-            render(ctx);
-            const runtime =
-                typeof browser !== "undefined"
-                    ? browser.runtime
-                    : chrome.runtime;
-            runtime.sendMessage({ type: "AUTISTMASK_ACTIVE_CHANGED" });
+            state.selectedWallet = parseInt(btn.dataset.wallet, 10);
+            state.selectedAddress = parseInt(btn.dataset.address, 10);
+            ctx.showAddressDetail();
         });
     });