From 69b9513a19e8d0aa280bae8ec7b91dd5e81de2fa Mon Sep 17 00:00:00 2001 From: "Alberto Duarte (PWC)" Date: Mon, 9 Oct 2023 17:31:33 +0100 Subject: Second commit --- screens/signup.js | 402 +++++++++++++++++++++++++++--------------------------- 1 file changed, 201 insertions(+), 201 deletions(-) (limited to 'screens/signup.js') diff --git a/screens/signup.js b/screens/signup.js index 73edf4f..5f531d3 100644 --- a/screens/signup.js +++ b/screens/signup.js @@ -1,201 +1,201 @@ -import {useEffect, useState} from 'react'; -import { - Keyboard, - KeyboardAvoidingView, - Platform, - Pressable, - SafeAreaView, - Text, - TextInput, - TouchableWithoutFeedback, - View, -} from 'react-native'; - -import auth from '@react-native-firebase/auth'; -import tw from 'twrnc'; -import {useToast} from 'react-native-toast-notifications'; - -import Logo from '../static/images/netflix-logo.svg'; -import {EyeIcon} from 'react-native-heroicons/outline'; -import {EyeSlashIcon} from 'react-native-heroicons/outline'; - -const SignUp = ({navigation}) => { - const [email, setEmail] = useState(''); - const [password, setPassword] = useState(''); - const [isValidEmail, setIsValidEmail] = useState(false); - const [isValidPassword, setIsValidPassword] = useState(false); - const [isPasswordVisible, setIsPasswordVisible] = useState(false); - - const toast = useToast(); - - useEffect(() => { - debounce(emailValidation()); - }, [email]); - - useEffect(() => { - debounce(passwordValidation()); - }, [password]); - - const emailValidation = () => { - const emailRegex = /^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i; - if (!email || emailRegex.test(email) === false) { - setIsValidEmail(false); - return false; - } - setIsValidEmail(true); - return true; - }; - - const passwordValidation = () => { - const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/i; - if (!password || passwordRegex.test(password) === false) { - setIsValidPassword(false); - return false; - } - setIsValidPassword(true); - return true; - }; - - // Utility FN · Mover a carpeta utils/utils.js - const debounce = fn => { - let id = null; - - return (...args) => { - if (id) { - clearTimeout(id); - } - id = setTimeout(() => { - fn(...args); - id = null; - }, 300); - }; - }; - - const registerUser = () => { - if (isValidEmail && isValidPassword) { - auth() - .createUserWithEmailAndPassword(email, password) - .then(() => { - console.log('User account created & signed in!'); - }) - .catch(error => { - if (error.code === 'auth/email-already-in-use') { - console.log('That email address is already in use!'); - toast.show({ - type: 'info', - text1: 'Este email ya existe.', - text2: 'Por favor prueba un diferente.' - }); - toast.show('Este email ya existe', { - type: 'info', - data: { - subtitle: 'Por favor prueba uno diferente.', - }, - }); - console.log('hello') - return error - } - - if (error.code === 'auth/invalid-email') { - console.log('That email address is invalid!'); - return error - } - - console.error(error); - }); - } - }; - - return ( - - { - Keyboard.dismiss(); - }} - > - - - - - - Registrate - - { - setEmail(textInput); - }} - autoCorrect={false} - autoCapitalize={'none'} - keyboardType={'email-address'} - /> - - Email incorrecto. - - - { - setIsPasswordVisible(!isPasswordVisible); - }} - style={tw`absolute top-3 right-3 z-10`} - > - {!isPasswordVisible ? ( - - ) : ( - - )} - - { - setPassword(passwordInput); - }} - secureTextEntry={!isPasswordVisible} - /> - - - Debe contener A-b-0-! - - { - registerUser(); - }} - style={tw`mb-12`} - > - Registrate - - - ¿Ya tienes una cuenta? - navigation.navigate('SignIn')}> - Ingresa - - - - - - - ); -}; - -export default SignUp; +import {useEffect, useState} from 'react'; +import { + Keyboard, + KeyboardAvoidingView, + Platform, + Pressable, + SafeAreaView, + Text, + TextInput, + TouchableWithoutFeedback, + View, +} from 'react-native'; + +import auth from '@react-native-firebase/auth'; +import tw from 'twrnc'; +import {useToast} from 'react-native-toast-notifications'; + +import Logo from '../static/images/netflix-logo.svg'; +import {EyeIcon} from 'react-native-heroicons/outline'; +import {EyeSlashIcon} from 'react-native-heroicons/outline'; + +const SignUp = ({navigation}) => { + const [email, setEmail] = useState(''); + const [password, setPassword] = useState(''); + const [isValidEmail, setIsValidEmail] = useState(false); + const [isValidPassword, setIsValidPassword] = useState(false); + const [isPasswordVisible, setIsPasswordVisible] = useState(false); + + const toast = useToast(); + + useEffect(() => { + debounce(emailValidation()); + }, [email]); + + useEffect(() => { + debounce(passwordValidation()); + }, [password]); + + const emailValidation = () => { + const emailRegex = /^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i; + if (!email || emailRegex.test(email) === false) { + setIsValidEmail(false); + return false; + } + setIsValidEmail(true); + return true; + }; + + const passwordValidation = () => { + const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/i; + if (!password || passwordRegex.test(password) === false) { + setIsValidPassword(false); + return false; + } + setIsValidPassword(true); + return true; + }; + + // Utility FN · Mover a carpeta utils/utils.js + const debounce = fn => { + let id = null; + + return (...args) => { + if (id) { + clearTimeout(id); + } + id = setTimeout(() => { + fn(...args); + id = null; + }, 300); + }; + }; + + const registerUser = () => { + if (isValidEmail && isValidPassword) { + auth() + .createUserWithEmailAndPassword(email, password) + .then(() => { + console.log('User account created & signed in!'); + }) + .catch(error => { + if (error.code === 'auth/email-already-in-use') { + console.log('That email address is already in use!'); + toast.show({ + type: 'info', + text1: 'Este email ya existe.', + text2: 'Por favor prueba un diferente.' + }); + toast.show('Este email ya existe', { + type: 'info', + data: { + subtitle: 'Por favor prueba uno diferente.', + }, + }); + console.log('hello') + return error + } + + if (error.code === 'auth/invalid-email') { + console.log('That email address is invalid!'); + return error + } + + console.error(error); + }); + } + }; + + return ( + + { + Keyboard.dismiss(); + }} + > + + + + + + Registrate + + { + setEmail(textInput); + }} + autoCorrect={false} + autoCapitalize={'none'} + keyboardType={'email-address'} + /> + + Email incorrecto. + + + { + setIsPasswordVisible(!isPasswordVisible); + }} + style={tw`absolute top-3 right-3 z-10`} + > + {!isPasswordVisible ? ( + + ) : ( + + )} + + { + setPassword(passwordInput); + }} + secureTextEntry={!isPasswordVisible} + /> + + + Debe contener A-b-0-! + + { + registerUser(); + }} + style={tw`mb-12`} + > + Registrate + + + ¿Ya tienes una cuenta? + navigation.navigate('SignIn')}> + Ingresa + + + + + + + ); +}; + +export default SignUp; -- cgit v1.2.3-54-g00ecf