feat: add loading on sign up screen

This commit is contained in:
Vinicius Souza 2024-10-31 09:07:28 -03:00
parent 0f5c25f546
commit 9034c62a94

View file

@ -1,3 +1,4 @@
import { useState } from 'react';
import { Center, Heading, Image, ScrollView, Text, useToast, VStack } from '@gluestack-ui/themed'; import { Center, Heading, Image, ScrollView, Text, useToast, VStack } from '@gluestack-ui/themed';
import { useNavigation } from '@react-navigation/native'; import { useNavigation } from '@react-navigation/native';
import { Controller, useForm } from 'react-hook-form'; import { Controller, useForm } from 'react-hook-form';
@ -19,6 +20,8 @@ type FormData = {
}; };
export function SignIn() { export function SignIn() {
const [isLoading, setLoading] = useState(false);
const { signIn } = useAuth(); const { signIn } = useAuth();
const toast = useToast(); const toast = useToast();
const navigation = useNavigation<AuthNavigatorRoutesProps>(); const navigation = useNavigation<AuthNavigatorRoutesProps>();
@ -34,6 +37,7 @@ export function SignIn() {
async function handleSignIn({ email, password }: FormData) { async function handleSignIn({ email, password }: FormData) {
try { try {
setLoading(true);
await signIn(email, password); await signIn(email, password);
console.log('User signed in successfully.'); console.log('User signed in successfully.');
} catch (error) { } catch (error) {
@ -41,6 +45,8 @@ export function SignIn() {
const title = isAppError const title = isAppError
? error.message ? error.message
: 'Não foi possível entrar. Tente novamente mais tarde.'; : 'Não foi possível entrar. Tente novamente mais tarde.';
setLoading(false);
toast.show({ toast.show({
placement: 'top', placement: 'top',
render: ({ id }) => ( render: ({ id }) => (
@ -110,7 +116,7 @@ export function SignIn() {
)} )}
/> />
<Button title="Acessar" onPress={handleSubmit(handleSignIn)} /> <Button title="Acessar" onPress={handleSubmit(handleSignIn)} isLoading={isLoading} />
</Center> </Center>
<Center flex={1} justifyContent="flex-end" mt="$4"> <Center flex={1} justifyContent="flex-end" mt="$4">