diff options
| -rw-r--r-- | src/screens/onboarding/BasicInfoOnboarding.tsx | 111 |
1 files changed, 64 insertions, 47 deletions
diff --git a/src/screens/onboarding/BasicInfoOnboarding.tsx b/src/screens/onboarding/BasicInfoOnboarding.tsx index 1e3522bd..8ddb74e1 100644 --- a/src/screens/onboarding/BasicInfoOnboarding.tsx +++ b/src/screens/onboarding/BasicInfoOnboarding.tsx @@ -208,31 +208,38 @@ const BasicInfoOnboarding: React.FC<BasicInfoOnboardingProps> = ({route}) => { }; const formSteps: { placeholder: string; - onChangeText: (text: string) => void; + onChangeText: (text: string) => void; + value: string; }[] = [ { placeholder: 'First Name', onChangeText: (text) => handleNameUpdate(text, 0), + value: form.fname }, { placeholder: 'Last Name', onChangeText: (text) => handleNameUpdate(text, 1), + value: form.lname }, { placeholder: 'Phone', onChangeText: handlePhoneUpdate, + value: form.phone }, { placeholder: 'School Email', onChangeText: handleEmailUpdate, + value: form.email }, { placeholder: 'Username', onChangeText: (text) => handleNameUpdate(text, 2), + value: form.username }, { placeholder: 'Password', onChangeText: handlePasswordUpdate, + value: form.password }, ]; const resetForm = (formStep: String) => { @@ -421,6 +428,7 @@ const BasicInfoOnboarding: React.FC<BasicInfoOnboardingProps> = ({route}) => { returnKeyType="done" selectionColor="white" onChangeText={step.onChangeText} + value={step.value} onSubmitEditing={advance} autoFocus={true} blurOnSubmit={false} @@ -443,52 +451,61 @@ const BasicInfoOnboarding: React.FC<BasicInfoOnboardingProps> = ({route}) => { </Animated.View> </> ) : ( - <><Text style={styles.formHeader}>SIGN UP</Text> - <Animated.View - style={[styles.formContainer, { opacity: fadeValue }]}> - <TaggInput - accessibilityHint="Enter a password." - accessibilityLabel="Password input field." - placeholder="Password" - autoCompleteType="password" - textContentType="oneTimeCode" - returnKeyType="done" - selectionColor="white" - onChangeText={handlePasswordUpdate} - onSubmitEditing={advanceRegistration} - blurOnSubmit={false} - autoFocus={true} - secureTextEntry={!passVisibility} - valid={valid} - externalStyles={{ - warning: styles.passWarning, - }} - invalidWarning={'Password must be at least 8 characters & contain at least one of a-z, A-Z, 0-9, and a special character.'} - attemptedSubmit={attemptedSubmit} - style={attemptedSubmit && !valid - ? [styles.input, styles.invalidColor] - : styles.input} /> - <TouchableOpacity - accessibilityLabel="Show password button" - accessibilityHint="Select this if you want to display your tagg password" - style={styles.showPassContainer} - onPress={() => setPassVisibility(!passVisibility)}> - <Text style={styles.showPass}>Show Password</Text> - </TouchableOpacity> - <LoadingIndicator /> - <TermsConditions - style={styles.tc} - accepted={tcAccepted} - onChange={setTCAccepted} /> - <Animated.View style={{ opacity: fadeButtonValue }}> - <TaggSquareButton - onPress={advanceRegistration} - title={'Next'} - buttonStyle={'normal'} - buttonColor={'white'} - labelColor={'blue'} /> - </Animated.View> - </Animated.View></> + <> + <Text style={styles.formHeader}>SIGN UP</Text> + <Animated.View + style={[styles.formContainer, {opacity: fadeValue}]}> + <TaggInput + accessibilityHint="Enter a password." + accessibilityLabel="Password input field." + placeholder="Password" + autoCompleteType="password" + textContentType="oneTimeCode" + returnKeyType="done" + selectionColor="white" + onChangeText={handlePasswordUpdate} + onSubmitEditing={advanceRegistration} + blurOnSubmit={false} + autoFocus={true} + secureTextEntry={!passVisibility} + valid={valid} + externalStyles={{ + warning: styles.passWarning, + }} + invalidWarning={ + 'Password must be at least 8 characters & contain at least one of a-z, A-Z, 0-9, and a special character.' + } + attemptedSubmit={attemptedSubmit} + style={ + attemptedSubmit && !valid + ? [styles.input, styles.invalidColor] + : styles.input + } + /> + <TouchableOpacity + accessibilityLabel="Show password button" + accessibilityHint="Select this if you want to display your tagg password" + style={styles.showPassContainer} + onPress={() => setPassVisibility(!passVisibility)}> + <Text style={styles.showPass}>Show Password</Text> + </TouchableOpacity> + <LoadingIndicator /> + <TermsConditions + style={styles.tc} + accepted={tcAccepted} + onChange={setTCAccepted} + /> + <Animated.View style={{opacity: fadeButtonValue}}> + <TaggSquareButton + onPress={advanceRegistration} + title={'Next'} + buttonStyle={'normal'} + buttonColor={'white'} + labelColor={'blue'} + /> + </Animated.View> + </Animated.View> + </> )} </> )} |