import Styles from "@/constants/Styles";
import { useTheme } from "@/providers/ThemeProvider";
import React from "react";
import { TouchableWithoutFeedback, View } from "react-native";
import Text from "./Text";

type Props = {
   onPress?: () => void;
   icon: React.ReactNode;
   text: string;
};

export function ButtonFiturMenu({ onPress, icon, text }: Props) {
   const { colors } = useTheme();
   return (
      <TouchableWithoutFeedback onPress={onPress}>
         <View style={{ alignItems: 'center', width: '25%' }}>
            <View style={[Styles.btnFiturMenu, { backgroundColor: colors.card, borderColor: colors.icon + '20', shadowColor: colors.text }]}>
               {icon}
            </View>
            <Text style={[Styles.mt05, { color: colors.text, textAlign: 'center', fontSize: 12 }]}>{text}</Text>
         </View>
      </TouchableWithoutFeedback>
   )
}