feat: create button component

src/components/Button.tsx

@@ -0,0 +1,34 @@
+import { ButtonSpinner, Button as GSButton, Text } from "@gluestack-ui/themed";
+import { ComponentProps } from "react";
+
+type Props = ComponentProps<typeof GSButton> & {
+  title: string,
+  isLoading?: boolean,
+}
+
+export function Button({ title, isLoading = false, ...others }: Props) {
+  return (
+    <GSButton
+      w="$full"
+      h="$14"
+      bg="$green700"
+      rounded="$sm"
+      borderColor="$green500"
+      $active-bg="$green500"
+      disabled={isLoading}
+      {...others}
+    >
+      { isLoading ? (
+        <ButtonSpinner color="$white" />
+      ) : (
+        <Text
+          color="$white"
+          fontFamily="$heading"
+          fontSize="$sm"
+        >
+          {title}
+        </Text>
+      )}
+    </GSButton>
+  )
+}

src/screens/SignIn.tsx

@@ -3,6 +3,7 @@ import { Center, Heading, Image, Text, VStack } from "@gluestack-ui/themed";
 import BackgroundImg from '@assets/background.png';
 import Logo from '@assets/logo.svg';
 import { Input } from "@components/Input";
+import { Button } from "@components/Button";
 
 export function SignIn() {
   return (
@@ -41,6 +42,10 @@ export function SignIn() {
             autoCapitalize="none"
             secureTextEntry
           />
+
+          <Button
+            title="Acessar"
+          />
         </Center>
       </VStack>
     </VStack>