/* eslint-disable react/forbid-prop-types */
import PropTypes from 'prop-types';
import CommaAnd from "../../../../typography/CommaAnd/index.js";
import Name from './Name';
import classes from './styles.module.scss';

/**
 * Render a standard POLITICO byline.
 */
const Byline = function Byline(props) {
  const {
    authors,
    tracking
  } = props;
  return <div className={classes.container}>
      By
      {' '}
      <CommaAnd items={authors.map(name => <Name name={name} tracking={tracking} />)} />
    </div>;
};
Byline.defaultProps = {
  tracking: {
    context: undefined
  }
};
Byline.propTypes = {
  authors: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.shape({
    url: PropTypes.string,
    name: PropTypes.string
  }), PropTypes.any])).isRequired,
  tracking: PropTypes.shape({
    context: PropTypes.string
  })
};
export default Byline;