Commit 85c4a50a by Tonk

remove unused form, change remember me checkbox

parent 4c1b6bcd
import React from 'react';
import { Field, reduxForm } from 'redux-form';
import { View, Text, TouchableOpacity } from 'react-native';
import Input from './Input';
//Validation
const required = value => (value ? undefined : 'Required');
const maxLength15 = value => (value && value.length > 15 ? `Must be 15 characters or less` : undefined);
const number = value => (value && isNaN(Number(value)) ? 'Must be a number' : undefined);
const minValue = min => value => (value && value < min ? `Must be at least ${min}` : undefined);
const minValue18 = minValue(18);
const isValidEmail = value =>
value && !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(value) ? 'Invalid email address' : undefined;
//Warning
const over70YearsOld = value => (value && value > 70 ? 'You might be too old for using this' : undefined);
const isYahooMail = value => (value && /.+@yahoo\.com/.test(value) ? 'Really? You still use yahoo mail ?' : undefined);
// const submit = values => {
// alert(`Validation success. Values = ~${JSON.stringify(values)}`);
// };
const ContactComponent = props => {
const { handleSubmit } = props;
return (
<View>
<Field
name="username"
keyboardType="default"
component={Input}
validate={[required, maxLength15]}
placeholder={'Username'}
/>
<Field
name="email"
keyboardType="email-address"
component={Input}
validate={isValidEmail}
warn={isYahooMail}
placeholder={'E-mail'}
/>
<Field
name="password"
keyboardType="default"
placeholder="password"
component={Input}
validate={[required]}
isPass
/>
{props.children}
<TouchableOpacity onPress={handleSubmit} style={{ margin: 10, alignItems: 'center' }}>
<Text
style={{
backgroundColor: 'steelblue',
color: 'white',
fontSize: 16,
height: 37,
width: 200,
textAlign: 'center',
padding: 10,
}}
>
Submit
</Text>
</TouchableOpacity>
</View>
);
};
const ContactForm = reduxForm({
form: 'contact', // a unique identifier for this form
})(ContactComponent);
export default ContactForm;
import React, { Component } from 'react';
import { Text, CheckBox } from 'native-base';
import { Text, CheckBox, Icon } from 'native-base';
import { theme, color } from '../../constants/Styles';
import AsyncStorage from '@react-native-community/async-storage';
import LoginForm from '../../components/Form/LoginForm';
......@@ -46,17 +46,18 @@ class LoginScreen extends Component {
};
render() {
const { isCheck } = this.state;
return (
<KeyboardAvoidingView style={theme.introContainer}>
<Text style={[theme.title, theme.textDark]}>Login</Text>
<LoginForm onSubmit={async values => await this.handleSignIn(values)}>
<View style={[theme.rowContainer, theme.mt1, { justifyContent: 'space-between' }]}>
<View style={[theme.rowContainer]}>
<CheckBox
color={color.grey}
checked={this.state.isCheck}
<Icon
type="MaterialCommunityIcons"
name={isCheck ? 'check-circle' : 'checkbox-blank-circle-outline'}
onPress={() => this.setState(prevState => ({ isCheck: !prevState.isCheck }))}
style={{ left: 0 }}
style={{ color: color.grey, fontSize: 25 }}
/>
<Text style={[theme.description, { marginLeft: 5 }]}>Remember me</Text>
</View>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment