import _map from "lodash/fp/map";
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import Provider from '../../atom/provider';
import CardWithButton from '../../molecule/card-with-button';
import Avatar from '../../atom/avatar';
import style from './style.css';
const Battles = (props, context) => {
  const {
    translate
  } = context;
  const {
    battles,
    trads
  } = props;
  return /*#__PURE__*/React.createElement("ul", {
    className: style.cards
  }, _map(battle => {
    const challengeLabel = translate('is challenging you', {
      username: `<strong>${battle.username}</strong>`,
      courseName: `<p><strong>${battle.courseName}</strong></p>`
    });
    const battleCardProps = {
      primaryButtonLabel: trads.battleCTA,
      lightButtonLabel: trads.reviewCTA,
      tagLabel: battle.tagLabel,
      onLightButtonClick: battle.onLightButtonClick,
      onPrimaryButtonClick: battle.onPrimaryButtonClick,
      backgroundImg: battle.backgroundImg
    };
    return /*#__PURE__*/React.createElement("li", {
      key: battle.id,
      className: style.cardsItem
    }, /*#__PURE__*/React.createElement("div", {
      className: style.card
    }, /*#__PURE__*/React.createElement(CardWithButton, battleCardProps, /*#__PURE__*/React.createElement("div", {
      className: style.injection
    }, /*#__PURE__*/React.createElement(Avatar, {
      url: battle.urlAvatar
    })), /*#__PURE__*/React.createElement("div", {
      className: classnames(style.wrapper, style.innerHTML)
      // eslint-disable-next-line react/no-danger
      ,
      dangerouslySetInnerHTML: {
        __html: challengeLabel
      }
    }))));
  }, battles));
};
Battles.contextTypes = {
  translate: Provider.childContextTypes.translate
};
Battles.propTypes = process.env.NODE_ENV !== "production" ? {
  battles: PropTypes.arrayOf(PropTypes.shape({
    username: PropTypes.string,
    courseName: PropTypes.string,
    tagLabel: CardWithButton.propTypes.tagLabel,
    onLightButtonClick: CardWithButton.propTypes.onLightButtonClick,
    onPrimaryButtonClick: CardWithButton.propTypes.onPrimaryButtonClick,
    backgroundImg: CardWithButton.propTypes.backgroundImg
  })).isRequired,
  trads: PropTypes.shape({
    battleCTA: PropTypes.string.isRequired,
    reviewCTA: PropTypes.string.isRequired
  }).isRequired
} : {};
export default Battles;
//# sourceMappingURL=index.js.map