import { useContext } from "react";
import { Text, TouchableHighlight, View } from "react-native";
import { AppContext, AppStyles } from "../../utils";

export default function MyButton({ title, style, disabled, onPress }) {
  const appContext = useContext(AppContext);

  return (
    <TouchableHighlight
      disabled={disabled}
      onPress={onPress}
      style={[{ borderRadius: 6 }, style]}
    >
      <View
        style={[
          {
            backgroundColor: appContext.appTheme.colors.primary,
            borderRadius: 6,
            padding: 10,
          },
          AppStyles.Shadow,
          disabled && { opacity: 0.6 },
        ]}
      >
        <Text style={{ textAlign: "center", color: "#fff" }}>{title}</Text>
      </View>
    </TouchableHighlight>
  );
}
