Swap address row click behavior: row selects active, [info] opens detail
Some checks failed
check / check (push) Has been cancelled
Some checks failed
check / check (push) Has been cancelled
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.
This commit is contained in:
@@ -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,17 +129,12 @@ 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();
|
||||
});
|
||||
});
|
||||
|
||||
container.querySelectorAll(".btn-select-active").forEach((btn) => {
|
||||
btn.addEventListener("click", async (e) => {
|
||||
e.stopPropagation();
|
||||
state.activeAddress = btn.dataset.addr;
|
||||
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 =
|
||||
@@ -148,6 +142,16 @@ function render(ctx) {
|
||||
? browser.runtime
|
||||
: chrome.runtime;
|
||||
runtime.sendMessage({ type: "AUTISTMASK_ACTIVE_CHANGED" });
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
container.querySelectorAll(".btn-addr-info").forEach((btn) => {
|
||||
btn.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
state.selectedWallet = parseInt(btn.dataset.wallet, 10);
|
||||
state.selectedAddress = parseInt(btn.dataset.address, 10);
|
||||
ctx.showAddressDetail();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user