diff options
author | Justin Shillingford <jgs272@cornell.edu> | 2020-06-29 18:56:48 -0400 |
---|---|---|
committer | Justin Shillingford <jgs272@cornell.edu> | 2020-06-29 18:56:48 -0400 |
commit | 8f478fa2e1d4d2b1361a575bd80a928038741ee9 (patch) | |
tree | ab090f185d22ddb8356056c02b0ff953f2f43a1b | |
parent | 94f966fb947262405130488cbe84cabfc2989fb2 (diff) |
Added isPassword prop to LoginInput.tsx
-rw-r--r-- | src/components/common/LoginInput.tsx | 45 | ||||
-rw-r--r-- | src/screens/Login.tsx | 8 |
2 files changed, 38 insertions, 15 deletions
diff --git a/src/components/common/LoginInput.tsx b/src/components/common/LoginInput.tsx index 55d2e662..dae3241c 100644 --- a/src/components/common/LoginInput.tsx +++ b/src/components/common/LoginInput.tsx @@ -6,27 +6,49 @@ const LoginInput = (props: LoginInputProps) => { return ( <TextInput accessibilityLabel={ - props.isUsername ? 'Username text entry box' : 'Password text entry box' + props.isUsername + ? 'Username text entry box' + : props.isPassword + ? 'Password text entry box' + : undefined } accessibilityHint={ props.isUsername ? 'Enter your tagg username here' - : 'Enter your tagg password here' + : props.isPassword + ? 'Enter your tagg password here' + : undefined } style={styles.credentials} placeholder={props.isUsername ? 'Username' : 'Password'} placeholderTextColor="#FFFFFF" - autoCompleteType={props.isUsername ? 'username' : 'password'} - textContentType={props.isUsername ? 'username' : 'password'} - returnKeyType={props.isUsername ? 'next' : 'go'} - keyboardType={props.isUsername ? 'ascii-capable' : 'default'} + autoCompleteType={ + props.isUsername ? 'username' : props.isPassword ? 'password' : 'off' + } + textContentType={ + props.isUsername ? 'username' : props.isPassword ? 'password' : 'none' + } + returnKeyType={ + props.isUsername ? 'next' : props.isPassword ? 'go' : 'default' + } + keyboardType={ + props.isUsername + ? 'ascii-capable' + : props.isPassword + ? 'default' + : 'default' + } onChangeText={(input) => props.onChangeText(input)} defaultValue={props.type} onSubmitEditing={props.onSubmitEditing} - blurOnSubmit={props.isUsername ? false : undefined} + blurOnSubmit={ + props.isUsername ? false : props.isPassword ? undefined : undefined + } // ref={props.isUsername ? undefined : useRef()} - secureTextEntry={props.isUsername ? false : true} - // focus={props.isUsername ? undefined : props.focusPasswordInput} + secureTextEntry={ + props.isUsername ? false : props.isPassword ? true : false + } + // focus={props.isUsername ? undefined : props.focusPasswordInput} /> ); }; @@ -48,10 +70,11 @@ const styles = StyleSheet.create({ LoginInput.propTypes = { type: PropTypes.string.isRequired, - isUsername: PropTypes.bool.isRequired, + isUsername: PropTypes.bool, + isPassword: PropTypes.bool, onChangeText: PropTypes.func.isRequired, onSubmitEditing: PropTypes.func, -// ref: PropTypes.any, + // ref: PropTypes.any, focusPasswordInput: PropTypes.bool, }; diff --git a/src/screens/Login.tsx b/src/screens/Login.tsx index e7778f1d..f7445018 100644 --- a/src/screens/Login.tsx +++ b/src/screens/Login.tsx @@ -37,7 +37,7 @@ const Login = ({navigation}: LoginProps) => { Updates the state of username. Also verifies the input of the Username field. */ const handleUsernameUpdate = (val: string) => { - var validLength: boolean = val.trim().length >= 6; + let validLength: boolean = val.trim().length >= 6; if (validLength) { setData({ @@ -58,7 +58,7 @@ const Login = ({navigation}: LoginProps) => { Updates the state of password. Also verifies the input of the Password field. */ const handlePasswordUpdate = (val: string) => { - var validLength: boolean = val.trim().length >= 8; + let validLength: boolean = val.trim().length >= 8; if (validLength) { setData({ @@ -95,7 +95,7 @@ const Login = ({navigation}: LoginProps) => { // ...data, // focusPasswordInput: true, // }); - Alert.alert("Coming soon 🚧") + Alert.alert('Coming soon 🚧'); }; return ( @@ -125,7 +125,7 @@ const Login = ({navigation}: LoginProps) => { )} <LoginInput type={data.password} - isUsername={false} + isPassword={true} onChangeText={(user) => handlePasswordUpdate(user)} focusPasswordInput={data.focusPasswordInput} onSubmitEditing={() => handleLogin()} |