diff --git a/app/components/UI/FiatOnRampAggregator/Views/AmountToBuy.tsx b/app/components/UI/FiatOnRampAggregator/Views/AmountToBuy.tsx index 967d70d44f4..aad12700aa2 100644 --- a/app/components/UI/FiatOnRampAggregator/Views/AmountToBuy.tsx +++ b/app/components/UI/FiatOnRampAggregator/Views/AmountToBuy.tsx @@ -97,7 +97,7 @@ const AmountToBuy = () => { const [amountFocused, setAmountFocused] = useState(false); const [amount, setAmount] = useState('0'); const [amountNumber, setAmountNumber] = useState(0); - const [tokens, setTokens] = useState([]); + const [tokens, setTokens] = useState(null); const [error, setError] = useState(null); const keyboardHeight = useRef(1000); const keypadOffset = useSharedValue(1000); @@ -353,7 +353,7 @@ const AmountToBuy = () => { })); useEffect(() => { - keypadOffset.value = amountFocused ? 40 : keyboardHeight.current + 40; + keypadOffset.value = amountFocused ? 40 : keyboardHeight.current + 80; }, [amountFocused, keyboardHeight, keypadOffset]); /** @@ -650,7 +650,7 @@ const AmountToBuy = () => { ); } - if (!isFetching && (!tokens || tokens.length === 0)) { + if (!isFetching && tokens && tokens.length === 0) { return ( @@ -659,11 +659,21 @@ const AmountToBuy = () => { 'fiat_on_ramp_aggregator.no_tokens_available', { network: NETWORKS_NAMES[selectedChainId], + region: selectedRegion?.name, }, )} - ctaOnPress={() => navigation.goBack()} + ctaLabel={strings('fiat_on_ramp_aggregator.try_different_region')} + ctaOnPress={toggleRegionModal as () => void} /> + void} + onRegionPress={handleRegionPress} + /> ); } @@ -784,7 +794,7 @@ const AmountToBuy = () => { 'fiat_on_ramp_aggregator.select_a_cryptocurrency_description', { network: NETWORKS_NAMES[selectedChainId] }, )} - tokens={tokens} + tokens={tokens ?? []} onItemPress={handleAssetPress} /> { source={{ uri }} onHttpError={(syntheticEvent) => { const { nativeEvent } = syntheticEvent; - if (nativeEvent.url === uri) { + if ( + nativeEvent.url === uri || + nativeEvent.url.startsWith(callbackBaseUrl) + ) { const webviewHttpError = strings( 'fiat_on_ramp_aggregator.webview_received_error', { code: nativeEvent.statusCode }, diff --git a/app/components/UI/FiatOnRampAggregator/components/ErrorViewWithReporting.tsx b/app/components/UI/FiatOnRampAggregator/components/ErrorViewWithReporting.tsx index 0721507b6aa..a2a1382bfc9 100644 --- a/app/components/UI/FiatOnRampAggregator/components/ErrorViewWithReporting.tsx +++ b/app/components/UI/FiatOnRampAggregator/components/ErrorViewWithReporting.tsx @@ -2,7 +2,6 @@ import React from 'react'; import ErrorView from './ErrorView'; import { useNavigation } from '@react-navigation/native'; import { strings } from '../../../../../locales/i18n'; - /** * ErrorViewWithReporting is a functional general-purpose UI component responsible to show error details in Fiat On-Ramp * @@ -11,6 +10,7 @@ import { strings } from '../../../../../locales/i18n'; */ function ErrorViewWithReporting({ error }: { error: Error }) { const navigation = useNavigation(); + return ( { //TODO: implement a reporting mechanisim for the sdkError + //TODO: implement a mechanisim for user to submit a support ticket // @ts-expect-error navigation prop mismatch navigation.dangerouslyGetParent()?.pop(); }} diff --git a/app/components/UI/FiatOnRampAggregator/sdk/index.tsx b/app/components/UI/FiatOnRampAggregator/sdk/index.tsx index 3cf5ffc913d..152fc9def3a 100644 --- a/app/components/UI/FiatOnRampAggregator/sdk/index.tsx +++ b/app/components/UI/FiatOnRampAggregator/sdk/index.tsx @@ -96,6 +96,10 @@ export const FiatOnRampSDKProvider = ({ const sdk = await SDK.regions(); setSdkModule(sdk); } catch (error) { + Logger.error( + error as Error, + `FiatOnRampSDKProvider SDK.regions() failed`, + ); setSdkError(error as Error); } })(); diff --git a/locales/languages/en.json b/locales/languages/en.json index 3e972e30131..bd56bdd585d 100644 --- a/locales/languages/en.json +++ b/locales/languages/en.json @@ -1584,7 +1584,9 @@ "no_providers_available": "No providers available", "try_different_amount_to_buy_input": "Try choosing a different payment method or try to increase or reduce the amount you want to buy!", "webview_received_error": "WebView received error status code: {{code}}", - "no_tokens_available": "There are currently no cryptocurrencies available to purchase on {{network}}", + "no_tokens_available": "There are currently no cryptocurrencies available to purchase on {{network}} in {{region}}", + "try_different_region": "Try a different region", + "return_home": "Return to Home Screen", "region": { "buy_crypto_tokens": "Buy Crypto Tokens", "title": "Select your Region",