feat(decimal): add wallet-wide amount format preference - #891
Conversation
|
Warning Review limit reached
Next review available in: 54 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. 📝 WalkthroughWalkthroughAdds a wallet-wide expanded/compressed amount display preference, including persistence, Redux state, a feature-gated settings screen, localization entries, navigation wiring, and propagation to balance and transaction views. ChangesAmount Format Feature
Estimated code review effort: 4 (Complex) | ~45 minutes Sequence Diagram(s)sequenceDiagram
participant User
participant Settings
participant AmountFormat
participant STORE
participant Redux
participant BalanceViews
User->>Settings: Select Amount format
Settings->>AmountFormat: Navigate to screen
User->>AmountFormat: Choose format and save
AmountFormat->>STORE: Persist selected format
AmountFormat->>Redux: Dispatch setAmountFormat
Redux->>BalanceViews: Propagate amountFormat
BalanceViews->>User: Render expanded or compressed amounts
Suggested reviewers: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ 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 |
There was a problem hiding this comment.
🧹 Nitpick comments (1)
src/screens/AmountFormat.js (1)
58-90: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low valueConsider adding radio a11y semantics.
The radio option
TouchableOpacitys (lines 72-90) don't setaccessibilityRole="radio"/accessibilityState={{ selected }}, so screen readers won't announce selection state.♿ Optional a11y improvement
<TouchableOpacity activeOpacity={0.7} onPress={() => setSelectedFormat(format)} style={styles.option} + accessibilityRole="radio" + accessibilityState={{ selected: isSelected }} >🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/screens/AmountFormat.js` around lines 58 - 90, The radio options rendered by renderOption in AmountFormat.js are missing accessibility semantics, so screen readers cannot identify them as selectable radio controls or announce which one is selected. Update the TouchableOpacity used for each option to expose radio behavior by adding the appropriate accessibility role and selected state based on selectedFormat and format, and keep the label/description readable for assistive tech. Use the existing renderRadioIcon and renderOption symbols to apply the fix consistently for all formats.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@src/screens/AmountFormat.js`:
- Around line 58-90: The radio options rendered by renderOption in
AmountFormat.js are missing accessibility semantics, so screen readers cannot
identify them as selectable radio controls or announce which one is selected.
Update the TouchableOpacity used for each option to expose radio behavior by
adding the appropriate accessibility role and selected state based on
selectedFormat and format, and keep the label/description readable for assistive
tech. Use the existing renderRadioIcon and renderOption symbols to apply the fix
consistently for all formats.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 9fc6f02d-8758-42a2-9926-1103cb5c7dbd
📒 Files selected for processing (12)
__tests__/reducers/amountFormat.test.js__tests__/utils/amountFormat.test.jssrc/App.jssrc/actions.jssrc/components/TxDetailsModal.jssrc/constants.jssrc/reducers/reducer.jssrc/sagas/wallet.jssrc/screens/AmountFormat.jssrc/screens/MainScreen.jssrc/screens/Settings.jssrc/utils.js
c52cb8e to
69d6b3a
Compare
69d6b3a to
1db45fa
Compare
Add an Expanded/Compressed amount display preference with a dedicated settings screen. Compressed uses subscript-zero notation for small values (0.0000005195 -> 0.0₆5195) via a shared compressAmountString helper built on numberUtils.prettyValue. The preference is network-independent, defaults to Expanded, persists under wallet:amount_format (cleared on wallet reset), and is applied to the primary display sites: balances, token list, and transaction history and details. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Lro8VYzSHEwaHAhEmDRM2C
1db45fa to
172ba28
Compare
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/App.js`:
- Line 77: Update the AmountFormat screen to obtain the native token symbol from
Redux serverInfo.native_token.symbol and use that value in the user-facing
preview instead of the hardcoded HTR suffix. Preserve the existing previewValue
formatting and ensure the dynamically retrieved symbol is rendered in the
preview.
In `@src/screens/AmountFormat.js`:
- Around line 120-122: Update the amount preview in the component around
currentFormat and the previewValue render to derive the native token symbol from
state.serverInfo?.native_token?.symbol, using the existing HTR fallback when
unavailable, and replace the hardcoded HTR text with that nativeTokenSymbol
value.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 2eea4e3c-3b7b-4dfc-9004-aee77707197b
📒 Files selected for processing (14)
locale/da/texts.polocale/pt-br/texts.polocale/ru-ru/texts.polocale/texts.potsrc/App.jssrc/actions.jssrc/components/TxDetailsModal.jssrc/constants.jssrc/reducers/reducer.jssrc/sagas/wallet.jssrc/screens/AmountFormat.jssrc/screens/MainScreen.jssrc/screens/Settings.jssrc/utils.js
🚧 Files skipped from review as they are similar to previous changes (7)
- src/components/TxDetailsModal.js
- src/actions.js
- src/screens/Settings.js
- src/constants.js
- src/reducers/reducer.js
- src/screens/MainScreen.js
- src/utils.js
…isplay Review fixes (PR #891): - compressAmountString: compress only the leading zero run, keep trailing digits verbatim (T4) - renderValue: rename isInteger -> isNFT to match every call site (T5) - getDisplayAmountFormat: gate the amount format on the feature flag; every display site reads this single selector (T2, T6) - normalizeAmountFormat: validate the persisted value on hydration (T2) - wire the Dashboard token list through the gated format (AC coverage gap) Home display rule: - capDecimalsByMagnitude: cap shown decimals by magnitude (<1 -> 8, 1-999 -> 4, 1000-9999 -> 3, >=10000 -> 2), truncated, not padded - renderHomeValue: render home balances via serverInfo.decimal_places, then the magnitude cap, then the Compressed notation Tests: compressAmountString, capDecimalsByMagnitude, renderHomeValue, getDisplayAmountFormat, normalizeAmountFormat. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01G9asQ9EmwUmCpv34aM7v2v
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/components/TokenSelect.js`:
- Line 68: Replace renderHomeValue in the TokenSelect token-list balance
rendering with a shared compressed formatter that does not apply the Home-only
capDecimalsByMagnitude behavior. Preserve the configured amountFormat and
decimalPlaces precision before compression, while keeping the Home-specific
formatting path unchanged elsewhere.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 65ffb087-f4df-411d-86d0-611a284d489e
📒 Files selected for processing (8)
__tests__/reducers/amountFormat.test.js__tests__/utils/amountFormat.test.jssrc/components/TokenSelect.jssrc/sagas/wallet.jssrc/screens/AmountFormat.jssrc/screens/Dashboard.jssrc/screens/MainScreen.jssrc/utils.js
🚧 Files skipped from review as they are similar to previous changes (2)
- src/screens/MainScreen.js
- src/screens/AmountFormat.js
…isplay Review fixes (PR #891): - compressAmountString: compress only the leading zero run, keep trailing digits verbatim (T4) - renderValue: rename isInteger -> isNFT to match every call site (T5) - getDisplayAmountFormat: gate the amount format on the feature flag; every display site reads this single selector (T2, T6) - normalizeAmountFormat: validate the persisted value on hydration (T2) - wire the Dashboard token list through the gated format (AC coverage gap) Home display rule: - capDecimalsByMagnitude: cap shown decimals by magnitude (<1 -> 8, 1-999 -> 4, 1000-9999 -> 3, >=10000 -> 2), truncated, not padded - renderHomeValue: render home balances via serverInfo.decimal_places, then the magnitude cap, then the Compressed notation Tests: compressAmountString, capDecimalsByMagnitude, renderHomeValue, getDisplayAmountFormat, normalizeAmountFormat. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01G9asQ9EmwUmCpv34aM7v2v
12e1dbe to
8a42741
Compare
Thread serverInfo.decimal_places into renderValue/renderHomeValue (and prettyValue) so amounts use the network's precision instead of the wallet-lib default of 2 — which also lets the Compressed format apply where two fractional digits made it a no-op. Covers the balance, transaction history/details, token list, create-token, import and push display sites. Send, token-swap and Reown sites follow in separate PRs; utils/tokenSwap.js already exposes the optional, backward-compatible parameter so those PRs touch only their own screens. Cap the transaction-row label and amount at 45% width each and let long amounts wrap instead of overflowing. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01DfcfFFSBugJZYxtTjYLq4P
e2289b0 to
0855cd8
Compare
| return `— ${token.symbol}`; | ||
| } | ||
| const available = entry.data?.available ?? 0n; | ||
| return `${numberUtils.prettyValue(available, constants.DECIMAL_PLACES)} ${token.symbol}`; |
There was a problem hiding this comment.
Can we remove this constant value from the code?
There was a problem hiding this comment.
Here we are using the decimal places that cames from the server (redux), it's not a removal it's a replacement.
c2db0a6
… <= 8 capDecimalsByMagnitude caps sub-1 values at 8 decimals and truncates the rest. On a network with decimal_places > 8, a balance below 1e-8 truncates to all-zeros and renders as 0. Latent today (Hathor networks use 2); documented so the assumption surfaces if precision ever changes. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01G9asQ9EmwUmCpv34aM7v2v
c2db0a6 to
13be0c9
Compare
There was a problem hiding this comment.
Actionable comments posted: 2
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/utils/tokenSwap.js (1)
358-418: 🎯 Functional Correctness | 🟠 Major | 🏗️ Heavy liftPropagate the selected amount format, not only decimal precision.
Across these display paths, the new precision parameter is threaded through, but compressed rendering is still bypassed because
amountFormatis omitted orprettyValueis called directly.
src/utils/tokenSwap.js#L358-L418: add and propagateamountFormatthrough swap rendering helpers.src/components/NanoContract/NanoContractTransactionActionListItem.js#L114-L115: passamountFormattorenderValue.src/components/PushTxDetailsModal.js#L42-L49: addamountFormattogetTokenBalance.src/components/PushTxDetailsModal.js#L76-L78: pass the selected format at the call site.src/screens/ChangeToken.js#L28-L28: select the wallet format.src/screens/ChangeToken.js#L65-L65: pass it through and updateTokenSelect/FlatListrefresh inputs.src/screens/ConfirmImportScreen.js#L40-L40: select the wallet format.src/screens/ConfirmImportScreen.js#L69-L75: use the shared formatter for token-list balances.src/screens/CreateTokenAmount.js#L148-L177: use the shared formatter for read-only balance, fee, and deposit displays.src/screens/CreateTokenConfirm.js#L224-L227: apply the intended format to the non-editable confirmation amount.src/screens/CreateTokenConfirm.js#L251-L259: apply the selected format to read-only deposit and network-fee values.src/screens/ImportTokensScreen.js#L43-L43: select the wallet format.src/screens/ImportTokensScreen.js#L112-L119: use the shared formatter for token-list balances.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/utils/tokenSwap.js` around lines 358 - 418, Propagate the selected amountFormat through every listed display path so compressed formatting is preserved alongside decimal precision. In src/utils/tokenSwap.js lines 358-418, update renderAmountAndSymbol, renderAmountAndSymbolWithSlippage, and renderConversionRate; apply the specified amountFormat propagation at src/components/NanoContract/NanoContractTransactionActionListItem.js lines 114-115, src/components/PushTxDetailsModal.js lines 42-49 and 76-78, src/screens/ChangeToken.js lines 28 and 65, src/screens/ConfirmImportScreen.js lines 40 and 69-75, src/screens/CreateTokenAmount.js lines 148-177, src/screens/CreateTokenConfirm.js lines 224-227 and 251-259, and src/screens/ImportTokensScreen.js lines 43 and 112-119. Use the shared formatter instead of direct prettyValue calls, select the wallet format where indicated, pass it through getTokenBalance and TokenSelect/FlatList refresh inputs, and apply it to all read-only balances, fees, deposits, and confirmation amounts.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/utils/tokenSwap.js`:
- Around line 358-361: Thread the selected amount format through the swap
rendering helpers so Compressed preferences are honored. Update
renderAmountAndSymbol and the adjacent helpers to accept amountFormat, then
update all callers and pass it to every renderValue invocation alongside
decimalPlaces. Ensure swap quotes, slippage values, and conversion rates use the
selected format instead of renderValue’s default.
In `@src/workers/pushNotificationHandler.js`:
- Around line 41-44: Update the background notification amount formatting in the
push notification handler so it does not rely on wallet-lib defaults; persist
and read the wallet-wide formatting configuration outside Redux, including the
selected amount format and network decimal precision, then apply it when
constructing notification amounts. If that configuration cannot be made
available here, explicitly exclude notification amounts from the formatting
feature scope rather than documenting the current fallback.
---
Outside diff comments:
In `@src/utils/tokenSwap.js`:
- Around line 358-418: Propagate the selected amountFormat through every listed
display path so compressed formatting is preserved alongside decimal precision.
In src/utils/tokenSwap.js lines 358-418, update renderAmountAndSymbol,
renderAmountAndSymbolWithSlippage, and renderConversionRate; apply the specified
amountFormat propagation at
src/components/NanoContract/NanoContractTransactionActionListItem.js lines
114-115, src/components/PushTxDetailsModal.js lines 42-49 and 76-78,
src/screens/ChangeToken.js lines 28 and 65, src/screens/ConfirmImportScreen.js
lines 40 and 69-75, src/screens/CreateTokenAmount.js lines 148-177,
src/screens/CreateTokenConfirm.js lines 224-227 and 251-259, and
src/screens/ImportTokensScreen.js lines 43 and 112-119. Use the shared formatter
instead of direct prettyValue calls, select the wallet format where indicated,
pass it through getTokenBalance and TokenSelect/FlatList refresh inputs, and
apply it to all read-only balances, fees, deposits, and confirmation amounts.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 2894e39c-310a-449f-a0bf-41a21d864d8a
📒 Files selected for processing (18)
__tests__/reducers/amountFormat.test.js__tests__/utils/amountFormat.test.jssrc/components/NanoContract/NanoContractTransactionActionListItem.jssrc/components/PushTxDetailsModal.jssrc/components/TokenSelect.jssrc/components/TxDetailsModal.jssrc/constants.jssrc/sagas/wallet.jssrc/screens/ChangeToken.jssrc/screens/ConfirmImportScreen.jssrc/screens/CreateTokenAmount.jssrc/screens/CreateTokenConfirm.jssrc/screens/Dashboard.jssrc/screens/ImportTokensScreen.jssrc/screens/MainScreen.jssrc/utils.jssrc/utils/tokenSwap.jssrc/workers/pushNotificationHandler.js
🚧 Files skipped from review as they are similar to previous changes (7)
- src/components/TokenSelect.js
- src/screens/Dashboard.js
- tests/reducers/amountFormat.test.js
- src/components/TxDetailsModal.js
- src/constants.js
- src/screens/MainScreen.js
- src/utils.js
Acceptance Criteria
0.0000005195→0.0₆5195)Design: Figma – Amounts Update
Screenshots / videos
Simulator.Screen.Recording.-.iPhone.17.Pro.-.2026-07-14.at.19.22.04.mov
Security Checklist
Summary by CodeRabbit
New Features
Bug Fixes