fix: resolve token symbols from multiple sources (closes #51)

When tokenBalances doesn't contain an entry for a token (e.g. before
balances are fetched), the symbol fell back to '?' in addressToken
and send views.

Add resolveSymbol() helper that checks tokenBalances → TOKEN_BY_ADDRESS
(known tokens) → trackedTokens → truncated address as last resort.

Fixes USDC and other known tokens showing '?' when balance data
hasn't loaded yet.

src/popup/views/addressToken.js

@@ -12,7 +12,7 @@ const {
     balanceLine,
 } = require("./helpers");
 const { state, currentAddress, saveState } = require("../../shared/state");
-const { TOKEN_BY_ADDRESS } = require("../../shared/tokenList");
+const { TOKEN_BY_ADDRESS, resolveSymbol } = require("../../shared/tokenList");
 const {
     formatUsd,
     getPrice,
@@ -96,14 +96,11 @@ function show() {
         const tb = (addr.tokenBalances || []).find(
             (t) => t.address.toLowerCase() === tokenId.toLowerCase(),
         );
-        const tracked = (state.trackedTokens || []).find(
-            (t) => t.address.toLowerCase() === tokenId.toLowerCase(),
+        symbol = resolveSymbol(
+            tokenId,
+            addr.tokenBalances,
+            state.trackedTokens,
         );
-        symbol =
-            (tb && tb.symbol) ||
-            (tracked && tracked.symbol) ||
-            (knownToken && knownToken.symbol) ||
-            "?";
         amount = tb ? parseFloat(tb.balance || "0") : 0;
         price = getPrice(symbol);
     }

src/popup/views/approval.js

@@ -167,11 +167,9 @@ function showTxApproval(details) {
         tokenSymbol: token ? token.symbol : null,
     };
 
-    // If this is an ERC-20 call or a swap, extract the real recipient, amount, and token info
+    // If this is an ERC-20 call, try to extract the real recipient and amount
     const decoded = decodeCalldata(details.txParams.data, toAddr || "");
     if (decoded && decoded.details) {
-        let decodedTokenSymbol = null;
-        let decodedTokenAddress = null;
         for (const d of decoded.details) {
             if (d.label === "Recipient" && d.address) {
                 pendingTxDetails.to = d.address;
@@ -179,19 +177,10 @@ function showTxApproval(details) {
             if (d.label === "Amount") {
                 pendingTxDetails.amount = d.rawValue || d.value;
             }
-            if (d.label === "Token In" && !decodedTokenSymbol) {
-                // Extract token symbol and address from decoded details
-                decodedTokenSymbol = d.value;
-                if (d.address) decodedTokenAddress = d.address;
-            }
         }
         if (token) {
             pendingTxDetails.token = toAddr;
             pendingTxDetails.tokenSymbol = token.symbol;
-        } else if (decodedTokenAddress) {
-            // For swaps through routers: use the input token info
-            pendingTxDetails.token = decodedTokenAddress;
-            pendingTxDetails.tokenSymbol = decodedTokenSymbol;
         }
     }
 

src/popup/views/send.js

@@ -10,7 +10,7 @@ const {
 const { state, currentAddress } = require("../../shared/state");
 let ctx;
 const { getProvider } = require("../../shared/balances");
-const { KNOWN_SYMBOLS, TOKEN_BY_ADDRESS } = require("../../shared/tokenList");
+const { KNOWN_SYMBOLS, resolveSymbol } = require("../../shared/tokenList");
 
 const EXT_ICON =
     `<span style="display:inline-block;width:10px;height:10px;margin-left:4px;vertical-align:middle">` +
@@ -73,15 +73,11 @@ function updateSendBalance() {
         const tb = (addr.tokenBalances || []).find(
             (t) => t.address.toLowerCase() === token.toLowerCase(),
         );
-        const knownToken = TOKEN_BY_ADDRESS.get(token.toLowerCase());
-        const tracked = (state.trackedTokens || []).find(
-            (t) => t.address.toLowerCase() === token.toLowerCase(),
+        const symbol = resolveSymbol(
+            token,
+            addr.tokenBalances,
+            state.trackedTokens,
         );
-        const symbol =
-            (tb && tb.symbol) ||
-            (tracked && tracked.symbol) ||
-            (knownToken && knownToken.symbol) ||
-            "?";
         const bal = tb ? tb.balance || "0" : "0";
         $("send-balance").textContent =
             "Current balance: " + bal + " " + symbol;
@@ -132,15 +128,11 @@ function init(_ctx) {
             const tb = (addr.tokenBalances || []).find(
                 (t) => t.address.toLowerCase() === token.toLowerCase(),
             );
-            const knownTk = TOKEN_BY_ADDRESS.get(token.toLowerCase());
-            const trackedTk = (state.trackedTokens || []).find(
-                (t) => t.address.toLowerCase() === token.toLowerCase(),
+            tokenSymbol = resolveSymbol(
+                token,
+                addr.tokenBalances,
+                state.trackedTokens,
             );
-            tokenSymbol =
-                (tb && tb.symbol) ||
-                (trackedTk && trackedTk.symbol) ||
-                (knownTk && knownTk.symbol) ||
-                "?";
             tokenBalance = tb ? tb.balance || "0" : "0";
         }
 

src/shared/tokenList.js

@@ -3645,10 +3645,27 @@ async function getTopTokenPrices(n) {
     return prices;
 }
 
+// Resolve a token symbol from multiple sources, never returning "?".
+function resolveSymbol(tokenAddress, tokenBalances, trackedTokens) {
+    const lower = (tokenAddress || "").toLowerCase();
+    const tb = (tokenBalances || []).find(
+        (t) => t.address.toLowerCase() === lower,
+    );
+    if (tb && tb.symbol) return tb.symbol;
+    const known = TOKEN_BY_ADDRESS.get(lower);
+    if (known && known.symbol) return known.symbol;
+    const tracked = (trackedTokens || []).find(
+        (t) => t.address.toLowerCase() === lower,
+    );
+    if (tracked && tracked.symbol) return tracked.symbol;
+    return lower.slice(0, 10) + "\u2026";
+}
+
 module.exports = {
     TOKENS,
     TOKEN_BY_ADDRESS,
     KNOWN_SYMBOLS,
     getTopTokens,
     getTopTokenPrices,
+    resolveSymbol,
 };

src/shared/uniswap.js

@@ -445,19 +445,12 @@ function decode(data, toAddress) {
             const maxUint160 = BigInt(
                 "0xffffffffffffffffffffffffffffffffffffffff",
             );
-            const rawAmount =
-                inputAmount >= maxUint160
-                    ? "Unlimited"
-                    : formatAmount(inputAmount, inInfo.decimals);
             const amountStr =
                 inputAmount >= maxUint160
                     ? "Unlimited"
-                    : rawAmount + (inSymbol ? " " + inSymbol : "");
-            details.push({
-                label: "Amount",
-                value: amountStr,
-                rawValue: rawAmount,
-            });
+                    : formatAmount(inputAmount, inInfo.decimals) +
+                      (inSymbol ? " " + inSymbol : "");
+            details.push({ label: "Amount", value: amountStr });
         }
 
         if (outSymbol) {