Add constants for onboarding steps

MetaMask · Aug 27, 2020 · d759321 · d759321
1 parent 7e88543
commit d759321
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 27 deletions.
diff --git a/app/components/Views/AccountBackupStep1/index.js b/app/components/Views/AccountBackupStep1/index.js
@@ -17,6 +17,7 @@ import { getOnboardingNavbarOptions } from '../../UI/Navbar';
 import scaling from '../../../util/scaling';
 import Engine from '../../../core/Engine';
 import { ONBOARDING_WIZARD, METRICS_OPT_IN } from '../../../constants/storage';
+import { CHOOSE_PASSWORD_STEPS } from '../../../constants/onboarding';
 
 const explain_backup_seedphrase = require('../../../images/explain-backup-seedphrase.png'); // eslint-disable-line
 const warning_skip_backup = require('../../../images/warning.png'); // eslint-disable-line
@@ -221,12 +222,6 @@ const AccountBackupStep1 = props => {
 
 	const hideWhatIsSeedphrase = () => setWhatIsSeedphraseModal(false);
 
-	const steps = [
-		strings('choose_password.title'),
-		strings('choose_password.secure'),
-		strings('choose_password.confirm')
-	];
-
 	return (
 		<SafeAreaView style={styles.mainWrapper}>
 			<ScrollView
@@ -235,7 +230,7 @@ const AccountBackupStep1 = props => {
 				testID={'account-backup-step-1-screen'}
 			>
 				<View style={styles.wrapper} testID={'protect-your-account-screen'}>
-					<OnboardingProgress steps={steps} currentStep={1} />
+					<OnboardingProgress steps={CHOOSE_PASSWORD_STEPS} currentStep={1} />
 					<View style={styles.content}>
 						<Text style={styles.title}>{strings('account_backup_step_1.title')}</Text>
 						<Image

diff --git a/app/components/Views/AccountBackupStep1B/index.js b/app/components/Views/AccountBackupStep1B/index.js
@@ -11,6 +11,7 @@ import Device from '../../../util/Device';
 import ActionModal from '../../UI/ActionModal';
 import SeedphraseModal from '../../UI/SeedphraseModal';
 import { getOnboardingNavbarOptions } from '../../UI/Navbar';
+import { CHOOSE_PASSWORD_STEPS } from '../../../constants/onboarding';
 
 const explain_backup_seedphrase = require('../../../images/explain-backup-seedphrase.png'); // eslint-disable-line
 
@@ -212,12 +213,6 @@ const AccountBackupStep1B = props => {
 	const showWhatIsSeedphrase = () => setWhatIsSeedphraseModal(true);
 	const hideWhatIsSeedphrase = () => setWhatIsSeedphraseModal(false);
 
-	const steps = [
-		strings('choose_password.title'),
-		strings('choose_password.secure'),
-		strings('choose_password.confirm')
-	];
-
 	return (
 		<SafeAreaView style={styles.mainWrapper}>
 			<ScrollView
@@ -226,7 +221,7 @@ const AccountBackupStep1B = props => {
 				testID={'account-backup-step-1-screen'}
 			>
 				<View style={styles.wrapper} testID={'protect-your-account-screen'}>
-					<OnboardingProgress steps={steps} currentStep={1} />
+					<OnboardingProgress steps={CHOOSE_PASSWORD_STEPS} currentStep={1} />
 					<View style={styles.content}>
 						<Text style={styles.titleIcon}>🔒</Text>
 						<Text style={styles.title}>{strings('account_backup_step_1B.title')}</Text>

diff --git a/app/components/Views/ChoosePassword/index.js b/app/components/Views/ChoosePassword/index.js
@@ -31,7 +31,7 @@ import {
 	TRUE
 } from '../../../constants/storage';
 
-const steps = [strings('choose_password.title'), strings('choose_password.secure'), strings('choose_password.confirm')];
+import { CHOOSE_PASSWORD_STEPS } from '../../../constants/onboarding';
 
 const styles = StyleSheet.create({
 	mainWrapper: {
@@ -544,7 +544,7 @@ class ChoosePassword extends PureComponent {
 					</View>
 				) : (
 					<View style={styles.wrapper} testID={'choose-password-screen'}>
-						<OnboardingProgress steps={steps} />
+						<OnboardingProgress steps={CHOOSE_PASSWORD_STEPS} />
 						<KeyboardAwareScrollView
 							style={styles.scrollableWrapper}
 							contentContainerStyle={styles.keyboardScrollableWrapper}

diff --git a/app/components/Views/ManualBackupStep1/index.js b/app/components/Views/ManualBackupStep1/index.js
@@ -23,6 +23,12 @@ import PreventScreenshot from '../../../core/PreventScreenshot';
 import SecureKeychain from '../../../core/SecureKeychain';
 import { getOnboardingNavbarOptions } from '../../UI/Navbar';
 import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
+import {
+	MANUAL_BACKUP_STEPS,
+	SEED_PHRASE,
+	CONFIRM_PASSWORD,
+	WRONG_PASSWORD_ERROR
+} from '../../../constants/onboarding';
 
 const styles = StyleSheet.create({
 	mainWrapper: {
@@ -196,10 +202,6 @@ const styles = StyleSheet.create({
 	}
 });
 
-const WRONG_PASSWORD_ERROR = 'Error: Decrypt failed';
-const SEED_PHRASE = 'seed_phrase';
-const CONFIRM_PASSWORD = 'confirm_password';
-
 /**
  * View that's shown during the second step of
  * the backup seed phrase flow
@@ -214,12 +216,6 @@ export default class ManualBackupStep1 extends PureComponent {
 		navigation: PropTypes.object
 	};
 
-	steps = [
-		strings('manual_backup.progressOne'),
-		strings('manual_backup.progressTwo'),
-		strings('manual_backup.progressThree')
-	];
-
 	state = {
 		seedPhraseHidden: true,
 		currentStep: 1,
@@ -396,7 +392,7 @@ export default class ManualBackupStep1 extends PureComponent {
 		return (
 			<SafeAreaView style={styles.mainWrapper}>
 				<View style={styles.onBoardingWrapper}>
-					<OnboardingProgress currentStep={currentStep} steps={this.steps} />
+					<OnboardingProgress currentStep={currentStep} steps={MANUAL_BACKUP_STEPS} />
 				</View>
 				{view === SEED_PHRASE ? this.renderSeedphraseView() : this.renderConfirmPassword()}
 			</SafeAreaView>

diff --git a/app/constants/onboarding.js b/app/constants/onboarding.js
@@ -0,0 +1,17 @@
+import { strings } from '../../locales/i18n';
+
+export const CHOOSE_PASSWORD_STEPS = [
+	strings('choose_password.title'),
+	strings('choose_password.secure'),
+	strings('choose_password.confirm')
+];
+
+export const MANUAL_BACKUP_STEPS = [
+	strings('manual_backup.progressOne'),
+	strings('manual_backup.progressTwo'),
+	strings('manual_backup.progressThree')
+];
+
+export const WRONG_PASSWORD_ERROR = 'Error: Decrypt failed';
+export const SEED_PHRASE = 'seed_phrase';
+export const CONFIRM_PASSWORD = 'confirm_password';