update send reset password mail

components/Form/ForgotPasswordForm.js

+import React, { Component } from 'react';
+import { Field, reduxForm } from 'redux-form';
+import Input from './Input';
+import GradientBtn from '../GradientBtn';
+import { theme } from '../../constants/Styles';
+
+// validation
+const required = value => (value ? undefined : 'This is a required field.');
+const email = value =>
+	value &&
+	!/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/i.test(
+		value
+	)
+		? 'Invalid E-mail'
+		: undefined;
+
+class ForgotPassword extends Component {
+	render() {
+		return (
+			<>
+				<Field
+					forwardRef
+					ref={c => (this.email = c)}
+					refField="email"
+					name="email"
+					keyboardType="email-address"
+					component={Input}
+					validate={[required, email]}
+					placeholder="E-mail"
+					style={theme.containerWithVerticalMargin}
+				/>
+				<GradientBtn onPress={this.props.handleSubmit} title={'send'} />
+			</>
+		);
+	}
+}
+
+const ForgotPasswordForm = reduxForm({
+	form: 'forgotpassword',
+})(ForgotPassword);
+
+export default ForgotPasswordForm;

screens/Public/ForgotPasswordScreen.js

 import React, { Component } from 'react';
-import { Text, Icon } from 'native-base';
+import { Text } from 'native-base';
 import { View } from 'react-native';
 import { theme } from '../../constants/Styles';
-import { Form, Field } from 'react-native-validate-form';
-import InputField from '../../components/InputField';
-import GradientBtn from '../../components/GradientBtn';
 import { HeaderButtons, Item } from 'react-navigation-header-buttons';
 import IoniconsHeaderButton from '../../components/IoniconsHeaderButton';
-// validations
-const required = value => (value ? undefined : 'This is a required field.');
-const email = value =>
-	value && !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,5}$/i.test(value)
-		? 'Please provide a valid email address.'
-		: undefined;
+import ForgotPasswordForm from '../../components/Form/ForgotPasswordForm';
+import app from '../../firebase';
+
 export default class ForgotPasswordScreen extends Component {
 	static navigationOptions = ({ navigation }) => ({
 		title: undefined,
-		// headerStyle: { borderBottomWidth: 0 },
 		headerLeft: (
 			<HeaderButtons HeaderButtonComponent={IoniconsHeaderButton}>
 				<Item title="back" iconName="ios-arrow-back" onPress={() => navigation.goBack()} dark />
@@ -25,28 +18,12 @@ export default class ForgotPasswordScreen extends Component {
 		headerRight: null,
 	});
 
-	state = {
-		errors: [],
-		email: '',
+	handleSubmit = async values => {
+		const auth = app.auth();
+		const emailAddress = values.email;
+		this.props.navigation.navigate('SendEmail', { email: emailAddress });
+		await auth.sendPasswordResetEmail(emailAddress);
 	};
-	submitForm() {
-		let submitResults = this.registerForm.validate();
-
-		let errors = [];
-
-		submitResults.forEach(item => {
-			errors.push({ field: item.fieldName, error: item.error });
-		});
-		this.setState({ errors: errors });
-	}
-
-	submitSuccess() {
-		console.log('Submit Success!');
-	}
-
-	submitFailed() {
-		console.log('Submit Failed!');
-	}
 
 	render() {
 		return (
@@ -56,30 +33,7 @@ export default class ForgotPasswordScreen extends Component {
 					<Text style={theme.normalText}>Please enter your email address.</Text>
 					<Text style={theme.normalText}>You will receive a link to create a new password via email.</Text>
 				</View>
-				<Form
-					ref={ref => (this.registerForm = ref)}
-					validate={true}
-					submit={this.submitSuccess.bind(this)}
-					failed={this.submitFailed.bind(this)}
-					errors={this.state.errors}
-					style={theme.containerWithVerticalMargin}
-				>
-					<Field
-						required
-						component={InputField}
-						validations={[required, email]}
-						name="email"
-						value={this.state.email}
-						onChangeText={val => this.setState({ email: val })}
-						placeholder="Your E-mail"
-					/>
-				</Form>
-				<GradientBtn
-					onPress={() => {
-						this.props.navigation.navigate('SendEmail');
-					}}
-					title={'send'}
-				/>
+				<ForgotPasswordForm onSubmit={this.handleSubmit} />
 			</View>
 		);
 	}

screens/Public/SendEmailScreen.js

@@ -3,11 +3,17 @@ import { Text, View, Button } from 'native-base';
 import { Image } from 'react-native';
 import { theme } from '../../constants/Styles';
 import GradientBtn from '../../components/GradientBtn';
+import app from '../../firebase';
 
 export default class SendEmailScreen extends Component {
 	static navigationOptions = ({ navigation }) => ({
 		header: null,
 	});
+	resendMail = async () => {
+		const email = this.props.navigation.getParam('email');
+		const auth = app.auth();
+		await auth.sendPasswordResetEmail(email);
+	};
 	render() {
 		return (
 			<View style={[theme.centerContainer, { paddingHorizontal: 50 }]}>
@@ -35,7 +41,9 @@ export default class SendEmailScreen extends Component {
 						title={'done'}
 					/>
 					<Button full transparent style={{ marginTop: 10 }}>
-						<Text style={theme.normalText}>RESEND</Text>
+						<Text style={theme.normalText} onPress={this.resendMail}>
+							RESEND
+						</Text>
 					</Button>
 				</View>
 			</View>