Surfaced during #879 (Swap to new token) but kept out of scope to keep that PR shorter.
Several screens overflow or truncate awkwardly when the token code is long or when the exchange rate has many digits.
Affected surfaces
- History details (
HistoryScreen/TransactionDetailsContent.tsx)
- Transaction details (the shared details sheet used across Send/Swap/WalletConnect)
- Transaction review screens (Send review, Swap review)
What to do
- Check if we have the same issue on extension. If not, check the solution we are using there.
- Audit each affected screen for fixed-width text containers and side-by-side rows that can collide.
- Decide per-row how to handle overflow. e.g.:
numberOfLines={1} + ellipsizeMode (tail / middle), wrap to a second line, or shrink-to-fit (adjustsFontSizeToFit where appropriate).
- Add visual regression coverage with a long-token-code fixture so this doesn't regress.
Repro
Easiest repro is to swap or send a token with a 12-char asset code, or to swap with an exchange rate that renders many digits (e.g. tiny-fraction tokens).
Surfaced during #879 (Swap to new token) but kept out of scope to keep that PR shorter.
Several screens overflow or truncate awkwardly when the token code is long or when the exchange rate has many digits.
Affected surfaces
HistoryScreen/TransactionDetailsContent.tsx)What to do
numberOfLines={1}+ellipsizeMode(tail / middle), wrap to a second line, or shrink-to-fit (adjustsFontSizeToFitwhere appropriate).Repro
Easiest repro is to swap or send a token with a 12-char asset code, or to swap with an exchange rate that renders many digits (e.g. tiny-fraction tokens).