fix: TxApproval links addresses to the explorer of the transaction's network (closes #631)

TxApproval built its From, Contract and decoded-action address links for
the active network, so a Sepolia transaction reviewed with mainnet active
linked to the mainnet explorer. approvalAddressHtml() now takes the
transaction's chain id and passes it to renderAddressHtml(), as SuccessTx
and ErrorTx do. A chain id that names no network has no explorer, so its
address lines are drawn without a link and the screen still shows. SignApproval
and SiteApproval still link for the active network. The walletDefects
fixture's numeric chain id, which names no network, is now the hex string
the background sends.

Model: opus-5-5

src/popup/views/approval.js

@@ -58,9 +58,15 @@ const { notify, runtimeApi, sendMessage } = require("../../shared/browserApi");
 
 const erc20Iface = new Interface(ERC20_ABI);
 
-function approvalAddressHtml(address) {
+// The link opens the explorer of the network with `chainId`, or of the active
+// network when none is given. A chain id that names no network has no
+// explorer, so the address is drawn without a link.
+function approvalAddressHtml(address, chainId) {
     const title = addressTitle(address, state.wallets);
-    return renderAddressHtml(address, { title });
+    if (chainId && !networkByChainId(chainId)) {
+        return renderAddressHtml(address, { title, noLink: true });
+    }
+    return renderAddressHtml(address, { title, chainId });
 }
 
 // The amount line for a decoded ERC-20 call. With a known scale it is the
@@ -338,8 +344,14 @@ function showTxApproval(details) {
         };
     }
 
+    // Every address link on this screen opens the explorer of the network the
+    // transaction is for, which the Network line names, whichever network is
+    // active.
     $("approve-tx-origin").textContent = details.origin;
-    $("approve-tx-from").innerHTML = approvalAddressHtml(details.approvedFrom);
+    $("approve-tx-from").innerHTML = approvalAddressHtml(
+        details.approvedFrom,
+        approvedTx.chainId,
+    );
 
     // Show token symbol next to contract address if known on the network the
     // transaction is for
@@ -349,7 +361,7 @@ function showTxApproval(details) {
         if (symbol) {
             toHtml += `<div class="font-bold mb-1">${escapeHtml(symbol)}</div>`;
         }
-        toHtml += approvalAddressHtml(toAddr);
+        toHtml += approvalAddressHtml(toAddr, approvedTx.chainId);
         $("approve-tx-to").innerHTML = toHtml;
     } else {
         $("approve-tx-to").innerHTML = escapeHtml(CONTRACT_CREATION_TEXT);
@@ -388,7 +400,10 @@ function showTxApproval(details) {
                 if (d.isToken) {
                     detailsHtml += `<div class="font-bold">${escapeHtml(tokenLabel(d.address, approvedTx.chainId) || "Unknown token")}</div>`;
                 }
-                detailsHtml += approvalAddressHtml(d.address);
+                detailsHtml += approvalAddressHtml(
+                    d.address,
+                    approvedTx.chainId,
+                );
             } else {
                 detailsHtml += `<div class="font-bold">${escapeHtml(d.value)}</div>`;
             }