Skip to content

Commit 2de4a39

Browse files
Take 2 updates
1 parent 3fdb8ed commit 2de4a39

File tree

1 file changed

+31
-33
lines changed

1 file changed

+31
-33
lines changed

passwordGenerator03/App.tsx

Lines changed: 31 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { SafeAreaView, ScrollView, StyleSheet, Text, TextInput, TouchableOpacity, View } from 'react-native'
22
import React, { useState } from 'react'
3-
import BouncyCheckbox from "react-native-bouncy-checkbox";
43

4+
import BouncyCheckbox from "react-native-bouncy-checkbox";
55

66
// Form validation
77
import * as Yup from 'yup'
@@ -75,17 +75,16 @@ export default function App() {
7575
}
7676

7777
return (
78-
<ScrollView>
78+
<ScrollView keyboardShouldPersistTaps="handled">
7979
<SafeAreaView style={styles.appContainer}>
80-
<View style={styles.formContainer}>
81-
<Text style={styles.title}>Password Generator</Text>
82-
<Formik
80+
<View style={styles.formContainer}>
81+
<Text style={styles.title}>Password Generator</Text>
82+
<Formik
8383
initialValues={{ passwordLength: '' }}
8484
validationSchema={PasswordSchema}
85-
onSubmit={values => {
86-
//console.log(values);
87-
88-
generatePasswordString(+values.passwordLength)
85+
onSubmit={ values => {
86+
console.log(values);
87+
generatePasswordString(+values.passwordLength)
8988
}}
9089
>
9190
{({
@@ -107,21 +106,22 @@ export default function App() {
107106
{errors.passwordLength}
108107
</Text>
109108
)}
109+
110110
</View>
111111
<TextInput
112-
style={styles.inputStyle}
113-
value={values.passwordLength}
114-
onChangeText={handleChange('passwordLength')}
115-
placeholder="EX. 8"
116-
keyboardType='numeric'
117-
/>
112+
style={styles.inputStyle}
113+
value={values.passwordLength}
114+
onChangeText={handleChange('passwordLength')}
115+
placeholder="Ex. 8"
116+
keyboardType='numeric'
117+
/>
118118
</View>
119119
<View style={styles.inputWrapper}>
120-
<Text style={styles.heading}>Include lowerCase</Text>
120+
<Text style={styles.heading}>Include lowercase</Text>
121121
<BouncyCheckbox
122122
disableBuiltInState
123123
isChecked={lowerCase}
124-
onPress={() => setLowerCase(!lowerCase) }
124+
onPress={() => setLowerCase(!lowerCase)}
125125
fillColor="#29AB87"
126126
/>
127127
</View>
@@ -152,37 +152,35 @@ export default function App() {
152152
fillColor="#FC80A5"
153153
/>
154154
</View>
155-
156155
<View style={styles.formActions}>
157156
<TouchableOpacity
158157
disabled={!isValid}
159158
style={styles.primaryBtn}
160159
onPress={handleSubmit}
161160
>
162-
<Text style={styles.primaryBtnTxt}>Generate</Text>
161+
<Text style={styles.primaryBtnTxt}>Generate Password</Text>
163162
</TouchableOpacity>
164163
<TouchableOpacity
165-
166164
style={styles.secondaryBtn}
167-
onPress={() => {
168-
handleReset()
165+
onPress={ () => {
166+
handleReset();
169167
resetPasswordState()
170-
}}>
171-
<Text style={styles.secondaryBtnTxt}>Reset</Text>
172-
168+
}}
169+
>
170+
<Text style={styles.secondaryBtnTxt}>Reset</Text>
173171
</TouchableOpacity>
174172
</View>
175173
</>
176174
)}
177-
</Formik>
178-
</View>
179-
180-
{isPassGenerated ? (
181-
<View style={[styles.card, styles.cardElevated]}>
182-
<Text style={styles.description}>Result</Text>
183-
<Text selectable={true} style={styles.generatedPassword}>{password}</Text>
175+
</Formik>
184176
</View>
185-
): null}
177+
{isPassGenerated ? (
178+
<View style={[styles.card, styles.cardElevated]}>
179+
<Text style={styles.subTitle}>Result:</Text>
180+
<Text style={styles.description}>Long Press to copy</Text>
181+
<Text selectable={true} style={styles.generatedPassword}>{password}</Text>
182+
</View>
183+
) : null}
186184
</SafeAreaView>
187185
</ScrollView>
188186
)

0 commit comments

Comments
 (0)