Browse Source

Changing app logo in login and register.

master
GabrielTrettel 4 years ago
parent
commit
cc44ceea8b
  1. 13
      src/App.js
  2. 8
      src/app/auth/storage.js
  3. 13
      src/app/screens/LoginScreen.js
  4. 52
      src/app/screens/RegisterScreen.js

13
src/App.js

@ -1,4 +1,4 @@
import React, { useState, useContext, useEffect } from "react";
import React, { useState } from "react";
import { NavigationContainer } from "@react-navigation/native"; import { NavigationContainer } from "@react-navigation/native";
import navigationTheme from "./app/navigation/navigationTheme"; import navigationTheme from "./app/navigation/navigationTheme";
@ -14,22 +14,19 @@ import CurrentLocationProvider from "./app/context/CurrentLocationContext";
import AuthNavigator from "./app/navigation/AuthNavigator"; import AuthNavigator from "./app/navigation/AuthNavigator";
import { AuthContext } from "./app/auth/context"; import { AuthContext } from "./app/auth/context";
import authStorage from "./app/auth/storage"; import authStorage from "./app/auth/storage";
import jwtDecode from "jwt-decode";
export default function App() { export default function App() {
const [user, setUser] = useState(); const [user, setUser] = useState();
const [isReady, setIsReady] = useState(); const [isReady, setIsReady] = useState();
const restoreToken = async () => {
const token = await authStorage.getToken();
if (!token) return;
return setUser(jwtDecode(token));
const restoreUser = async () => {
const user = await authStorage.getUser();
if (user) setUser(user);
}; };
if (!isReady) if (!isReady)
return ( return (
<AppLoading startAsync={restoreToken} onFinish={() => setIsReady(true)} />
<AppLoading startAsync={restoreUser} onFinish={() => setIsReady(true)} />
); );
global.userDataBase = openDatabase(); global.userDataBase = openDatabase();

8
src/app/auth/storage.js

@ -1,4 +1,5 @@
import * as SecureStore from "expo-secure-store"; import * as SecureStore from "expo-secure-store";
import jwtDecode from "jwt-decode";
const key = "authToke"; const key = "authToke";
@ -26,4 +27,9 @@ const removeToken = async () => {
} }
}; };
export default { setToken, getToken, removeToken };
const getUser = async () => {
const token = await getToken();
return token ? jwtDecode(token) : null;
};
export default { setToken, getUser, removeToken };

13
src/app/screens/LoginScreen.js

@ -59,8 +59,13 @@ export default function LoginScreen(props) {
handleSubmit(name, password, setLoginFailed) handleSubmit(name, password, setLoginFailed)
} }
> >
{/* <Text style={styles.title}>Pega Chuva</Text> */}
<assets.AppLogoTitle style={styles.title} />
<assets.AppLogoTitle
preserveAspectRatio="xMidYMid meet"
width={300}
height={30}
alignSelf="center"
marginBottom={dimensions.spacing.big_padding}
/>
<ErrorMessage error="Email ou senha inválidos" visible={loginFailed} /> <ErrorMessage error="Email ou senha inválidos" visible={loginFailed} />
<FormField <FormField
@ -100,8 +105,4 @@ const styles = StyleSheet.create({
padding: 10, padding: 10,
justifyContent: "center", justifyContent: "center",
}, },
title: {
alignSelf: "center",
marginBottom: dimensions.spacing.big_padding,
},
}); });

52
src/app/screens/RegisterScreen.js

