fix: long symbols wrap on TxApproval and TransactionDetail, and SuccessTx keeps its amount and recipient (closes #743)

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

tests/approvalBundledListSepolia.test.js

@@ -151,10 +151,10 @@ test("names no token, and states the amount in base units", async () => {
     expect(state.currentView).toBe("approve-tx");
     expect(node("approve-tx-to").innerHTML).not.toContain("USDC");
     expect(decodedLine("Token")).toContain(
-        '<div class="font-bold">Unknown token</div>',
+        '<div class="font-bold break-words">Unknown token</div>',
     );
     expect(decodedLine("Amount")).toContain(
-        '<div class="font-bold">1234500000 base units (decimals unknown)</div>',
+        '<div class="font-bold break-words">1234500000 base units (decimals unknown)</div>',
     );
 });
 
@@ -162,8 +162,10 @@ test("names no token, and states the amount in base units", async () => {
 test("a mainnet transfer of USDC is still named and scaled as USDC", async () => {
     await showTransfer(NETWORKS.mainnet.chainId);
     expect(state.currentView).toBe("approve-tx");
-    expect(decodedLine("Token")).toContain('<div class="font-bold">USDC</div>');
+    expect(decodedLine("Token")).toContain(
+        '<div class="font-bold break-words">USDC</div>',
+    );
     expect(decodedLine("Amount")).toContain(
-        '<div class="font-bold">1234.5000 USDC</div>',
+        '<div class="font-bold break-words">1234.5000 USDC</div>',
     );
 });