fix: unify address display with shared renderAddressHtml utility
All checks were successful
check / check (push) Successful in 26s
All checks were successful
check / check (push) Successful in 26s
All address rendering now uses a single renderAddressHtml() function in helpers.js that produces consistent output everywhere: - Color dot (deterministic from address) - Full address with dashed-underline click-to-copy affordance - Etherscan external link icon Refactored all callsites across 9 view files: - approval.js: approvalAddressHtml now delegates to renderAddressHtml, added attachCopyHandlers for click-to-copy on approve-tx/sign/site views - confirmTx.js: confirmAddressHtml uses renderAddressHtml, token contract address uses renderAddressHtml with attachCopyHandlers - txStatus.js: toAddressHtml delegates to renderAddressHtml - transactionDetail.js: txAddressHtml delegates to renderAddressHtml, decoded calldata addresses use renderAddressHtml - home.js: active address display uses renderAddressHtml - send.js: from-address display uses renderAddressHtml - receive.js: address block uses formatAddressHtml (which delegates to renderAddressHtml), removed separate etherscan link element - addressDetail.js: address line uses renderAddressHtml, export-privkey address uses renderAddressHtml - addressToken.js: address line and contract info use renderAddressHtml Also consolidated: - EXT_ICON SVG constant moved to helpers.js (removed 6 duplicates) - copyableHtml() moved to helpers.js (removed duplicate in transactionDetail) - etherscanLinkHtml() moved to helpers.js (removed duplicates) - attachCopyHandlers() moved to helpers.js (removed duplicate in txStatus) - Removed unused local functions (etherscanTokenLink, etherscanAddressLink) - Cleaned up unused imports across all files closes #97
This commit is contained in:
@@ -5,17 +5,11 @@ const {
|
||||
flashCopyFeedback,
|
||||
formatAddressHtml,
|
||||
addressTitle,
|
||||
attachCopyHandlers,
|
||||
} = require("./helpers");
|
||||
const { state, currentAddress, currentNetwork } = require("../../shared/state");
|
||||
const QRCode = require("qrcode");
|
||||
|
||||
const EXT_ICON =
|
||||
`<span style="display:inline-block;width:10px;height:10px;margin-left:4px;vertical-align:middle">` +
|
||||
`<svg viewBox="0 0 12 12" fill="none" stroke="currentColor" stroke-width="1.5">` +
|
||||
`<path d="M4.5 1.5H2a.5.5 0 00-.5.5v8a.5.5 0 00.5.5h8a.5.5 0 00.5-.5V7.5"/>` +
|
||||
`<path d="M7 1.5h3.5V5M7 5.5L10.5 1.5"/>` +
|
||||
`</svg></span>`;
|
||||
|
||||
function show() {
|
||||
const addr = currentAddress();
|
||||
const address = addr ? addr.address : "";
|
||||
@@ -25,11 +19,8 @@ function show() {
|
||||
? formatAddressHtml(address, ensName, null, title)
|
||||
: "";
|
||||
$("receive-address-block").dataset.full = address;
|
||||
const net = currentNetwork();
|
||||
const link = address ? `${net.explorerUrl}/address/${address}` : "";
|
||||
$("receive-etherscan-link").innerHTML = link
|
||||
? `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`
|
||||
: "";
|
||||
// Etherscan link is now included in formatAddressHtml via renderAddressHtml
|
||||
$("receive-etherscan-link").innerHTML = "";
|
||||
if (address) {
|
||||
QRCode.toCanvas($("receive-qr"), address, {
|
||||
width: 200,
|
||||
@@ -62,18 +53,10 @@ function show() {
|
||||
warningEl.style.visibility = "hidden";
|
||||
}
|
||||
showView("receive");
|
||||
attachCopyHandlers("view-receive");
|
||||
}
|
||||
|
||||
function init(ctx) {
|
||||
$("receive-address-block").addEventListener("click", (e) => {
|
||||
const addr = $("receive-address-block").dataset.full;
|
||||
if (addr) {
|
||||
navigator.clipboard.writeText(addr);
|
||||
showFlash("Copied!");
|
||||
flashCopyFeedback(e.currentTarget);
|
||||
}
|
||||
});
|
||||
|
||||
$("btn-receive-copy").addEventListener("click", () => {
|
||||
const addr = $("receive-address-block").dataset.full;
|
||||
if (addr) {
|
||||
|
||||
Reference in New Issue
Block a user