Fix send-flow asset list formatting (asset code + Stellar Lumens)#2884
Fix send-flow asset list formatting (asset code + Stellar Lumens)#2884piyalbasu wants to merge 10 commits into
Conversation
In the send flow asset picker (TokenList), each row now shows the asset code after the balance amount on the second line (e.g. "100 XLM" instead of "100"), and the native asset's first line reads "Stellar Lumens" instead of "XLM". Mirrors freighter-mobile's balance row formatting. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
PR Preview build is ready: https://github.com/stellar/freighter/releases/tag/untagged-371e1ddfc49e0eaeb469 (SDF collaborators only — install instructions in the release description) |
The blockaidScan swap tests asserted the asset row was visible via a loose
getByText(/USDC/) / getByText(/XLM/) locator, then clicked the row's
-balance testid. Now that the row's second line includes the asset code
("100 USDC"), the regex matches both the heading and the balance line,
tripping Playwright strict mode. Assert visibility on the -balance testid
the test already clicks, which is unambiguous and intention-revealing.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
0e5440e to
3a7c971
Compare
|
Codex usage limits have been reached for code reviews. Please check with the admins of this repo to increase the limits by adding credits. |
There was a problem hiding this comment.
Pull request overview
This PR fixes formatting in the Send/Swap asset picker so each asset row displays the balance with its asset code (e.g. 100 XLM), and the native asset label is shown as “Stellar Lumens” (localized) instead of “XLM”, aligning the extension picker with the freighter-mobile presentation.
Changes:
- Update the picker row UI to append the asset code to the displayed balance amount.
- Render “Stellar Lumens” (via i18n) as the native asset display name in the picker.
- Adjust Blockaid swap E2E tests to avoid strict-mode text locator ambiguity by switching to testid-based selection.
Reviewed changes
Copilot reviewed 7 out of 7 changed files in this pull request and generated 8 comments.
Show a summary per file
| File | Description |
|---|---|
| extension/src/popup/components/InternalTransaction/TokenList/index.tsx | Updates asset picker row display for native asset naming and <amount> <code> formatting. |
| extension/src/popup/locales/en/translation.json | Adds i18n key/value for “Stellar Lumens”. |
| extension/src/popup/locales/pt/translation.json | Adds i18n key/value for “Stellar Lumens”. |
| extension/e2e-tests/blockaidScan.safe.test.ts | Updates swap picker assertions/selectors to avoid duplicate text matches under strict mode. |
| extension/e2e-tests/blockaidScan.suspicious.test.ts | Same as above for suspicious scan scenario coverage. |
| extension/e2e-tests/blockaidScan.malicious.test.ts | Same as above for malicious scan scenario coverage. |
| extension/e2e-tests/blockaidScan.unable.test.ts | Same as above for unable-to-scan scenario coverage. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Address review feedback: select the picker row by its canonical
data-testid (SendRow-native / SendRow-USDC:${USDC_ISSUER}) instead of the
code-based XLM-balance / USDC-balance testids. The canonical id encodes the
issuer, so it stays unique under Playwright strict mode even if two assets
share a code, and matches the SendRow-native selector already used elsewhere
in these tests.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The send-flow asset picker passed isShowingHeader={false}, hiding the
TokenList section header while still rendering a "Collectibles" header
below it. Enable the existing header so the token list is labeled, matching
freighter-mobile's "Your tokens" section header in its picker.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
freighter-mobile's send picker labels the section "Tokens" (balancesList.title), not "Your Tokens". Match that wording. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The send-picker "Tokens" header had no font styling. Add the same font-size/line-height/weight/color as the sibling "Collectibles" heading in SendDestinationAsset so the two section headers look consistent. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Match freighter-mobile: show a Coins03 icon before the "Tokens" header and an Image01 icon before the "Collectibles" header. Icons inherit the header's gray color via currentColor; the Collectibles heading gets flex alignment + svg spacing to match the Tokens header. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The send picker now shows "<amount> <code>" on the second line, so
getByText("E2E") matched both the row heading and the balance line.
Select the row by its canonical SendRow-E2E:<contractId> testid instead.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
The swap-src picker now shows "<amount> <code>", so getByText(/FOO/) matched both the row heading and the balance line. Assert on the FOO-balance testid instead (consistent with the sibling BAZ/PBT/XLM balance assertions in the same test). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
…-list-formatting # Conflicts: # extension/e2e-tests/blockaidScan.malicious.test.ts # extension/e2e-tests/blockaidScan.safe.test.ts # extension/e2e-tests/blockaidScan.suspicious.test.ts # extension/e2e-tests/blockaidScan.unable.test.ts # extension/e2e-tests/sendPayment.test.ts

TL;DR
Fixes a formatting bug in the send flow's asset picker. When you tap Send and choose which asset to send, each row now shows the asset code next to the balance (e.g.
100 XLMinstead of a bare100), and the native asset's title reads Stellar Lumens instead of XLM — matching how freighter-mobile presents these rows. The same picker is used by the swap flow, so both benefit.Implementation details (for agents)
What changed: the send-flow picker component —
extension/src/popup/components/InternalTransaction/TokenList/index.tsx(mounted by both the send and swap pickers).{displayTotal}(amount only). It now renders{displayTotal} {code}, appending the token code. Mirrors the existingSelectAssetRowspattern and freighter-mobile'sformatTokenForDisplay(${amount} ${code}).isNativecheck and the heading now renders{isNative ? t("Stellar Lumens") : title(balance)}instead of the bare code (title()returns"XLM"for native). "Stellar Lumens" is added as an i18n key.Test fix: because the picker rows now show
<amount> <code>, the swap-flow assertions in theblockaidScan.*e2e tests that used a loosegetByText(/USDC/)/getByText(/XLM/)matched two elements (heading + balance line) under Playwright strict mode. Those were repointed to the-balancetestid the tests already click, inblockaidScan.{suspicious,malicious,safe,unable}.test.ts.Verification:
tsc --noEmit+eslint: clean; pre-commit build/lint/i18n passed.blockaidScanswap tests pass with retries off.Follow-ups / out of scope: the centralized
getDisplayNamerefactor across all balance surfaces is staged on branchparity/native-asset-display-nameand will open as a separate PR after #2872 lands (it needs to re-home the formatting into #2872's newBalanceRow).