Page MenuHomePhabricator
Files F3448089

D14085.id46223.diff
No OneTemporary
Actions

D14085.id46223.diff
View Options

diff --git a/native/account/restore-prompt-screen.react.js b/native/account/restore-prompt-screen.react.js
--- a/native/account/restore-prompt-screen.react.js
+++ b/native/account/restore-prompt-screen.react.js
@@ -2,13 +2,15 @@
import MaterialIcon from '@expo/vector-icons/MaterialCommunityIcons.js';
import * as React from 'react';
-import { Text, View } from 'react-native';
+import { ActivityIndicator, Text, View } from 'react-native';
import PromptButton from './prompt-button.react.js';
import RegistrationButtonContainer from './registration/registration-button-container.react.js';
import RegistrationContainer from './registration/registration-container.react.js';
import RegistrationContentContainer from './registration/registration-content-container.react.js';
import type { SignInNavigationProp } from './sign-in-navigator.react';
+import { useSIWEPanelState } from './siwe-hooks.js';
+import SIWEPanel from './siwe-panel.react.js';
import type { NavigationRoute } from '../navigation/route-names';
import { RestorePasswordAccountScreenRouteName } from '../navigation/route-names.js';
import { useStyles } from '../themes/colors.js';
@@ -18,6 +20,10 @@
+route: NavigationRoute<'RestorePromptScreen'>,
};
+const siweSignatureRequestData = {
+ messageType: 'msg_auth',
+};
+
function RestorePromptScreen(props: Props): React.Node {
const styles = useStyles(unboundStyles);
@@ -25,43 +31,78 @@
props.navigation.navigate(RestorePasswordAccountScreenRouteName);
}, [props.navigation]);
+ const {
+ panelState,
+ openPanel,
+ onPanelClosed,
+ onPanelClosing,
+ siwePanelSetLoading,
+ } = useSIWEPanelState();
+ let siwePanel;
+ if (panelState !== 'closed') {
+ siwePanel = (
+ <SIWEPanel
+ onClosing={onPanelClosing}
+ onClosed={onPanelClosed}
+ closing={panelState === 'closing'}
+ onSuccessfulWalletSignature={() => {}}
+ siweSignatureRequestData={siweSignatureRequestData}
+ setLoading={siwePanelSetLoading}
+ />
+ );
+ }
+
+ let activityIndicator = null;
+ if (panelState === 'opening') {
+ activityIndicator = (
+ <View style={styles.loadingContainer}>
+ <View style={styles.backdrop} />
+ <ActivityIndicator size="large" />
+ </View>
+ );
+ }
+
return (
- <RegistrationContainer>
- <RegistrationContentContainer style={styles.scrollViewContentContainer}>
- <Text style={styles.header}>Restore account</Text>
- <Text style={styles.section}>
- If you’ve lost access to your primary device, you can try recovering
- your Comm account.
- </Text>
- <Text style={styles.section}>
- To proceed, select the same login method that you used during
- registration.
- </Text>
- <Text style={styles.section}>
- Note that after completing the recovery flow, you will be logged out
- from all of your other devices.
- </Text>
- <View style={styles.iconContainer}>
- <MaterialIcon name="backup-restore" size={200} color="white" />
- </View>
- </RegistrationContentContainer>
- <RegistrationButtonContainer>
- <View style={styles.buttonContainer}>
- <PromptButton
- text="Restore with Ethereum"
- onPress={() => {}}
- variant="siwe"
- />
- </View>
- <View style={styles.buttonContainer}>
- <PromptButton
- text="Restore with password"
- onPress={openPasswordRestoreScreen}
- variant="enabled"
- />
- </View>
- </RegistrationButtonContainer>
- </RegistrationContainer>
+ <>
+ <RegistrationContainer>
+ <RegistrationContentContainer style={styles.scrollViewContentContainer}>
+ <Text style={styles.header}>Restore account</Text>
+ <Text style={styles.section}>
+ If you’ve lost access to your primary device, you can try recovering
+ your Comm account.
+ </Text>
+ <Text style={styles.section}>
+ To proceed, select the same login method that you used during
+ registration.
+ </Text>
+ <Text style={styles.section}>
+ Note that after completing the recovery flow, you will be logged out
+ from all of your other devices.
+ </Text>
+ <View style={styles.iconContainer}>
+ <MaterialIcon name="backup-restore" size={200} color="white" />
+ </View>
+ </RegistrationContentContainer>
+ <RegistrationButtonContainer>
+ <View style={styles.buttonContainer}>
+ <PromptButton
+ text="Restore with Ethereum"
+ onPress={openPanel}
+ variant="siwe"
+ />
+ </View>
+ <View style={styles.buttonContainer}>
+ <PromptButton
+ text="Restore with password"
+ onPress={openPasswordRestoreScreen}
+ variant="enabled"
+ />
+ </View>
+ </RegistrationButtonContainer>
+ </RegistrationContainer>
+ {activityIndicator}
+ {siwePanel}
+ </>
);
}
@@ -89,6 +130,22 @@
scrollViewContentContainer: {
flexGrow: 1,
},
+ loadingContainer: {
+ position: 'absolute',
+ top: 0,
+ bottom: 0,
+ left: 0,
+ right: 0,
+ alignItems: 'center',
+ justifyContent: 'center',
+ },
+ backdrop: {
+ backgroundColor: 'black',
+ opacity: 0.6,
+ width: '100%',
+ height: '100%',
+ position: 'absolute',
+ },
};
export default RestorePromptScreen;

File Metadata

Mime Type
text/plain
Expires
Thu, Dec 12, 8:42 PM (21 h, 3 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2649381
Default Alt Text
D14085.id46223.diff (5 KB)

Event Timeline