import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import 'reset-css/reset.css';
import { IDENTS_PODCASTS, IDENT_NAMES } from '../assets/idents-podcasts';

const validIdents = IDENT_NAMES;

const IdentPodcasts = ({ className, height, ident, width }) => {
  const Svg = IDENTS_PODCASTS[ident];
  return (
    <span
      className={classnames(
        'ds-ident-podcasts',
        `ds-ident-podcasts--${ident}`,
        className,
      )}
    >
      <Svg width={width} height={height} className='ds-ident-podcasts__svg' />
    </span>
  );
};

IdentPodcasts.propTypes = {
  className: PropTypes.string,
  height: PropTypes.number,
  width: PropTypes.number,
  ident: PropTypes.oneOf(validIdents).isRequired,
};

IdentPodcasts.defaultProps = {
  className: '',
  height: 112,
  width: 112,
};

export default IdentPodcasts;
