Repository navigation
feat(wallet): prefix fiat amounts with currency symbols - #535
Merged
Merged
Conversation
Amounts previously rendered with a trailing ISO code (`100.00 USD`, `50.00 EUR`) now use the common Unicode currency symbol as a prefix: `$100.00`, `€50.00`, `£25.00`, `¥1,000`. Currencies without a widely-used single-char symbol (CHF, CNY) keep the trailing-code form, so CNY does not collide with JPY's `¥`. The new formatters live alongside the existing generic ones: - `prettyFiatAmount(amount, currency)` and `prettyFiatHide(value, currency)` in `src/lib/format.ts` take the `Fiats` enum as a typed parameter. - The generic `prettyAmount` / `prettyHide` are intentionally left untouched so asset tickers (e.g. a stablecoin named `USD`) that flow through those helpers keep their trailing-code format. - Decimals are derived from the currency via `fiatDecimalsFor` in `src/lib/fiat.ts` (JPY = 0, others = 2) — shared between `FiatContext` and `prettyFiatAmount` so call sites no longer need to pass `fiatDecimals()`. Touched displays: hero balance (`Balance.tsx`), transaction list rows (`TransactionsList.tsx`), amount picker (`Keyboard.tsx`), transaction details (`Details.tsx`), Send/Receive/Notes success screens, and Send form available caption. Amount input labels (`InputAmount.tsx`) also use the symbol when available. Side fix: `Details.tsx` previously called `prettyAmount` without passing `fiatDecimals()`, hardcoding 2 decimals. JPY now renders as `¥174` / `¥0` in the transaction details instead of `174.00 JPY` / `0.00 JPY`. Hero alignment: the eye-toggle button wrapper now omits an empty unit `<Text>` when the symbol is inlined into the balance, and the button sits inside a `alignItems: center` flex container next to the unit text — keeping the icon centered with the smaller ISO code in the CHF case and snug against the balance in the `$7.30` case. Tests: - New coverage for `prettyFiatAmount` and `prettyFiatHide` in `src/test/lib/format.test.ts` (symbol + trailing-code + JPY 0-decimals). - Existing `prettyAmount` / `prettyHide` tests unchanged — the generic helpers still behave the same. - UI assertions updated to match the new rendered text: `src/test/screens/wallet/index.test.tsx` → `$0.00` `src/test/e2e/init.test.ts` → `$0.00` `src/test/e2e/keyboard.test.ts` → symbol-prefix regex
Contributor
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (4)
✅ Files skipped from review due to trivial changes (2)
🚧 Files skipped from review as they are similar to previous changes (2)
WalkthroughCentralizes fiat symbol/decimal logic and adds dedicated fiat formatting. Introduces Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Suggested reviewers
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Deploying wallet-bitcoin with
|
| Latest commit: |
721e94d
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://2ca7cc9d.wallet-bitcoin.pages.dev |
| Branch Preview URL: | https://wt-fiat-symbol-prefix-202604.wallet-bitcoin.pages.dev |
Deploying wallet-mutinynet with
|
| Latest commit: |
721e94d
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://53f00574.arkade-wallet.pages.dev |
| Branch Preview URL: | https://wt-fiat-symbol-prefix-202604.arkade-wallet.pages.dev |
Deploying tmp-boltz-upstream-mainnet-arkade-wallet with
|
| Latest commit: |
721e94d
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://7e5fa3e1.tmp-boltz-upstream-mainnet-arkade-wallet.pages.dev |
| Branch Preview URL: | https://wt-fiat-symbol-prefix-202604.tmp-boltz-upstream-mainnet-arkade-wallet.pages.dev |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
🧹 Nitpick comments (1)
src/components/Balance.tsx (1)
22-30: Consider usingprettyFiatAmount/prettyFiatHidefor consistency.This component manually handles symbol prefixing with
fiatBalanceRawand the conditionalfiatBalanceconstruction, while other components in this PR (Details, TransactionsList, Send/Success, Send/Form) useprettyFiatAmountandprettyFiatHidewhich encapsulate this logic.The current implementation is functionally correct, but the symbol-prefixing logic is duplicated. Consolidating to the centralized helpers would reduce maintenance burden.
♻️ Suggested refactor using centralized helpers
-import { prettyHide, prettyNumber } from '../lib/format' -import { FIAT_SYMBOLS } from '../lib/fiat' +import { prettyHide, prettyNumber, prettyFiatAmount, prettyFiatHide } from '../lib/format' +import { FIAT_SYMBOLS, fiatDecimalsFor } from '../lib/fiat'Then in the component body:
- const { toFiat, fiatDecimals } = useContext(FiatContext) + const { toFiat } = useContext(FiatContext) const fiatAmount = toFiat(amount) const showFiat = config.currencyDisplay === CurrencyDisplay.Fiat const fiatSymbol = FIAT_SYMBOLS[config.fiat] const satsBalance = config.showBalance ? prettyNumber(amount) : prettyHide(amount, '') - const fiatBalanceRaw = config.showBalance - ? prettyNumber(fiatAmount, fiatDecimals(), true, fiatDecimals()) - : prettyHide(fiatAmount, '') - // prettyHide returns '' for a zero balance; skip the symbol prefix to avoid a lone "$". - const fiatBalance = fiatSymbol && fiatBalanceRaw ? `${fiatSymbol}${fiatBalanceRaw}` : fiatBalanceRaw + const fiatBalance = config.showBalance + ? prettyFiatAmount(fiatAmount, config.fiat) + : prettyFiatHide(fiatAmount, config.fiat)🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/components/Balance.tsx` around lines 22 - 30, The fiat formatting duplicates symbol-prefixing logic; replace the manual construction using FIAT_SYMBOLS, fiatSymbol, fiatBalanceRaw and fiatUnit with the centralized helpers prettyFiatAmount and prettyFiatHide: when config.showBalance is true call prettyFiatAmount(fiatAmount, config.fiat) (or the project’s signature that accepts decimals) and when hidden call prettyFiatHide(fiatAmount, config.fiat), then use those results directly for display instead of building `${fiatSymbol}${fiatBalanceRaw}` or computing fiatUnit, and remove the now-unused prettyHide/prettyNumber prefix logic in Balance (referencing fiatAmount, fiatDecimals, prettyHide, prettyNumber).
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@src/components/Balance.tsx`:
- Around line 22-30: The fiat formatting duplicates symbol-prefixing logic;
replace the manual construction using FIAT_SYMBOLS, fiatSymbol, fiatBalanceRaw
and fiatUnit with the centralized helpers prettyFiatAmount and prettyFiatHide:
when config.showBalance is true call prettyFiatAmount(fiatAmount, config.fiat)
(or the project’s signature that accepts decimals) and when hidden call
prettyFiatHide(fiatAmount, config.fiat), then use those results directly for
display instead of building `${fiatSymbol}${fiatBalanceRaw}` or computing
fiatUnit, and remove the now-unused prettyHide/prettyNumber prefix logic in
Balance (referencing fiatAmount, fiatDecimals, prettyHide, prettyNumber).
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: e32813be-01be-40cd-994d-bece6e9257a9
📒 Files selected for processing (16)
src/components/Balance.tsxsrc/components/Details.tsxsrc/components/InputAmount.tsxsrc/components/Keyboard.tsxsrc/components/TransactionsList.tsxsrc/lib/fiat.tssrc/lib/format.tssrc/providers/fiat.tsxsrc/screens/Wallet/Notes/Success.tsxsrc/screens/Wallet/Receive/Success.tsxsrc/screens/Wallet/Send/Form.tsxsrc/screens/Wallet/Send/Success.tsxsrc/test/e2e/init.test.tssrc/test/e2e/keyboard.test.tssrc/test/lib/format.test.tssrc/test/screens/wallet/index.test.tsx
Contributor
Author
|
@coderabbitai re: Balance.tsx nitpick — deliberately not using the helpers there. Balance renders The symbol-prefix logic here is only 1 line ( |
Contributor
|
Tip For best results, initiate chat on the files or code changes.
✏️ Learnings added
🧠 Learnings used |
bordalix
added a commit
that referenced
this pull request
Apr 21, 2026
Amounts previously rendered with a trailing ISO code (`100.00 USD`, `50.00 EUR`) now use the common Unicode currency symbol as a prefix: `$100.00`, `€50.00`, `£25.00`, `¥1,000`. Currencies without a widely-used single-char symbol (CHF, CNY) keep the trailing-code form, so CNY does not collide with JPY's `¥`. The new formatters live alongside the existing generic ones: - `prettyFiatAmount(amount, currency)` and `prettyFiatHide(value, currency)` in `src/lib/format.ts` take the `Fiats` enum as a typed parameter. - The generic `prettyAmount` / `prettyHide` are intentionally left untouched so asset tickers (e.g. a stablecoin named `USD`) that flow through those helpers keep their trailing-code format. - Decimals are derived from the currency via `fiatDecimalsFor` in `src/lib/fiat.ts` (JPY = 0, others = 2) — shared between `FiatContext` and `prettyFiatAmount` so call sites no longer need to pass `fiatDecimals()`. Touched displays: hero balance (`Balance.tsx`), transaction list rows (`TransactionsList.tsx`), amount picker (`Keyboard.tsx`), transaction details (`Details.tsx`), Send/Receive/Notes success screens, and Send form available caption. Amount input labels (`InputAmount.tsx`) also use the symbol when available. Side fix: `Details.tsx` previously called `prettyAmount` without passing `fiatDecimals()`, hardcoding 2 decimals. JPY now renders as `¥174` / `¥0` in the transaction details instead of `174.00 JPY` / `0.00 JPY`. Hero alignment: the eye-toggle button wrapper now omits an empty unit `<Text>` when the symbol is inlined into the balance, and the button sits inside a `alignItems: center` flex container next to the unit text — keeping the icon centered with the smaller ISO code in the CHF case and snug against the balance in the `$7.30` case. Tests: - New coverage for `prettyFiatAmount` and `prettyFiatHide` in `src/test/lib/format.test.ts` (symbol + trailing-code + JPY 0-decimals). - Existing `prettyAmount` / `prettyHide` tests unchanged — the generic helpers still behave the same. - UI assertions updated to match the new rendered text: `src/test/screens/wallet/index.test.tsx` → `$0.00` `src/test/e2e/init.test.ts` → `$0.00` `src/test/e2e/keyboard.test.ts` → symbol-prefix regex Co-authored-by: Sahil Chaturvedi <sahilc0@users.noreply.github.com> Co-authored-by: João Bordalo <bordalix@users.noreply.github.com>
bordalix
added a commit
that referenced
this pull request
Apr 28, 2026
* remove ionic/normalize and ion-button * rebbit fixes * feat(wallet): prefix fiat amounts with currency symbols (#535) Amounts previously rendered with a trailing ISO code (`100.00 USD`, `50.00 EUR`) now use the common Unicode currency symbol as a prefix: `$100.00`, `€50.00`, `£25.00`, `¥1,000`. Currencies without a widely-used single-char symbol (CHF, CNY) keep the trailing-code form, so CNY does not collide with JPY's `¥`. The new formatters live alongside the existing generic ones: - `prettyFiatAmount(amount, currency)` and `prettyFiatHide(value, currency)` in `src/lib/format.ts` take the `Fiats` enum as a typed parameter. - The generic `prettyAmount` / `prettyHide` are intentionally left untouched so asset tickers (e.g. a stablecoin named `USD`) that flow through those helpers keep their trailing-code format. - Decimals are derived from the currency via `fiatDecimalsFor` in `src/lib/fiat.ts` (JPY = 0, others = 2) — shared between `FiatContext` and `prettyFiatAmount` so call sites no longer need to pass `fiatDecimals()`. Touched displays: hero balance (`Balance.tsx`), transaction list rows (`TransactionsList.tsx`), amount picker (`Keyboard.tsx`), transaction details (`Details.tsx`), Send/Receive/Notes success screens, and Send form available caption. Amount input labels (`InputAmount.tsx`) also use the symbol when available. Side fix: `Details.tsx` previously called `prettyAmount` without passing `fiatDecimals()`, hardcoding 2 decimals. JPY now renders as `¥174` / `¥0` in the transaction details instead of `174.00 JPY` / `0.00 JPY`. Hero alignment: the eye-toggle button wrapper now omits an empty unit `<Text>` when the symbol is inlined into the balance, and the button sits inside a `alignItems: center` flex container next to the unit text — keeping the icon centered with the smaller ISO code in the CHF case and snug against the balance in the `$7.30` case. Tests: - New coverage for `prettyFiatAmount` and `prettyFiatHide` in `src/test/lib/format.test.ts` (symbol + trailing-code + JPY 0-decimals). - Existing `prettyAmount` / `prettyHide` tests unchanged — the generic helpers still behave the same. - UI assertions updated to match the new rendered text: `src/test/screens/wallet/index.test.tsx` → `$0.00` `src/test/e2e/init.test.ts` → `$0.00` `src/test/e2e/keyboard.test.ts` → symbol-prefix regex Co-authored-by: Sahil Chaturvedi <sahilc0@users.noreply.github.com> Co-authored-by: João Bordalo <bordalix@users.noreply.github.com> * Upgrade ts-sdk 0.4.16 - boltz-swap 0.3.17 (#539) * reverse logs in csv export (#546) * reverse logs in csv export * fix * avoid mutating the React state array * Extra tests (#548) * close copy sheet after copy * lint * test swaps in receive * Prevent swap after receival (#547) * Prevent swap after receival * fix * more removals * increase viewport size in tests * more removals * more removals * fixes * fixes * fixes * fix * remove ion-refresher * Merge branch 'master' into remove_ion-button * fix swap page (#549) * fix swap page * lint * add tests * Upgrade ts-sdk 0.4.17 - boltz-swap 0.3.18 (#551) * fix(receive): add spacing between button row and share button (#552) The vertical gap between the Add amount/Copy buttons and the Share button was too tight. Changed FlexCol gap from 0 to 0.75rem. Co-authored-by: Sahil Chaturvedi <sahilc0@users.noreply.github.com> * Revert "Upgrade ts-sdk 0.4.17 - boltz-swap 0.3.18 (#551)" (#553) This reverts commit 1752cc8. * Upgrade ts-sdk 0.4.17 - boltz-swap 0.3.18 (#551) * Revert "Upgrade ts-sdk 0.4.17 - boltz-swap 0.3.18 (#551)" (#553) This reverts commit 1752cc8. * Upgrade ts-sdk 0.4.18 - boltz-swap 0.3.19 (#554) * add git commit to chatwoot custom attributes (#563) * add lnurl tests (#564) * lint * add lnurl tests Co-authored-by: Copilot <copilot@github.com> --------- Co-authored-by: Copilot <copilot@github.com> * fix(ui): top-align tx history rows when assets are present (#537) * fix(ui): top-align tx history rows when assets are present When a transaction has assets, the right column (sats + fiat + asset info) is taller than the left column (icon + label + date). The outer FlexRow used alignItems 'center' by default, pushing the sats amount above the label text. Switch to alignItems 'start' so both columns begin at the same vertical position. Also adds explicit 'between' to the outer FlexRow and removes a dead alignItems on the non-flex wrapper div. * show only 2 coins in the rigth side of a tx in txs list (#550) --------- Co-authored-by: João Bordalo <bordalix@users.noreply.github.com> * final removal Co-authored-by: Copilot <copilot@github.com> * Upgrade ts-sdk 0.4.19 - boltz-swap 0.3.20 (#565) * lint * fix box-sizing Co-authored-by: Copilot <copilot@github.com> * .label styles Co-authored-by: Copilot <copilot@github.com> * fix branta lint error (#568) * works on refresher Co-authored-by: Copilot <copilot@github.com> * fix unit tests Co-authored-by: Copilot <copilot@github.com> * remove ionic/react * fix label alignment * DRY: AssetCard Co-authored-by: Copilot <copilot@github.com> * fix inputAmount --------- Co-authored-by: Sahil Chaturvedi <sahilchaturvedi@protonmail.com> Co-authored-by: Sahil Chaturvedi <sahilc0@users.noreply.github.com> Co-authored-by: pietro909 <2094604+pietro909@users.noreply.github.com> Co-authored-by: Copilot <copilot@github.com> Co-authored-by: Andrew Camilleri <evilkukka@gmail.com>
ghost
mentioned this pull request
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fiat amounts previously rendered with a trailing ISO code (
100.00 USD,50.00 EUR). They now use the common Unicode currency symbol as a prefix —$100.00,€50.00,£25.00,¥1,000. Currencies without a widely-used single-char symbol (CHF, CNY) keep the trailing-code form, so CNY does not collide with JPY's¥.What changed
New helpers in
src/lib/format.tsprettyFiatAmount(amount, currency)andprettyFiatHide(value, currency)— take theFiatsenum as a typed parameter so only real fiat flows through.fiatDecimalsForinsrc/lib/fiat.ts(JPY = 0, else 2) — shared betweenFiatContextandprettyFiatAmount, so call sites no longer need to passfiatDecimals().prettyAmount/prettyHideare intentionally left untouched so asset tickers (e.g. a stablecoin namedUSD) that flow through those helpers keep their trailing-code format.Affected displays
Balance.tsx)TransactionsList.tsx)Keyboard.tsx)Details.tsx)Send/Form.tsx)InputAmount.tsx) — left label shows$instead ofUSD, right-side fiat conversion is also prefixedPre-existing bug fixed along the way
Details.tsxwas callingprettyAmountwithout passingfiatDecimals(), hardcoding 2 decimals. JPY now correctly renders as¥174/¥0in the transaction details instead of174.00 JPY/0.00 JPY.Hero eye-toggle alignment
The eye button wrapper omits an empty unit
<Text>when the symbol is inlined into the balance, and stays inside analignItems: centerflex container next to the unit text — keeping the icon centered with the smaller ISO code in the CHF case (5.70 CHF 👁) and snug against the balance in the symbol case ($7.30 👁).Settings screens are intentionally unchanged
Settings/General.tsxand theSettings/Fiat.tsxpicker continue to display the ISO code as an identifier — those render a setting value, not an amount.Visual verification
Dev server run against all six supported fiats:
$7.30$0.75,$11.28$1.09/$0.75$label,$7.07 available€6.20€0.64,€9.59€0.93€label¥1,163(0 decimals)¥119,¥1,798¥174,¥0,¥174(Details fix)¥label,¥1,123 available5.70 CHF(trailing)0.59 CHF,8.84 CHF0.85 CHFCHFlabelSats-only paths were spot-checked to confirm no regressions (delegate fees, VTXOs screen, Boltz swap list, asset rows with custom tickers).
Test plan
bun run test:unit— new coverage forprettyFiatAmount/prettyFiatHidepasses; existingprettyAmount/prettyHidetests untouched. Two pre-existing failures inreceive-qrcode.test.tsxare unrelated and reproduce onmaster.src/test/screens/wallet/index.test.tsxupdated to assert the new$0.00rendering.src/test/e2e/init.test.tsandsrc/test/e2e/keyboard.test.tsupdated to match the symbol-prefix format.Fiat onlyandShow bothdisplay modes, withshowBalancetoggled.Summary by CodeRabbit
New Features
Bug Fixes
Tests