fix: long symbols wrap on TxApproval and TransactionDetail, and SuccessTx keeps its amount and recipient (closes #743)
check / check (push) Waiting to run
e2e / e2e-chrome (push) Waiting to run
e2e / e2e-firefox (push) Waiting to run

TxApproval and TransactionDetail cut off a long symbol, amount or description at
the edge of the screen. These lines now wrap.

SuccessTx hid its Amount and To lines whenever it had a decoded action, even one
that showed neither. Each line is now hidden only when a readable decoded line
shows the same thing. A swap with no Amount line now shows its amount on
SuccessTx, as WaitTx and ErrorTx do.

Model: opus-5-5
This commit was merged in pull request #744.
This commit is contained in:
2026-11-03 12:27:20 +01:00
parent 1d40e2d7d5
commit 64ec571a17
11 changed files with 269 additions and 55 deletions
+22 -16
View File
@@ -321,10 +321,14 @@ function showSuccess(txInfo, txHash, blockNumber) {
ctx.doRefreshAndRender();
}
function readableLines(decoded) {
if (!decoded || !Array.isArray(decoded.details)) return [];
return decoded.details.filter(isReadableLine);
}
// The decoded action, or "" when no line of it can be read.
function decodedDetailsHtml(decoded, chainId) {
if (!decoded || !Array.isArray(decoded.details)) return "";
const lines = decoded.details.filter(isReadableLine);
const lines = readableLines(decoded);
if (lines.length === 0) return "";
let html = `<div class="border border-border border-dashed p-2 mb-3">`;
if (decoded.name && typeof decoded.name === "string") {
@@ -355,20 +359,22 @@ function renderSuccess() {
const decodedHtml = decodedDetailsHtml(d.decoded, d.chainId);
// When decoded details are present, the Amount and To are already
// shown inside the decoded well — hide the top-level duplicates.
const summarySection = $("success-tx-summary").parentElement;
const toSection = $("success-tx-to").parentElement;
if (decodedHtml) {
summarySection.classList.add("hidden");
toSection.classList.add("hidden");
} else {
summarySection.classList.remove("hidden");
toSection.classList.remove("hidden");
$("success-tx-summary").textContent =
d.amount + (d.symbol ? " " + d.symbol : "");
$("success-tx-to").innerHTML = toAddressHtml(d.to, d.chainId);
}
// Amount and To are hidden only when a readable decoded line shows the same
// thing: an `Amount` line, or a line with the address in `to`. Some swaps
// have no `Amount` line, and a saved record can have unreadable lines. An
// empty `to` is a contract creation, which no decoded line shows.
const lines = readableLines(d.decoded);
$("success-tx-summary").parentElement.classList.toggle(
"hidden",
lines.some((line) => line.label === "Amount"),
);
$("success-tx-to").parentElement.classList.toggle(
"hidden",
lines.some((line) => line.address && line.address === d.to),
);
$("success-tx-summary").textContent =
d.amount + (d.symbol ? " " + d.symbol : "");
$("success-tx-to").innerHTML = toAddressHtml(d.to, d.chainId);
$("success-tx-block").innerHTML = blockNumberHtml(d.blockNumber, d.chainId);
$("success-tx-hash").innerHTML = txHashHtml(d.hash, d.chainId);