fix: fiat payment design alignments

[OGPoyraz]

Description

This PR fixes two UI issues related to fiat payment method selection in the confirmation flow:

1. Hide PayAccountSelector when fiat payment method is selected

When a fiat payment method (selectedFiatPaymentMethodId) is active, the PayAccountSelector component should not be rendered in CustomAmountInfo. The guard was added to both the keyboard-visible and result-ready states. Test coverage added to verify the new behavior.

2. Fix dark mode icon color for fiat payment method row

PaymentMethodIcon in PayWithFiatPaymentMethodRow was receiving color={undefined} when not disabled, causing react-native-vector-icons to default to black — invisible in dark mode. Fixed by using colors.icon.default from the theme, which resolves to the correct color in both light and dark modes.

Changes

• custom-amount-info.tsx: Added !selectedFiatPaymentMethodId guard to PayAccountSelector rendering
• custom-amount-info.test.tsx: Added test for PayAccountSelector hidden when fiat payment method selected
• pay-with-row.tsx: Changed PaymentMethodIcon color from undefined to colors.icon.default

Related to

• Fixes: https://consensyssoftware.atlassian.net/browse/CONF-1415

Recording and screenshots

After

fiat.design.alignments.mov

---

Note

Low Risk
Small confirmation UI guards and theme token for an icon; no auth, transaction, or payment logic changes.

Overview
When a fiat payment method is selected on the custom amount confirmation screen, PayAccountSelector is hidden so users are not prompted to pick a crypto pay account alongside fiat. The same guard applies in both the in-progress (keyboard) and post-Done layouts.

The Pay with row for fiat methods now uses colors.icon.default for PaymentMethodIcon when enabled, fixing icons that looked wrong (e.g. black) in dark mode.

Tests assert the account selector stays off when selectedPaymentMethodId is set.

^{Reviewed by Cursor Bugbot for commit 4fa7eab. Bugbot is set up for automated code reviews on this repo. Configure here.}

[github-actions]

🔍 Smart E2E Test Selection

• Selected E2E tags: SmokeConfirmations, SmokeMoney, SmokePerps, SmokePredictions, SmokeSwap, SmokeWalletPlatform
• Selected Performance tags: None (no tests recommended)
• Risk Level: medium
• AI Confidence: 82%

click to see 🤖 AI reasoning details

E2E Test Selection:
The three changed files are all within the confirmations component area, specifically affecting fiat/card payment flows:

1. custom-amount-info.tsx: Adds !selectedFiatPaymentMethodId condition to hide PayAccountSelector when a fiat payment method is selected. This affects both the pre-result and post-result states of the confirmation UI. The component is used by money-account-deposit-info, money-account-withdraw-info, perps-deposit-info, perps-withdraw-info, predict-deposit-info, predict-withdraw-info, and musd-conversion-info.

2. custom-amount-info.test.tsx: Unit test for the new condition (no E2E impact by itself, but confirms the intent of the change).

3. pay-with-row.tsx: Visual fix changing icon color from undefined to colors.icon.default in PayWithFiatPaymentMethodRow when not disabled — ensures proper icon rendering in payment method selection rows.

Tag selection rationale:

• SmokeConfirmations: Core confirmation UI is modified (PayAccountSelector visibility, payment method icon color)
• SmokeMoney: Primary area affected — card/fiat deposit flows, Add Funds, money account deposits/withdrawals all use CustomAmountInfo with fiatPayment logic
• SmokePerps: perps-deposit-info and perps-withdraw-info both use CustomAmountInfo; the PayAccountSelector visibility change could affect perps deposit flows
• SmokePredictions: predict-deposit-info and predict-withdraw-info both use CustomAmountInfo; same reasoning as SmokePerps
• SmokeSwap: Per SmokeMoney tag description, when selecting SmokeMoney for Add Funds or similar flows that execute swaps, also select SmokeSwap
• SmokeWalletPlatform: Per SmokeMoney tag description, when changes touch wallet home or actions entry to buy/sell, also select SmokeWalletPlatform

Performance Test Selection:
The changes are limited to conditional rendering logic (hiding PayAccountSelector when fiat payment method is selected) and a minor icon color fix. These are not performance-sensitive changes — no new data fetching, no list rendering changes, no state management modifications, and no impact on app startup or critical user flow timing. Performance tests are not warranted.

View GitHub Actions results

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
72.7% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud