feat: add navigation to screens

src/screens/SignIn.tsx

@@ -1,11 +1,20 @@
 import { Center, Heading, Image, ScrollView, Text, VStack } from "@gluestack-ui/themed";
+import { useNavigation } from "@react-navigation/native";
 
 import BackgroundImg from '@assets/background.png';
 import Logo from '@assets/logo.svg';
+
 import { Input } from "@components/Input";
 import { Button } from "@components/Button";
+import { AuthNavigatorRoutesProps } from "@routes/auth.routes";
 
 export function SignIn() {
+  const navigation = useNavigation<AuthNavigatorRoutesProps>();
+
+  function handleNewAccount() {
+    navigation.navigate('SignUp');
+  }
+
   return (
     <ScrollView
       contentContainerStyle={{ flexGrow: 1 }}
@@ -66,7 +75,7 @@ export function SignIn() {
             Ainda não tem acesso?
           </Text>
 
-          <Button title="Criar Conta" variant="outline" />
+          <Button title="Criar Conta" variant="outline" onPress={handleNewAccount} />
         </Center>
       </VStack>
     </VStack>

src/screens/SignUp.tsx

@@ -1,11 +1,19 @@
 import { Center, Heading, Image, ScrollView, Text, VStack } from "@gluestack-ui/themed";
+import { useNavigation } from "@react-navigation/native";
 
 import BackgroundImg from '@assets/background.png';
 import Logo from '@assets/logo.svg';
 import { Input } from "@components/Input";
 import { Button } from "@components/Button";
+import { AuthNavigatorRoutesProps } from "@routes/auth.routes";
 
 export function SignUp() {
+  const navigation = useNavigation<AuthNavigatorRoutesProps>();
+
+  const handleLogin = () => {
+    navigation.navigate('SignIn');
+  }
+
   return (
     <ScrollView
       contentContainerStyle={{ flexGrow: 1 }}
@@ -57,7 +65,7 @@ export function SignUp() {
           />
         </Center>
 
-        <Button title="Voltar para o login" mt="$12" variant="outline" />
+        <Button title="Voltar para o login" mt="$12" variant="outline" onPress={handleLogin} />
       </VStack>
     </VStack>
     </ScrollView>