diff --git a/src/popup/views/addressDetail.js b/src/popup/views/addressDetail.js index 3f4f4f1..20676aa 100644 --- a/src/popup/views/addressDetail.js +++ b/src/popup/views/addressDetail.js @@ -4,6 +4,7 @@ const { showFlash, balanceLinesForAddress, addressDotHtml, + addressTitle, escapeHtml, truncateMiddle, } = require("./helpers"); @@ -190,12 +191,14 @@ function renderTransactions(txs) { ? tx.to : tx.from; const ensName = ensNameMap.get(counterparty) || null; + const title = addressTitle(counterparty, state.wallets); const dirLabel = tx.directionLabel; const amountStr = tx.value ? escapeHtml(tx.value + " " + tx.symbol) : escapeHtml(tx.symbol); const maxAddr = Math.max(32, 36 - Math.max(0, amountStr.length - 10)); - const displayAddr = ensName || truncateMiddle(counterparty, maxAddr); + const displayAddr = + title || ensName || truncateMiddle(counterparty, maxAddr); const addrStr = escapeHtml(displayAddr); const dot = addressDotHtml(counterparty); const err = tx.isError ? " (failed)" : ""; diff --git a/src/popup/views/addressToken.js b/src/popup/views/addressToken.js index 1284029..274a5f7 100644 --- a/src/popup/views/addressToken.js +++ b/src/popup/views/addressToken.js @@ -6,6 +6,7 @@ const { showView, showFlash, addressDotHtml, + addressTitle, escapeHtml, truncateMiddle, balanceLine, @@ -250,12 +251,14 @@ function renderTransactions(txs) { for (const tx of txs) { const counterparty = tx.direction === "sent" ? tx.to : tx.from; const ensName = ensNameMap.get(counterparty) || null; + const title = addressTitle(counterparty, state.wallets); const dirLabel = tx.directionLabel; const amountStr = tx.value ? escapeHtml(tx.value + " " + tx.symbol) : escapeHtml(tx.symbol); const maxAddr = Math.max(32, 36 - Math.max(0, amountStr.length - 10)); - const displayAddr = ensName || truncateMiddle(counterparty, maxAddr); + const displayAddr = + title || ensName || truncateMiddle(counterparty, maxAddr); const addrStr = escapeHtml(displayAddr); const dot = addressDotHtml(counterparty); const err = tx.isError ? " (failed)" : ""; diff --git a/src/popup/views/approval.js b/src/popup/views/approval.js index 58319ed..abd29c7 100644 --- a/src/popup/views/approval.js +++ b/src/popup/views/approval.js @@ -1,4 +1,10 @@ -const { $, addressDotHtml, escapeHtml, showView } = require("./helpers"); +const { + $, + addressDotHtml, + addressTitle, + escapeHtml, + showView, +} = require("./helpers"); const { state, saveState } = require("../../shared/state"); const { formatEther, formatUnits, Interface, toUtf8String } = require("ethers"); const { ERC20_ABI } = require("../../shared/constants"); @@ -22,7 +28,15 @@ function approvalAddressHtml(address) { const dot = addressDotHtml(address); const link = `https://etherscan.io/address/${address}`; const extLink = `${EXT_ICON}`; - return `
${dot}${escapeHtml(address)}${extLink}
`; + const title = addressTitle(address, state.wallets); + let html = ""; + if (title) { + html += `
${dot}${escapeHtml(title)}
`; + html += `
${escapeHtml(address)}${extLink}
`; + } else { + html += `
${dot}${escapeHtml(address)}${extLink}
`; + } + return html; } function formatTxValue(val) { diff --git a/src/popup/views/home.js b/src/popup/views/home.js index 78fbff2..cb7cd24 100644 --- a/src/popup/views/home.js +++ b/src/popup/views/home.js @@ -6,6 +6,7 @@ const { isoDate, timeAgo, addressDotHtml, + addressTitle, escapeHtml, truncateMiddle, } = require("./helpers"); @@ -110,8 +111,9 @@ function renderHomeTxList(ctx) { const amountStr = tx.value ? escapeHtml(tx.value + " " + tx.symbol) : escapeHtml(tx.symbol); + const title = addressTitle(counterparty, state.wallets); const maxAddr = Math.max(32, 36 - Math.max(0, amountStr.length - 10)); - const displayAddr = truncateMiddle(counterparty, maxAddr); + const displayAddr = title || truncateMiddle(counterparty, maxAddr); const addrStr = escapeHtml(displayAddr); const dot = addressDotHtml(counterparty); const err = tx.isError ? " (failed)" : ""; diff --git a/src/popup/views/send.js b/src/popup/views/send.js index d96d5b7..6a7b630 100644 --- a/src/popup/views/send.js +++ b/src/popup/views/send.js @@ -1,6 +1,12 @@ // Send view: collect To, Amount, Token. Then go to confirmation. -const { $, showFlash, addressDotHtml, escapeHtml } = require("./helpers"); +const { + $, + showFlash, + addressDotHtml, + addressTitle, + escapeHtml, +} = require("./helpers"); const { state, currentAddress } = require("../../shared/state"); let ctx; const { getProvider } = require("../../shared/balances"); @@ -44,8 +50,15 @@ function updateSendBalance() { const dot = addressDotHtml(addr.address); const link = `https://etherscan.io/address/${addr.address}`; const extLink = `${EXT_ICON}`; + const title = addressTitle(addr.address, state.wallets); let fromHtml = ""; - if (addr.ensName) { + if (title) { + fromHtml += `
${dot}${escapeHtml(title)}
`; + if (addr.ensName) { + fromHtml += `
${escapeHtml(addr.ensName)}
`; + } + fromHtml += `
${escapeHtml(addr.address)}${extLink}
`; + } else if (addr.ensName) { fromHtml += `
${dot}${escapeHtml(addr.ensName)}
`; fromHtml += `
${escapeHtml(addr.address)}${extLink}
`; } else { diff --git a/src/popup/views/txStatus.js b/src/popup/views/txStatus.js index a36fd31..a755b84 100644 --- a/src/popup/views/txStatus.js +++ b/src/popup/views/txStatus.js @@ -5,6 +5,7 @@ const { showView, showFlash, addressDotHtml, + addressTitle, escapeHtml, } = require("./helpers"); const { state, saveState } = require("../../shared/state"); @@ -37,6 +38,13 @@ function toAddressHtml(address) { const dot = addressDotHtml(address); const link = `https://etherscan.io/address/${address}`; const extLink = `${EXT_ICON}`; + const title = addressTitle(address, state.wallets); + if (title) { + return ( + `
${dot}${escapeHtml(title)}
` + + `
${escapeHtml(address)}${extLink}
` + ); + } return `
${dot}${escapeHtml(address)}${extLink}
`; }