import React from 'react';
import PropTypes from 'prop-types';

import Icon from './Icon';

import './Modal.css';

function Modal(props) {
    return props.show ? (
        <div id="dialogt">
            <div id="dialogw">
                <div id="dialog_header">
                    <div id="dialogc" onClick={props.onClose}>
                        <Icon name="ei-close" size="s" />
                    </div>
                </div>
                {props.children}
            </div>
        </div>
    ) : (null);
}

export default React.memo(Modal);

Modal.propTypes = {
    onClose: PropTypes.func.isRequired,
    show: PropTypes.bool,
    children: PropTypes.node
};