import React from 'react'
import PropTypes from 'prop-types'
import Modal from 'react-uikit/modal'

import styles from './styles.scss'
import BEMModule from 'utils/bem'

const bem = new BEMModule(styles)

const Info = ({modal: {title, info, type}, isShowing, onDismiss}) => {
    const modalClassNames = bem.classNames('c-info-modal')
    return (
        <Modal
            showDismissButton
            isShowing={isShowing}
            type={type}
            size="small"
            onDismiss={onDismiss}
        >
            <Modal.HeaderBar title={title} />
            <div className={modalClassNames}>{info}</div>
        </Modal>
    )
}

Info.propTypes = {
    isShowing: PropTypes.bool,
    modal: PropTypes.shape({
        info: PropTypes.oneOfType([
            PropTypes.arrayOf(PropTypes.node),
            PropTypes.node,
        ]),
        title: PropTypes.string,
        type: PropTypes.string,
    }),
    onDismiss: PropTypes.func,
}

Info.defaultProps = {
    modal: PropTypes.shape({
        title: '',
    }),
}

export default Info