diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index 17863bd..357a6af 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -71,5 +71,7 @@ "discover": "Discover", "valid_address": "Valid Ethereum Address", - "message_requests_from_new_addresses": "Message requests from addresses you’ve never interacted with show up here" + "message_requests_from_new_addresses": "Message requests from addresses you’ve never interacted with show up here", + + "wallet_error": "Wallet Error" } diff --git a/src/screens/OnboardingConnectWalletScreen.tsx b/src/screens/OnboardingConnectWalletScreen.tsx index 485960a..5160972 100644 --- a/src/screens/OnboardingConnectWalletScreen.tsx +++ b/src/screens/OnboardingConnectWalletScreen.tsx @@ -1,5 +1,6 @@ import {BlurView} from '@react-native-community/blur'; import { + WalletConfig, coinbaseWallet, localWallet, metamaskWallet, @@ -8,8 +9,8 @@ import { walletConnect, } from '@thirdweb-dev/react-native'; import {VStack} from 'native-base'; -import React, {useEffect, useState} from 'react'; -import {Image, Linking} from 'react-native'; +import React, {useCallback, useEffect, useState} from 'react'; +import {Alert, Image, Linking} from 'react-native'; import {WalletOptionButton} from '../components/WalletOptionButton'; import {Button} from '../components/common/Button'; import {Icon} from '../components/common/Icon'; @@ -43,6 +44,18 @@ export const OnboardingConnectWalletScreen = () => { } }, [address, navigate]); + const handleConnect = useCallback( + async (config: WalletConfig) => { + try { + await connect(config); + setShowModal(false); + } catch (error: any) { + Alert.alert(translate('wallet_error'), error?.message); + } + }, + [connect], + ); + return ( <> @@ -93,37 +106,25 @@ export const OnboardingConnectWalletScreen = () => { {translate('you_can_connect_or_create')} { - await connect(walletConnectConfig); - setShowModal(false); - }} + onPress={() => handleConnect(walletConnectConfig)} title={translate('walletconnect')} icon={'walletconnect'} testId={TestIds.ONBOARDING_CONNECT_WALLET_CONNECT_OPTION_BUTTON} /> { - await connect(metamaskConfig); - setShowModal(false); - }} + onPress={() => handleConnect(metamaskConfig)} title={translate('metamask')} icon={'metamask'} testId={TestIds.ONBOARDING_CONNECT_METAMASK_OPTION_BUTTON} /> { - await connect(coinbaseWalletConfig); - setShowModal(false); - }} + onPress={() => handleConnect(coinbaseWalletConfig)} title={translate('coinbase_wallet')} icon={'coinbase-wallet'} testId={TestIds.ONBOARDING_CONNECT_COINBASE_OPTION_BUTTON} /> { - await connect(localWalletConfig); - setShowModal(false); - }} + onPress={() => handleConnect(localWalletConfig)} title={translate('guest_wallet')} icon={'wallet'} testId={TestIds.ONBOARDING_CONNECT_GUEST_OPTION_BUTTON} diff --git a/src/screens/OnboardingEnableIdentityScreen.tsx b/src/screens/OnboardingEnableIdentityScreen.tsx index 621dcf7..1a07f40 100644 --- a/src/screens/OnboardingEnableIdentityScreen.tsx +++ b/src/screens/OnboardingEnableIdentityScreen.tsx @@ -1,8 +1,8 @@ import {useDisconnect, useSigner} from '@thirdweb-dev/react-native'; import {Client} from '@xmtp/react-native-sdk'; import {VStack} from 'native-base'; -import React, {useCallback, useEffect, useState} from 'react'; -import {DeviceEventEmitter, Image} from 'react-native'; +import {useCallback, useEffect, useState} from 'react'; +import {Alert, DeviceEventEmitter, Image} from 'react-native'; import {Button} from '../components/common/Button'; import {Icon} from '../components/common/Icon'; import {Screen} from '../components/common/Screen'; @@ -69,8 +69,9 @@ export const OnboardingEnableIdentityScreen = () => { const address = await signer.getAddress(); saveClientKeys(address as `0x${string}`, keys); setClient(client); - } catch (e) { + } catch (e: any) { console.log('Error creating client', e); + Alert.alert('Error creating client', e?.message); } }; startClientCreation();