@ -10,9 +10,9 @@ import Screen from "../components/Screen";
import { dimensions } from "../config/dimensions"; import { dimensions } from "../config/dimensions";
import colors from "../config/colors"; import colors from "../config/colors";
import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view"; import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
import assets from "../config/assets";
import * as Yup from "yup"; import * as Yup from "yup";
const phoneRegex = RegExp( const phoneRegex = RegExp(
/^\(?[\(]?([0-9]{2})?\)?[)\b]?([0-9]{4,5})[-. ]?([0-9]{4})$/ /^\(?[\(]?([0-9]{2})?\)?[)\b]?([0-9]{4,5})[-. ]?([0-9]{4})$/
); );
@ -34,20 +34,17 @@ const validationSchema = Yup.object().shape({
.matches(/[a-zA-Z]/, "A senha só pode conter letras"), .matches(/[a-zA-Z]/, "A senha só pode conter letras"),
}); });
export default function RegisterScreen(props) { export default function RegisterScreen(props) {
const [singUpFailed, setSingUpFailed] = useState(false); const [singUpFailed, setSingUpFailed] = useState(false);
const comparePassword = (password, confirmPassword) => { const comparePassword = (password, confirmPassword) => {
if(password !== confirmPassword){
if (password !== confirmPassword) {
setSingUpFailed(true); setSingUpFailed(true);
console.log("Senhas Diferentes")
}
else{
console.log("Senhas Diferentes");
} else {
setSingUpFailed(false); setSingUpFailed(false);
} }
}
};
return ( return (
<Screen style={styles.containter}> <Screen style={styles.containter}>
@ -58,19 +55,26 @@ export default function RegisterScreen(props) {
password: "", password: "",
confirmPassword: "", confirmPassword: "",
}} }}
onSubmit={({name, number, password, confirmPassword}) => {
onSubmit={({ name, number, password, confirmPassword }) => {
comparePassword(password, confirmPassword); comparePassword(password, confirmPassword);
console.log("cadastro ainda não implementado")
console.log("cadastro ainda não implementado");
}} }}
validationSchema={validationSchema} validationSchema={validationSchema}
> >
<View style={{ flex: 1, flexDirection: "column", justifyContent: "center" }}>
<View
style={{ flex: 1, flexDirection: "column", justifyContent: "center" }}
>
<View style={{ flex: 1, justifyContent: "flex-end" }}> <View style={{ flex: 1, justifyContent: "flex-end" }}>
<Text style={styles.title}>Pega Chuva</Text>
<assets.AppLogoTitle
preserveAspectRatio="xMidYMid meet"
width={300}
height={30}
alignSelf="center"
marginBottom={dimensions.spacing.big_padding}
/>
</View> </View>
<View style={{ flex: 6 }}> <View style={{ flex: 6 }}>
<KeyboardAwareScrollView
scrollEnabled={true}>
<KeyboardAwareScrollView scrollEnabled={true}>
<View> <View>
<Text style={styles.labelStyle}> Nome Completo: </Text> <Text style={styles.labelStyle}> Nome Completo: </Text>
<FormField <FormField
@ -106,10 +110,17 @@ export default function RegisterScreen(props) {
numberOfLines={1} numberOfLines={1}
placeholder="Nome Completo" placeholder="Nome Completo"
/> />
</View>
<ErrorMessage error="As senhas não correspondem" visible={singUpFailed} />
</View>
<ErrorMessage
error="As senhas não correspondem"
visible={singUpFailed}
/>
<SubmitButton title="cadastrar" backgroundColor={colors.primary} marginTop={10} />
<SubmitButton
title="cadastrar"
backgroundColor={colors.primary}
marginTop={10}
/>
<TouchableNativeFeedback <TouchableNativeFeedback
onPress={() => { onPress={() => {
@ -125,7 +136,7 @@ export default function RegisterScreen(props) {
</View> </View>
</View> </View>
</Form> </Form>
</Screen >
</Screen>
); );
} }
@ -136,11 +147,6 @@ const styles = StyleSheet.create({
textAlign: "center", textAlign: "center",
padding: 10, padding: 10,
}, },
title: {
fontSize: dimensions.text.header,
marginBottom: dimensions.spacing.big_padding,
textAlign: "center",
},
labelStyle: { labelStyle: {
fontSize: dimensions.text.secondary, fontSize: dimensions.text.secondary,
fontWeight: "bold", fontWeight: "bold",

Loading…
Cancel
Save