import {FC} from "react";
import {StyleSheet, TouchableOpacity, Text, View, StyleProp, ViewStyle, GestureResponderEvent} from "react-native";
import {responsiveHeight, responsiveWidth} from "react-native-responsive-dimensions";
import {RFPercentage} from "react-native-responsive-fontsize";
import DText from "../DText/DText";
import DTitle from "../DTitle/DTitle";

type Props = {
    label: string;
    style?: StyleProp<ViewStyle>;
    containerStyle?: StyleProp<ViewStyle>;
    isUnset?: boolean;
    onPress?: (event: GestureResponderEvent) => void
    disabled?: boolean
};

const BasicButton: FC<Props> = ({label, onPress, containerStyle, style, isUnset = false, disabled = false}) => {
    return (
        <TouchableOpacity style={containerStyle} disabled={disabled} onPress={onPress}>
            <View style={[styles.container, style, disabled ? {backgroundColor: "#A0A0A0"} : {}, containerStyle]}>
                <View style={styles.textWrapper}>
                    <DText style={styles.text}>{label}</DText>
                </View>
            </View>

        </TouchableOpacity>
    );
};

const styles = StyleSheet.create({
    container: {
        display: "flex",
        alignItems: "center",
        justifyContent: "center",
        alignContent: "center",
        backgroundColor: '#2478F8',
        borderRadius: responsiveWidth(1),
        padding: responsiveWidth(3),
    },
    text: {
        color: "white",
        fontSize: RFPercentage(2),
        textAlignVertical: "center",
        textAlign: "center",
    },
    textWrapper: {}
});

export default BasicButton;