feat: handle authentication error on sign in screen

src/screens/SignIn.tsx

@@ -1,4 +1,4 @@
-import { Center, Heading, Image, ScrollView, Text, VStack } from '@gluestack-ui/themed';
+import { Center, Heading, Image, ScrollView, Text, useToast, VStack } from '@gluestack-ui/themed';
 import { useNavigation } from '@react-navigation/native';
 import { Controller, useForm } from 'react-hook-form';
 
@@ -6,10 +6,12 @@ import BackgroundImg from '@assets/background.png';
 import Logo from '@assets/logo.svg';
 
 import { useAuth } from '@hooks/useAuth';
-
-import { Input } from '@components/Input';
-import { Button } from '@components/Button';
 import { AuthNavigatorRoutesProps } from '@routes/auth.routes';
+import { AppError } from '@utils/AppError';
+
+import { Button } from '@components/Button';
+import { Input } from '@components/Input';
+import { ToastMessage } from '@components/ToastMessage';
 
 type FormData = {
   email: string;
@@ -18,7 +20,7 @@ type FormData = {
 
 export function SignIn() {
   const { signIn } = useAuth();
-
+  const toast = useToast();
   const navigation = useNavigation<AuthNavigatorRoutesProps>();
   const {
     control,
@@ -31,7 +33,21 @@ export function SignIn() {
   }
 
   async function handleSignIn({ email, password }: FormData) {
-    await signIn(email, password);
+    try {
+      await signIn(email, password);
+      console.log('User signed in successfully.');
+    } catch (error) {
+      const isAppError = error instanceof AppError;
+      const title = isAppError
+        ? error.message
+        : 'Não foi possível entrar. Tente novamente mais tarde.';
+      toast.show({
+        placement: 'top',
+        render: ({ id }) => (
+          <ToastMessage id={id} title={title} action="error" onClose={() => toast.close(id)} />
+        ),
+      });
+    }
   }
 
   return (