Warn if different wallet (#1677)

* Warn me if I want to sync a different wallet * remove existing user check from importwallet * locales
MetaMask · Jul 7, 2020 · c6996bc · c6996bc
1 parent 4de93db
commit c6996bc
Show file tree

Hide file tree

Showing 6 changed files with 154 additions and 105 deletions.
diff --git a/app/components/UI/ActionModal/ActionContent/index.js b/app/components/UI/ActionModal/ActionContent/index.js
@@ -7,7 +7,7 @@ import { strings } from '../../../../../locales/i18n';
 
 const styles = StyleSheet.create({
 	viewWrapper: {
-		flexDirection: 'column',
+		flex: 1,
 		justifyContent: 'center',
 		alignItems: 'center',
 		marginHorizontal: 24
@@ -19,24 +19,26 @@ const styles = StyleSheet.create({
 	},
 	actionContainer: {
 		borderTopColor: colors.grey200,
-		borderTopWidth: 1,
+		borderTopWidth: 1
+	},
+	actionHorizontalContainer: {
 		flexDirection: 'row',
 		padding: 16
 	},
+	actionVerticalContainer: {
+		flexDirection: 'column',
+		paddingHorizontal: 16,
+		paddingVertical: 8
+	},
 	childrenContainer: {
-		minHeight: 250,
-		width: '100%',
 		flexDirection: 'row',
 		alignItems: 'center'
 	},
 	button: {
-		flex: 1
-	},
-	cancel: {
-		marginRight: 8
+		margin: 8
 	},
-	confirm: {
-		marginLeft: 8
+	buttonHorizontal: {
+		flex: 1
 	}
 });
 
@@ -61,19 +63,26 @@ export default function ActionContent({
 	viewWrapperStyle,
 	viewContainerStyle,
 	actionContainerStyle,
-	childrenContainerStyle
+	childrenContainerStyle,
+	verticalButtons
 }) {
 	return (
 		<View style={[styles.viewWrapper, viewWrapperStyle]}>
 			<View style={[styles.viewContainer, viewContainerStyle]}>
 				<View style={[styles.childrenContainer, childrenContainerStyle]}>{children}</View>
-				<View style={[styles.actionContainer, actionContainerStyle]}>
+				<View
+					style={[
+						styles.actionContainer,
+						verticalButtons ? styles.actionVerticalContainer : styles.actionHorizontalContainer,
+						actionContainerStyle
+					]}
+				>
 					{displayCancelButton && (
 						<StyledButton
 							testID={cancelTestID}
 							type={cancelButtonMode}
 							onPress={onCancelPress}
-							containerStyle={[styles.button, displayConfirmButton ? styles.cancel : {}]}
+							containerStyle={[styles.button, verticalButtons ? {} : styles.buttonHorizontal]}
 						>
 							{cancelText}
 						</StyledButton>
@@ -83,7 +92,7 @@ export default function ActionContent({
 							testID={confirmTestID}
 							type={confirmButtonMode}
 							onPress={onConfirmPress}
-							containerStyle={[styles.button, displayCancelButton ? styles.confirm : {}]}
+							containerStyle={[styles.button, verticalButtons ? {} : styles.buttonHorizontal]}
 							disabled={confirmDisabled}
 						>
 							{confirmText}
@@ -130,11 +139,11 @@ ActionContent.propTypes = {
 	/**
 	 * Type of button to show as the cancel button
 	 */
-	cancelButtonMode: PropTypes.oneOf(['cancel', 'neutral', 'confirm', 'normal']),
+	cancelButtonMode: PropTypes.oneOf(['cancel', 'neutral', 'confirm', 'normal', 'warning']),
 	/**
 	 * Type of button to show as the confirm button
 	 */
-	confirmButtonMode: PropTypes.oneOf(['normal', 'confirm', 'warning']),
+	confirmButtonMode: PropTypes.oneOf(['normal', 'neutral', 'confirm', 'warning']),
 	/**
 	 * Whether confirm button is disabled
 	 */
@@ -171,6 +180,10 @@ ActionContent.propTypes = {
 	 * Action container style
 	 */
 	actionContainerStyle: PropTypes.object,
+	/**
+	 * Whether buttons are rendered vertically
+	 */
+	verticalButtons: PropTypes.bool,
 	/**
 	 * Children container style
 	 */

diff --git a/app/components/UI/ActionModal/index.js b/app/components/UI/ActionModal/index.js
@@ -34,7 +34,8 @@ export default function ActionModal({
 	viewWrapperStyle,
 	viewContainerStyle,
 	actionContainerStyle,
-	childrenContainerStyle
+	childrenContainerStyle,
+	verticalButtons
 }) {
 	return (
 		<Modal
@@ -61,6 +62,7 @@ export default function ActionModal({
 				viewContainerStyle={viewContainerStyle}
 				actionContainerStyle={actionContainerStyle}
 				childrenContainerStyle={childrenContainerStyle}
+				verticalButtons={verticalButtons}
 			>
 				{children}
 			</ActionContent>
@@ -100,11 +102,11 @@ ActionModal.propTypes = {
 	/**
 	 * Type of button to show as the cancel button
 	 */
-	cancelButtonMode: PropTypes.oneOf(['cancel', 'neutral', 'confirm', 'normal']),
+	cancelButtonMode: PropTypes.oneOf(['cancel', 'neutral', 'confirm', 'normal', 'warning']),
 	/**
 	 * Type of button to show as the confirm button
 	 */
-	confirmButtonMode: PropTypes.oneOf(['normal', 'confirm', 'warning']),
+	confirmButtonMode: PropTypes.oneOf(['normal', 'neutral', 'confirm', 'warning']),
 	/**
 	 * Whether confirm button is disabled
 	 */
@@ -153,6 +155,10 @@ ActionModal.propTypes = {
 	 * Action container style
 	 */
 	actionContainerStyle: PropTypes.object,
+	/**
+	 * Whether buttons are rendered vertically
+	 */
+	verticalButtons: PropTypes.bool,
 	/**
 	 * Children container style
 	 */

diff --git a/app/components/Views/ImportWallet/index.js b/app/components/Views/ImportWallet/index.js
@@ -145,20 +145,11 @@ class ImportWallet extends PureComponent {
 	mounted = false;
 
 	state = {
-		loading: false,
-		existingUser: false
+		loading: false
 	};
 
-	async checkIfExistingUser() {
-		const existingUser = await AsyncStorage.getItem('@MetaMask:existingUser');
-		if (existingUser !== null) {
-			this.setState({ existingUser: true });
-		}
-	}
-
 	componentDidMount() {
 		this.mounted = true;
-		this.checkIfExistingUser();
 		InteractionManager.runAfterInteractions(() => {
 			PreventScreenshot.forbid();
 		});
@@ -357,48 +348,18 @@ class ImportWallet extends PureComponent {
 		}
 	};
 
-	alertExistingUser = callback => {
-		Alert.alert(
-			strings('sync_with_extension.warning_title'),
-			strings('sync_with_extension.warning_message'),
-			[
-				{ text: strings('sync_with_extension.warning_cancel_button'), onPress: () => false, style: 'cancel' },
-				{ text: strings('sync_with_extension.warning_ok_button'), onPress: () => callback() }
-			],
-			{ cancelable: false }
-		);
-	};
-
 	onPressImport = () => {
-		const { existingUser } = this.state;
-		const action = () => {
-			this.props.navigation.push('ImportFromSeed');
-			InteractionManager.runAfterInteractions(async () => {
-				if (Analytics.getEnabled()) {
-					Analytics.trackEvent(ANALYTICS_EVENT_OPTS.ONBOARDING_SELECTED_IMPORT_WITH_SEEDPHRASE);
-					return;
-				}
-				const metricsOptIn = await AsyncStorage.getItem('@MetaMask:metricsOptIn');
-				if (!metricsOptIn) {
-					this.props.saveOnboardingEvent(ANALYTICS_EVENT_OPTS.ONBOARDING_SELECTED_IMPORT_WITH_SEEDPHRASE);
-				}
-			});
-		};
-		if (existingUser) {
-			this.alertExistingUser(action);
-		} else {
-			action();
-		}
-	};
-
-	safeSync = () => {
-		const { existingUser } = this.state;
-		const action = () => this.onPressSync();
-		if (existingUser) {
-			this.alertExistingUser(action);
-		} else {
-			action();
-		}
+		this.props.navigation.push('ImportFromSeed');
+		InteractionManager.runAfterInteractions(async () => {
+			if (Analytics.getEnabled()) {
+				Analytics.trackEvent(ANALYTICS_EVENT_OPTS.ONBOARDING_SELECTED_IMPORT_WITH_SEEDPHRASE);
+				return;
+			}
+			const metricsOptIn = await AsyncStorage.getItem('@MetaMask:metricsOptIn');
+			if (!metricsOptIn) {
+				this.props.saveOnboardingEvent(ANALYTICS_EVENT_OPTS.ONBOARDING_SELECTED_IMPORT_WITH_SEEDPHRASE);
+			}
+		});
 	};
 
 	onPressSync = () => {
@@ -448,7 +409,7 @@ class ImportWallet extends PureComponent {
 					</View>
 					<View style={styles.ctaWrapper}>
 						<View style={styles.flexGrow}>
-							<StyledButton type={'blue'} onPress={this.safeSync} testID={'onboarding-import-button'}>
+							<StyledButton type={'blue'} onPress={this.onPressSync} testID={'onboarding-import-button'}>
 								{strings('import_wallet.sync_from_browser_extension_button')}
 							</StyledButton>
 						</View>