import { StyleSheet, Text, View } from 'react-native'
import React, { useContext } from 'react'
import IonIcon from 'react-native-vector-icons/Ionicons'
import colors from '../../../constants/colors'
import ButtonWrapper from './ButtonWrapper'
import { ThemeContext } from '../../../context/theme.context'

const CloseButton = (props) => {

    const theme = useContext(ThemeContext)

    const {
        onPress,
        buttonStyle,
        iconColor,
        iconSize
    } = props

    let finalIconColor;
    switch (iconColor) {
        case "primary":
            finalIconColor = colors().primaryColor
            break;
        case "secondary":
            finalIconColor = colors().secondaryColor
            break
        default:
            finalIconColor = colors().recessive
            break;
    }
    
    const styles = StyleSheet.create({
        icon: {
            fontSize: 20,
            color: colors().primaryColor
        }
    })

    return (
        <ButtonWrapper onPress={onPress} buttonStyle={buttonStyle}>
            <IonIcon name='close' color={finalIconColor} size={iconSize ? iconSize : styles.icon.fontSize} />
        </ButtonWrapper>
    )
}

export default CloseButton

