diff --git a/native/account/registration/existing-ethereum-account.react.js b/native/account/registration/existing-ethereum-account.react.js --- a/native/account/registration/existing-ethereum-account.react.js +++ b/native/account/registration/existing-ethereum-account.react.js @@ -1,5 +1,11 @@ // @flow +import type { + StackNavigationEventMap, + StackNavigationState, + StackOptions, +} from '@react-navigation/core'; +import invariant from 'invariant'; import * as React from 'react'; import { Text, View } from 'react-native'; @@ -7,6 +13,7 @@ import { useENSName } from 'lib/hooks/ens-cache.js'; import { useWalletLogIn } from 'lib/hooks/login-hooks.js'; import type { SIWEResult } from 'lib/types/siwe-types.js'; +import { getMessageForException } from 'lib/utils/errors.js'; import { useDispatch } from 'lib/utils/redux-utils.js'; import { usingCommServicesAccessToken } from 'lib/utils/services-utils.js'; @@ -14,8 +21,13 @@ import RegistrationButton from './registration-button.react.js'; import RegistrationContainer from './registration-container.react.js'; import RegistrationContentContainer from './registration-content-container.react.js'; +import { RegistrationContext } from './registration-context.js'; import type { RegistrationNavigationProp } from './registration-navigator.react.js'; -import type { NavigationRoute } from '../../navigation/route-names.js'; +import type { RootNavigationProp } from '../../navigation/root-navigator.react.js'; +import type { + NavigationRoute, + ScreenParamList, +} from '../../navigation/route-names.js'; import { useStyles } from '../../themes/colors.js'; import { UnknownErrorAlertDetails } from '../../utils/alert-messages.js'; import Alert from '../../utils/alert.js'; @@ -33,8 +45,21 @@ const [logInPending, setLogInPending] = React.useState(false); + const registrationContext = React.useContext(RegistrationContext); + invariant(registrationContext, 'registrationContext should be set'); + const { setCachedSelections } = registrationContext; + const { params } = props.route; const dispatch = useDispatch(); + const { navigation } = props; + const goBackToHome = navigation.getParent< + ScreenParamList, + 'Registration', + StackNavigationState, + StackOptions, + StackNavigationEventMap, + RootNavigationProp<'Registration'>, + >()?.goBack; const onProceedToLogIn = React.useCallback(async () => { if (logInPending) { return; @@ -53,26 +78,50 @@ }); } } catch (e) { - Alert.alert( - UnknownErrorAlertDetails.title, - UnknownErrorAlertDetails.message, - [{ text: 'OK' }], - { - cancelable: false, - }, - ); + const messageForException = getMessageForException(e); + if (messageForException === 'nonce expired') { + setCachedSelections(oldUserSelections => ({ + ...oldUserSelections, + ethereumAccount: undefined, + })); + Alert.alert( + 'Login attempt timed out', + 'Try logging in from the main SIWE button on the home screen', + [{ text: 'OK', onPress: goBackToHome }], + { + cancelable: false, + }, + ); + } else { + Alert.alert( + UnknownErrorAlertDetails.title, + UnknownErrorAlertDetails.message, + [{ text: 'OK' }], + { + cancelable: false, + }, + ); + } throw e; } finally { setLogInPending(false); } - }, [logInPending, legacySiweServerCall, walletLogIn, params, dispatch]); + }, [ + logInPending, + legacySiweServerCall, + walletLogIn, + params, + dispatch, + goBackToHome, + setCachedSelections, + ]); const { address } = params; const walletIdentifier = useENSName(address); const walletIdentifierTitle = walletIdentifier === address ? 'Ethereum wallet' : 'ENS name'; - const { goBack } = props.navigation; + const { goBack } = navigation; const styles = useStyles(unboundStyles); return (