Fusionando y Resolviendo Conflictos

App.js

@@ -1,13 +1,11 @@
-import React from 'react';
-import { MenuProvider } from 'react-native-popup-menu';
-import AppNavigator from './src/navigation/AppNavigator';
-import { View, Text, FlatList, StyleSheet } from 'react-native';
-import useStore from './src/store';
+import React from "react";
+import { MenuProvider } from "react-native-popup-menu";
+import AppNavigator from "./src/navigation/AppNavigator";
 
 const App = () => {
   return (
     <MenuProvider>
-      <AppNavigator />
+      <AppNavigator/>
     </MenuProvider>
   );
 };

src/components/ClientItem.js

@@ -3,8 +3,8 @@ import { View, Text, TouchableOpacity, StyleSheet, Dimensions } from "react-nati
 import { MaterialCommunityIcons } from "@expo/vector-icons";
 import { FontAwesome5 } from "@expo/vector-icons";
 import { theme } from '../../constants';
-import StyledText from "../StyledText";
-import BorderBox from "../pieces/BorderBox";
+import StyledText from "../utils/StyledText";
+import BorderBox from "../utils/BorderBox";
 
 const windowWidth = Dimensions.get('window').width;
 

src/screens/ClientPaymentScreen.js

@@ -10,7 +10,7 @@ import DropdownSelector from "../components/DropdownSelector";
 import Cascading from "../animation/CascadingFadeInView";
 import { useFocusEffect } from "@react-navigation/native";
 import ClientItem from "../components/ClientItem";
-import StyledText from "../StyledText";
+import StyledText from "../utils/StyledText";
 const windowWidth = Dimensions.get('window').width;
 const ClientPaymentScreen = ({ route }) => {
   const navigation = useNavigation();

src/utils/SimpleButton.js

@@ -0,0 +1,57 @@
+import React, { useState } from 'react';
+import { TouchableWithoutFeedback, Animated, StyleSheet } from 'react-native';
+import StyledText from './StyledText';
+import { theme } from '../../constants';
+
+const SimpleButton = ({ text, onPress, width }) => {
+  const [scale, setScale] = useState(new Animated.Value(1));
+
+  const animatePressIn = () => {
+    Animated.timing(scale, {
+      toValue: 0.85,
+      duration: 100,
+      useNativeDriver: true,
+    }).start();
+  };
+
+  const animatePressOut = () => {
+    Animated.timing(scale, {
+      toValue: 1,
+      duration: 100, 
+      useNativeDriver: true,
+    }).start();
+  };
+
+  const handlePress = () => {
+    animatePressIn();
+    setTimeout(() => {
+      animatePressOut();
+    }, 200);
+    onPress();
+  };
+
+  return (
+    <TouchableWithoutFeedback
+      onPressIn={animatePressIn}
+      onPressOut={animatePressOut}
+      onPress={handlePress}
+    >
+      <Animated.View style={[styles.container, { transform: [{ scale }] }, width ? { width: width } : {}]}>
+        <StyledText buttonText>{text}</StyledText>
+      </Animated.View>
+    </TouchableWithoutFeedback>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: theme.colors.tertiary,
+    borderRadius: 20,
+    paddingVertical: 12,
+    paddingHorizontal: 25,
+  },
+});
+
+export default SimpleButton;

src/StyledText.js → src/utils/StyledText.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Text, StyleSheet } from 'react-native';
-import { theme } from "../constants";
+import { theme } from "../../constants";
 
 const styles = StyleSheet.create({
   base: {
@@ -22,6 +22,9 @@ const styles = StyleSheet.create({
     color: theme.colors.secondaryText,
   },
   buttonText:{
+    color: theme.colors.primary,
+    fontSize: 16,
+    fontWeight: "bold",
   }
 });