fix: align receive view address display with addressDetail pattern

The receive view was using formatAddressHtml() which rendered addresses
with a different structure (bold title label above address) compared to
addressDetail's pattern (separate dot + full address + etherscan link
inline elements). This violated the display consistency policy.

Now uses the same element structure as addressDetail: separate
receive-address-dot, receive-address-full, and receive-etherscan-link
spans, with ENS name shown in a separate element matching addressDetail.

Closes #58

src/popup/index.html

@@ -463,12 +463,12 @@
                 </div>
 
                 <!-- ERC-20 token contract (hidden for ETH) -->
-                <div
-                    id="confirm-token-section"
-                    class="bg-hover rounded-md mx-1 p-3 mb-3 text-xs hidden"
-                >
-                    <div class="font-bold mb-2">Token Contract</div>
-                    <div id="confirm-token-contract" class="break-all"></div>
+                <div id="confirm-token-section" class="mb-3 hidden">
+                    <div class="text-xs text-muted mb-1">Token contract</div>
+                    <div
+                        id="confirm-token-contract"
+                        class="text-xs break-all"
+                    ></div>
                 </div>
 
                 <div class="mb-3">
@@ -637,10 +637,16 @@
                 <div class="flex justify-center mb-3">
                     <canvas id="receive-qr"></canvas>
                 </div>
+                <div
+                    id="receive-ens"
+                    class="font-bold mb-1 hidden flex items-center"
+                ></div>
                 <div
                     class="border border-border p-2 break-all mb-3 text-xs cursor-pointer"
+                    title="Click to copy"
                 >
-                    <span id="receive-address-block" class="select-all"></span>
+                    <span id="receive-address-dot"></span>
+                    <span id="receive-address-full"></span>
                     <span id="receive-etherscan-link"></span>
                 </div>
                 <button

src/popup/views/confirmTx.js

@@ -95,22 +95,10 @@ function show(txInfo) {
     // Token contract section (ERC-20 only)
     const tokenSection = $("confirm-token-section");
     if (isErc20) {
-        const dot = addressDotHtml(txInfo.token);
         const link = etherscanTokenLink(txInfo.token);
         $("confirm-token-contract").innerHTML =
-            `<div class="flex items-center">` +
-            dot +
-            `<span class="break-all underline decoration-dashed cursor-pointer" id="confirm-token-contract-copy" data-copy="${escapeHtml(txInfo.token)}">${escapeHtml(txInfo.token)}</span>` +
-            `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>` +
-            `</div>`;
-        if (txInfo.tokenName) {
-            $("confirm-token-contract").innerHTML +=
-                `<div class="mt-1"><span class="text-muted">Name:</span> ${escapeHtml(txInfo.tokenName)}</div>`;
-        }
-        if (txInfo.tokenSymbol) {
-            $("confirm-token-contract").innerHTML +=
-                `<div class="mt-1"><span class="text-muted">Symbol:</span> ${escapeHtml(txInfo.tokenSymbol)}</div>`;
-        }
+            escapeHtml(txInfo.token) +
+            ` <a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`;
         tokenSection.classList.remove("hidden");
     } else {
         tokenSection.classList.add("hidden");
@@ -285,13 +273,6 @@ function hidePasswordModal() {
 }
 
 function init(ctx) {
-    $("confirm-token-section").addEventListener("click", (e) => {
-        const copyEl = e.target.closest("[data-copy]");
-        if (copyEl) {
-            navigator.clipboard.writeText(copyEl.dataset.copy);
-        }
-    });
-
     $("btn-confirm-send").addEventListener("click", () => {
         showPasswordModal();
     });

src/popup/views/receive.js

@@ -2,8 +2,8 @@ const {
     $,
     showView,
     showFlash,
-    formatAddressHtml,
-    addressTitle,
+    addressDotHtml,
+    escapeHtml,
 } = require("./helpers");
 const { state, currentAddress } = require("../../shared/state");
 const QRCode = require("qrcode");
@@ -18,12 +18,17 @@ const EXT_ICON =
 function show() {
     const addr = currentAddress();
     const address = addr ? addr.address : "";
-    const title = address ? addressTitle(address, state.wallets) : null;
+    $("receive-address-dot").innerHTML = address ? addressDotHtml(address) : "";
+    $("receive-address-full").textContent = address;
+    $("receive-address-full").dataset.full = address;
     const ensName = addr ? addr.ensName || null : null;
-    $("receive-address-block").innerHTML = address
-        ? formatAddressHtml(address, ensName, null, title)
-        : "";
-    $("receive-address-block").dataset.full = address;
+    const ensEl = $("receive-ens");
+    if (ensName) {
+        ensEl.innerHTML = addressDotHtml(address) + escapeHtml(ensName);
+        ensEl.classList.remove("hidden");
+    } else {
+        ensEl.classList.add("hidden");
+    }
     const link = address ? `https://etherscan.io/address/${address}` : "";
     $("receive-etherscan-link").innerHTML = link
         ? `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`
@@ -60,8 +65,8 @@ function show() {
 }
 
 function init(ctx) {
-    $("receive-address-block").addEventListener("click", () => {
-        const addr = $("receive-address-block").dataset.full;
+    $("receive-address-full").addEventListener("click", () => {
+        const addr = $("receive-address-full").dataset.full;
         if (addr) {
             navigator.clipboard.writeText(addr);
             showFlash("Copied!");
@@ -69,7 +74,7 @@ function init(ctx) {
     });
 
     $("btn-receive-copy").addEventListener("click", () => {
-        const addr = $("receive-address-block").dataset.full;
+        const addr = $("receive-address-full").dataset.full;
         if (addr) {
             navigator.clipboard.writeText(addr);
             showFlash("Copied!");

src/popup/views/send.js

@@ -10,11 +10,7 @@ const {
 const { state, currentAddress } = require("../../shared/state");
 let ctx;
 const { getProvider } = require("../../shared/balances");
-const {
-    KNOWN_SYMBOLS,
-    TOKEN_BY_ADDRESS,
-    resolveSymbol,
-} = require("../../shared/tokenList");
+const { KNOWN_SYMBOLS, resolveSymbol } = require("../../shared/tokenList");
 
 const EXT_ICON =
     `<span style="display:inline-block;width:10px;height:10px;margin-left:4px;vertical-align:middle">` +
@@ -128,7 +124,6 @@ function init(_ctx) {
 
         let tokenSymbol = null;
         let tokenBalance = null;
-        let tokenName = null;
         if (token !== "ETH") {
             const tb = (addr.tokenBalances || []).find(
                 (t) => t.address.toLowerCase() === token.toLowerCase(),
@@ -139,17 +134,6 @@ function init(_ctx) {
                 state.trackedTokens,
             );
             tokenBalance = tb ? tb.balance || "0" : "0";
-            // Resolve token name from balances, tracked tokens, or known list
-            const lower = token.toLowerCase();
-            tokenName =
-                (tb && tb.name) ||
-                (
-                    (state.trackedTokens || []).find(
-                        (t) => t.address.toLowerCase() === lower,
-                    ) || {}
-                ).name ||
-                (TOKEN_BY_ADDRESS.get(lower) || {}).name ||
-                null;
         }
 
         ctx.showConfirmTx({
@@ -161,7 +145,6 @@ function init(_ctx) {
             balance: addr.balance,
             tokenSymbol: tokenSymbol,
             tokenBalance: tokenBalance,
-            tokenName: tokenName,
         });
     });