import React from 'react'
import PropTypes from 'prop-types'
import Icon from 'react-uikit/icon'
import Button from 'react-uikit/button'
import BEMModule from 'utils/bem'
import styles from './styles.scss'

const bem = new BEMModule(styles)

const SettingsToggle = ({title, onClick}) => {
    const classes = bem.classNames('c-header__settings-button')
    const iconClasses = bem.classNames('c-header__settings-button__icon')

    return (
        <Button className={classes} onClick={onClick} title={title}>
            <Icon className={iconClasses} name="tab-settings" />
        </Button>
    )
}

SettingsToggle.propTypes = {
    title: PropTypes.string,
    onClick: PropTypes.func,
}

export default SettingsToggle