import { StyleSheet} from 'react-native'
import React, { useContext } from 'react'
import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome'
import ButtonWrapper from './ButtonWrapper'
import colors from '../../../constants/colors'
import { moderateScale } from '../../../constants/metrics'
import { ThemeContext } from '../../../context/theme.context'

const BookmarkButton = ({ buttonStyle,iconSize,iconColor, onPress}) => {
    const theme = useContext(ThemeContext)
    const currentTheme = theme.state.theme

    const styles = StyleSheet.create({
        buttonStyle:{
            alignItems: 'center',
            justifyContent: 'center',
            height:'auto',
            width:'auto'
        },
        icon:{
            color: colors().primaryColor,
            fontSize: moderateScale(20)
        }
    
    })

    return (
        <ButtonWrapper onPress={onPress} buttonStyle={buttonStyle}>
            <FontAwesomeIcon name='bookmark' color={iconColor ? iconColor : currentTheme === 'light' ? colors().grayShade_400 : colors().white} size={iconSize ? iconSize : styles.icon.fontSize}/>
        </ButtonWrapper>
    )
}

export default BookmarkButton

