import React from 'react';
import PropTypes from 'prop-types';
import IDUtil from '../../../util/IDUtil'; // for generating unique CSS classnames for this component
import Info from '../../shared/Info';

const MetadataRow = ({ title, data, description }) => (
    <div className={IDUtil.cssClassName('metadata-row')}>
        <div className="title">
            {title}
            {description && <Info id={'info_' + title} text={description} />}
        </div>
        <p>{data}</p>
    </div>
);

MetadataRow.propTypes = {
    title: PropTypes.string.isRequired,
    data: PropTypes.object.isRequired,
    description: PropTypes.string
};

export default MetadataRow;