aboutsummaryrefslogtreecommitdiff
path: root/src/screens/onboarding/Verification.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/screens/onboarding/Verification.tsx')
-rw-r--r--src/screens/onboarding/Verification.tsx94
1 files changed, 47 insertions, 47 deletions
diff --git a/src/screens/onboarding/Verification.tsx b/src/screens/onboarding/Verification.tsx
index 1dd4cf9e..827f65e1 100644
--- a/src/screens/onboarding/Verification.tsx
+++ b/src/screens/onboarding/Verification.tsx
@@ -3,12 +3,7 @@ import React from 'react';
import {RootStackParamList} from '../../routes';
import {RouteProp} from '@react-navigation/native';
import {StackNavigationProp} from '@react-navigation/stack';
-import {
- Background,
- CenteredView,
- RegistrationWizard,
- SubmitButton,
-} from '../../components';
+import {Background, RegistrationWizard, SubmitButton} from '../../components';
import {Text} from 'react-native-animatable';
import {
CodeField,
@@ -16,7 +11,12 @@ import {
useBlurOnFulfill,
useClearByFocusCell,
} from 'react-native-confirmation-code-field';
-import {StyleSheet, View, TouchableOpacity, KeyboardAvoidingView} from 'react-native';
+import {
+ StyleSheet,
+ View,
+ TouchableOpacity,
+ KeyboardAvoidingView,
+} from 'react-native';
type LoginScreenRouteProp = RouteProp<RootStackParamList, 'Login'>;
type LoginScreenNavigationProp = StackNavigationProp<
RootStackParamList,
@@ -37,43 +37,43 @@ const Verification: React.FC<VerificationProps> = ({}) => {
return (
<Background centered style={styles.container}>
- <RegistrationWizard style={styles.wizard} step="one" />
- <KeyboardAvoidingView behavior='padding' style={styles.form}>
- <Text style={styles.formHeader}>Enter 6 digit code</Text>
- <Text style={styles.description}>
- We sent a 6 digit verification code to the email you provided.
- </Text>
- <CodeField
- ref={ref}
- {...valueProps}
- value={value}
- onChangeText={setValue}
- cellCount={6}
- rootStyle={styles.codeFieldRoot}
- keyboardType="number-pad"
- textContentType="oneTimeCode"
- renderCell={({index, symbol, isFocused}) => (
- <View
- onLayout={getCellOnLayoutHandler(index)}
- key={index}
- style={[styles.cellRoot, isFocused && styles.focusCell]}>
- <Text style={styles.cellText}>
- {symbol || (isFocused ? <Cursor /> : null)}
- </Text>
- </View>
- )}
- />
- <SubmitButton
- text="Verify"
- color="#fff"
- style={styles.button}
- accessibilityLabel="Verify"
- accessibilityHint="Select this after entering your email verification code"
- />
- <TouchableOpacity>
- <Text style={styles.resend}>Resend Code</Text>
- </TouchableOpacity>
- </KeyboardAvoidingView>
+ <RegistrationWizard style={styles.wizard} step="one" />
+ <KeyboardAvoidingView behavior="padding" style={styles.form}>
+ <Text style={styles.formHeader}>Enter 6 digit code</Text>
+ <Text style={styles.description}>
+ We sent a 6 digit verification code to the email you provided.
+ </Text>
+ <CodeField
+ ref={ref}
+ {...valueProps}
+ value={value}
+ onChangeText={setValue}
+ cellCount={6}
+ rootStyle={styles.codeFieldRoot}
+ keyboardType="number-pad"
+ textContentType="oneTimeCode"
+ renderCell={({index, symbol, isFocused}) => (
+ <View
+ onLayout={getCellOnLayoutHandler(index)}
+ key={index}
+ style={[styles.cellRoot, isFocused && styles.focusCell]}>
+ <Text style={styles.cellText}>
+ {symbol || (isFocused ? <Cursor /> : null)}
+ </Text>
+ </View>
+ )}
+ />
+ <SubmitButton
+ text="Verify"
+ color="#fff"
+ style={styles.button}
+ accessibilityLabel="Verify"
+ accessibilityHint="Select this after entering your email verification code"
+ />
+ <TouchableOpacity>
+ <Text style={styles.resend}>Resend Code</Text>
+ </TouchableOpacity>
+ </KeyboardAvoidingView>
</Background>
);
};
@@ -87,7 +87,7 @@ const styles = StyleSheet.create({
wizard: {
marginTop: '3.5%',
flex: 1,
- justifyContent: 'center'
+ justifyContent: 'center',
},
form: {
alignItems: 'center',
@@ -137,7 +137,7 @@ const styles = StyleSheet.create({
borderBottomWidth: 2,
},
button: {
- marginVertical: '5%'
- }
+ marginVertical: '5%',
+ },
});
export default Verification;