import React from 'react'
import PropTypes from 'prop-types'
import BEMModule from 'utils/bem'
import styles from './styles.scss'

import Button from 'react-uikit/button'

const bem = new BEMModule(styles)

const PortfolioHoldingsTableHeader = ({isPublic, exportData}) => {
    const headingClasses = bem.classNames(
        'c-portfolio-holdings-table-header__heading'
    )
    const exportClassNames = bem.classNames(
        'c-portfolio-holdings-table-header__export-button'
    )
    return (
        <div className={headingClasses}>
            <h3>Holdings Table</h3>

            {!isPublic && (
                <Button
                    className={exportClassNames}
                    constrained
                    isOutline
                    variant="primary"
                    title="Export Data"
                    onClick={exportData}
                >
                    Export Data
                </Button>
            )}
        </div>
    )
}

PortfolioHoldingsTableHeader.propTypes = {
    exportData: PropTypes.func,
    isPublic: PropTypes.bool,
}

export default PortfolioHoldingsTableHeader