diff --git a/native/account/registration/connect-ethereum.react.js b/native/account/registration/connect-ethereum.react.js
--- a/native/account/registration/connect-ethereum.react.js
+++ b/native/account/registration/connect-ethereum.react.js
@@ -21,6 +21,7 @@
} from './ethereum-utils.js';
import { RegistrationContext } from './registration-context.js';
import type { CoolOrNerdMode } from './registration-types.js';
+import { useClientBackup } from '../../backup/use-client-backup.js';
import PrimaryButton from '../../components/primary-button.react.js';
import { commRustModule } from '../../native-modules.js';
import {
@@ -139,6 +140,7 @@
const getEthereumAccountFromSIWEResult =
useGetEthereumAccountFromSIWEResult();
+ const { retrieveLatestBackupInfo } = useClientBackup();
const onSuccessfulWalletSignature = React.useCallback(
async (result: SIWEResult) => {
let userAlreadyExists;
@@ -156,9 +158,11 @@
}
if (userAlreadyExists) {
+ const backupInfo = await retrieveLatestBackupInfo(result.address);
+
navigate<'ExistingEthereumAccount'>({
name: ExistingEthereumAccountRouteName,
- params: result,
+ params: { ...result, backupData: backupInfo?.siweBackupData },
});
return;
}
@@ -182,6 +186,7 @@
dispatchActionPromise,
navigate,
getEthereumAccountFromSIWEResult,
+ retrieveLatestBackupInfo,
],
);
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
@@ -12,18 +12,25 @@
import { setDataLoadedActionType } from 'lib/actions/client-db-store-actions.js';
import { useENSName } from 'lib/hooks/ens-cache.js';
import { useWalletLogIn } from 'lib/hooks/login-hooks.js';
+import type { SIWEBackupData } from 'lib/types/backup-types.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';
+import {
+ usingCommServicesAccessToken,
+ usingRestoreFlow,
+} from 'lib/utils/services-utils.js';
import type { AuthNavigationProp } from './auth-navigator.react.js';
import { RegistrationContext } from './registration-context.js';
+import LinkButton from '../../components/link-button.react.js';
import PrimaryButton from '../../components/primary-button.react.js';
import type { RootNavigationProp } from '../../navigation/root-navigator.react.js';
-import type {
- NavigationRoute,
- ScreenParamList,
+import {
+ type NavigationRoute,
+ type ScreenParamList,
+ QRCodeScreenRouteName,
+ RestoreSIWEBackupRouteName,
} from '../../navigation/route-names.js';
import { useStyles } from '../../themes/colors.js';
import {
@@ -36,7 +43,10 @@
import AuthContentContainer from '../auth-components/auth-content-container.react.js';
import { useLegacySIWEServerCall } from '../siwe-hooks.js';
-export type ExistingEthereumAccountParams = SIWEResult;
+export type ExistingEthereumAccountParams = $ReadOnly<{
+ ...SIWEResult,
+ +backupData: ?SIWEBackupData,
+}>;
type Props = {
+navigation: AuthNavigationProp<'ExistingEthereumAccount'>,
@@ -53,6 +63,7 @@
const { setCachedSelections } = registrationContext;
const { params } = props.route;
+ const { address, message, signature, backupData } = params;
const dispatch = useDispatch();
const { navigation } = props;
const goBackToHome = navigation.getParent<
@@ -63,6 +74,7 @@
StackNavigationEventMap,
RootNavigationProp<'Auth'>,
>()?.goBack;
+
const onProceedToLogIn = React.useCallback(async () => {
if (logInPending) {
return;
@@ -130,13 +142,80 @@
setCachedSelections,
]);
- const { address } = params;
+ const useLegacyFlow = !backupData || !usingRestoreFlow;
+
+ const openRestoreFlow = React.useCallback(() => {
+ if (useLegacyFlow || !backupData) {
+ return;
+ }
+ const {
+ siweBackupMsgNonce,
+ siweBackupMsgIssuedAt,
+ siweBackupMsgStatement,
+ } = backupData;
+ navigation.navigate(RestoreSIWEBackupRouteName, {
+ siweNonce: siweBackupMsgNonce,
+ siweStatement: siweBackupMsgStatement,
+ siweIssuedAt: siweBackupMsgIssuedAt,
+ userIdentifier: address,
+ signature,
+ message,
+ });
+ }, [address, backupData, message, navigation, signature, useLegacyFlow]);
+
+ const openQRScreen = React.useCallback(() => {
+ navigation.navigate(QRCodeScreenRouteName);
+ }, [navigation]);
+
const walletIdentifier = useENSName(address);
const walletIdentifierTitle =
walletIdentifier === address ? 'Ethereum wallet' : 'ENS name';
const { goBack } = navigation;
const styles = useStyles(unboundStyles);
+
+ let newFlowSection = null;
+ if (!useLegacyFlow) {
+ newFlowSection = (
+ <>
+
+ If you still have access to your logged-in device, you can use it to
+ log in by scanning the QR code.
+
+
+ If you’ve lost access to your logged-in device, you can try recovering
+ your Comm account. Note that after completing the recovery flow, you
+ will be logged out from all of your other devices.
+
+
+
+
+ >
+ );
+ }
+
+ const primaryAction = React.useMemo(() => {
+ if (useLegacyFlow) {
+ return (
+
+ );
+ }
+ return (
+
+ );
+ }, [logInPending, onProceedToLogIn, openQRScreen, useLegacyFlow]);
+
return (
@@ -155,13 +234,10 @@
+ {newFlowSection}
-
+ {primaryAction}