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

import '../base';
import styles from './MediaObject.styl';

export default function MediaObject({ children, figure, reverse, noMargin, center, style }) {

  const classes = classNames({
    [styles.media]: true,
    [styles.mediaReverse]: reverse,
    [styles.mediaCenter]: center,
    [styles.mediaNoMargin]: noMargin
  });

  return (
    <div className={classes} style={style}>
      {
        figure ? <div className="media-figure">{figure}</div> : null
      }
      <div className="media-body">{children}</div>
    </div>
  );
}

MediaObject.propTypes = {
  children: PropTypes.node,
  figure: PropTypes.element,
  reverse: PropTypes.bool,
  center: PropTypes.bool,
  noMargin: PropTypes.bool,
  // eslint-disable-next-line react/forbid-prop-types
  style: PropTypes.object
};

MediaObject.defaultProps = {
  children: undefined,
  figure: undefined,
  reverse: undefined,
  center: undefined,
  noMargin: undefined,
  style: undefined
};