We are on Build a screen

components/buttons/Button.tsx

@@ -0,0 +1,85 @@
+import { StyleSheet, Pressable } from "react-native";
+import { ThemedText } from "@/components/ThemedText";
+import { ThemedView } from "@/components/ThemedView";
+import { Colors } from '@/constants/Colors';
+import { useColorScheme } from '@/hooks/useColorScheme';
+import FontAwesome from "@expo/vector-icons/FontAwesome";
+
+type Props = {
+  label: string;
+  theme?: 'primary';
+  onPress?: () => void;
+};
+
+const Button = ({ label, theme, onPress }: Props) => {
+  const scheme = useColorScheme() ?? 'light';
+  if (theme === 'primary') {
+    return (
+      <ThemedView style={styles.buttonContainer}>
+        <Pressable
+          style={[
+            styles.button,
+            {backgroundColor: Colors[scheme].text}
+          ]}
+          onPress={() => alert('You pressed a button.')}
+        >
+          <ThemedText
+            style={[
+              styles.buttonLabel,
+              {color: Colors[scheme].background}
+            ]}
+          >
+            {label}
+          </ThemedText>
+        </Pressable>
+      </ThemedView>
+    );
+  } else {
+    return (
+      <ThemedView style={styles.buttonContainer}>
+        <Pressable
+          style={[
+            styles.button,
+            {backgroundColor: Colors[scheme].text}
+          ]}
+          onPress={() => alert('You pressed a button.')}
+        >
+          <ThemedText
+            style={[
+              styles.buttonLabel,
+              {color: Colors[scheme].background}
+            ]}
+          >
+            {label}
+          </ThemedText>
+        </Pressable>
+      </ThemedView>
+    );
+  }
+};
+export default Button;
+
+const styles = StyleSheet.create({
+  buttonContainer: {
+    width: 320,
+    height: 68,
+    marginHorizontal: 20,
+    alignItems: 'center',
+    justifyContent: 'center',
+    padding: 3,
+  },
+  button: {
+    borderRadius: 10,
+    width: '100%',
+    height: '100%',
+    alignItems: 'center',
+    justifyContent: 'center',
+    flexDirection: 'row',
+  },
+  buttonIcon: {
+    paddingRight: 8,
+  },
+  buttonLabel: {
+    fontSize: 16,
+  },
+});