diff --git a/native/account/fullscreen-siwe-panel.react.js b/native/account/fullscreen-siwe-panel.react.js
index 032aa341d..c5f3506f2 100644
--- a/native/account/fullscreen-siwe-panel.react.js
+++ b/native/account/fullscreen-siwe-panel.react.js
@@ -1,71 +1,80 @@
// @flow
import * as React from 'react';
import { Alert, ActivityIndicator, View } from 'react-native';
+import { useDispatch } from 'react-redux';
+import { setDataLoadedActionType } from 'lib/actions/client-db-store-actions.js';
import type { SIWEResult } from 'lib/types/siwe-types.js';
import { useSIWEServerCall } from './siwe-hooks.js';
import SIWEPanel from './siwe-panel.react.js';
type Props = {
+goBackToPrompt: () => mixed,
+closing: boolean,
};
function FullscreenSIWEPanel(props: Props): React.Node {
const [loading, setLoading] = React.useState(true);
const activity = loading ? : null;
const activityContainer = React.useMemo(
() => ({
flex: 1,
}),
[],
);
const { goBackToPrompt } = props;
const siweServerCallParams = React.useMemo(() => {
const onServerCallFailure = () => {
Alert.alert(
'Unknown error',
'Uhh... try again?',
[{ text: 'OK', onPress: goBackToPrompt }],
{ cancelable: false },
);
};
return { onFailure: onServerCallFailure };
}, [goBackToPrompt]);
const siweServerCall = useSIWEServerCall(siweServerCallParams);
const successRef = React.useRef(false);
+ const dispatch = useDispatch();
const onSuccess = React.useCallback(
- (result: SIWEResult) => {
+ async (result: SIWEResult) => {
successRef.current = true;
- return siweServerCall(result);
+ await siweServerCall(result);
+ dispatch({
+ type: setDataLoadedActionType,
+ payload: {
+ dataLoaded: true,
+ },
+ });
},
- [siweServerCall],
+ [siweServerCall, dispatch],
);
const ifBeforeSuccessGoBackToPrompt = React.useCallback(() => {
if (!successRef.current) {
goBackToPrompt();
}
}, [goBackToPrompt]);
const { closing } = props;
return (
<>
{activity}
>
);
}
export default FullscreenSIWEPanel;
diff --git a/native/account/registration/existing-ethereum-account.react.js b/native/account/registration/existing-ethereum-account.react.js
index a1c2be4bc..76327417f 100644
--- a/native/account/registration/existing-ethereum-account.react.js
+++ b/native/account/registration/existing-ethereum-account.react.js
@@ -1,130 +1,139 @@
// @flow
import * as React from 'react';
import { Text, View, Alert } from 'react-native';
+import { useDispatch } from 'react-redux';
+import { setDataLoadedActionType } from 'lib/actions/client-db-store-actions.js';
import { siweAuthActionTypes } from 'lib/actions/siwe-actions.js';
import { useENSName } from 'lib/hooks/ens-cache.js';
import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
import type { SIWEResult } from 'lib/types/siwe-types.js';
import RegistrationButtonContainer from './registration-button-container.react.js';
import RegistrationButton from './registration-button.react.js';
import RegistrationContainer from './registration-container.react.js';
import RegistrationContentContainer from './registration-content-container.react.js';
import type { RegistrationNavigationProp } from './registration-navigator.react.js';
import type { NavigationRoute } from '../../navigation/route-names.js';
import { useSelector } from '../../redux/redux-utils.js';
import { useStyles } from '../../themes/colors.js';
import { useSIWEServerCall } from '../siwe-hooks.js';
const siweAuthLoadingStatusSelector =
createLoadingStatusSelector(siweAuthActionTypes);
export type ExistingEthereumAccountParams = SIWEResult;
type Props = {
+navigation: RegistrationNavigationProp<'ExistingEthereumAccount'>,
+route: NavigationRoute<'ExistingEthereumAccount'>,
};
function ExistingEthereumAccount(props: Props): React.Node {
const siweServerCallParams = React.useMemo(() => {
const onServerCallFailure = () => {
Alert.alert('Unknown error', 'Uhh... try again?', [{ text: 'OK' }], {
cancelable: false,
});
};
return { onFailure: onServerCallFailure };
}, []);
const siweServerCall = useSIWEServerCall(siweServerCallParams);
const { params } = props.route;
- const onProceedToLogIn = React.useCallback(() => {
- siweServerCall(params);
- }, [siweServerCall, params]);
+ const dispatch = useDispatch();
+ const onProceedToLogIn = React.useCallback(async () => {
+ await siweServerCall(params);
+ dispatch({
+ type: setDataLoadedActionType,
+ payload: {
+ dataLoaded: true,
+ },
+ });
+ }, [siweServerCall, params, dispatch]);
const siweAuthCallLoading = useSelector(
state => siweAuthLoadingStatusSelector(state) === 'loading',
);
const { address } = params;
const walletIdentifier = useENSName(address);
const walletIdentifierTitle =
walletIdentifier === address ? 'Ethereum wallet' : 'ENS name';
const { goBack } = props.navigation;
const styles = useStyles(unboundStyles);
return (
Account already exists for wallet
You can proceed to log in with this wallet, or go back and use a
different wallet.
{walletIdentifierTitle}
{walletIdentifier}
);
}
const unboundStyles = {
header: {
fontSize: 24,
color: 'panelForegroundLabel',
paddingBottom: 16,
},
body: {
fontFamily: 'Arial',
fontSize: 15,
lineHeight: 20,
color: 'panelForegroundSecondaryLabel',
paddingBottom: 40,
},
walletTile: {
backgroundColor: 'panelForeground',
borderRadius: 8,
padding: 24,
alignItems: 'center',
},
walletIdentifierTitleText: {
fontSize: 17,
color: 'panelForegroundLabel',
textAlign: 'center',
},
walletIdentifier: {
backgroundColor: 'panelSecondaryForeground',
paddingVertical: 8,
paddingHorizontal: 24,
borderRadius: 56,
marginTop: 8,
alignItems: 'center',
},
walletIdentifierText: {
fontSize: 15,
color: 'panelForegroundLabel',
},
};
export default ExistingEthereumAccount;
diff --git a/native/account/siwe-hooks.js b/native/account/siwe-hooks.js
index b73f5a611..585c080ba 100644
--- a/native/account/siwe-hooks.js
+++ b/native/account/siwe-hooks.js
@@ -1,85 +1,89 @@
// @flow
import * as React from 'react';
import { siweAuth, siweAuthActionTypes } from 'lib/actions/siwe-actions.js';
import type { LogInStartingPayload } from 'lib/types/account-types.js';
import {
useServerCall,
useDispatchActionPromise,
} from 'lib/utils/action-utils.js';
import { NavContext } from '../navigation/navigation-context.js';
import { useSelector } from '../redux/redux-utils.js';
import { nativeLogInExtraInfoSelector } from '../selectors/account-selectors.js';
import { useInitialNotificationsEncryptedMessage } from '../utils/crypto-utils.js';
type SIWEServerCallParams = {
+message: string,
+signature: string,
...
};
type UseSIWEServerCallParams = {
+onFailure: () => mixed,
};
function useSIWEServerCall(
params: UseSIWEServerCallParams,
): SIWEServerCallParams => Promise {
const { onFailure } = params;
const siweAuthCall = useServerCall(siweAuth);
const callSIWE = React.useCallback(
async (message, signature, extraInfo) => {
try {
return await siweAuthCall({
message,
signature,
...extraInfo,
});
} catch (e) {
onFailure();
throw e;
}
},
[onFailure, siweAuthCall],
);
const navContext = React.useContext(NavContext);
const logInExtraInfo = useSelector(state =>
nativeLogInExtraInfoSelector({
redux: state,
navContext,
}),
);
const getInitialNotificationsEncryptedMessage =
useInitialNotificationsEncryptedMessage();
const dispatchActionPromise = useDispatchActionPromise();
return React.useCallback(
async ({ message, signature }) => {
const extraInfo = await logInExtraInfo();
const initialNotificationsEncryptedMessage =
await getInitialNotificationsEncryptedMessage();
+ const siwePromise = callSIWE(message, signature, {
+ ...extraInfo,
+ initialNotificationsEncryptedMessage,
+ });
+
dispatchActionPromise(
siweAuthActionTypes,
- callSIWE(message, signature, {
- ...extraInfo,
- initialNotificationsEncryptedMessage,
- }),
+ siwePromise,
undefined,
({ calendarQuery: extraInfo.calendarQuery }: LogInStartingPayload),
);
+
+ await siwePromise;
},
[
logInExtraInfo,
dispatchActionPromise,
callSIWE,
getInitialNotificationsEncryptedMessage,
],
);
}
export { useSIWEServerCall };