import _template from "lodash/fp/template";
import React from 'react';
import PropTypes from 'prop-types';
import Provider from '../../atom/provider';
import style from './style.css';
const ProductCard = (props, context) => {
  const {
    title,
    subtitle,
    price,
    currency,
    checkImage
  } = props;
  const {
    translate
  } = context;
  const descriptionItemTranslationKeys = [translate('product_desc_culture'), translate('product_desc_partnership'), translate('product_desc_battle'), translate('product_desc_coach'), translate('product_desc_forum'), translate('product_desc_certificates')];
  const priceTemplate = translate('subscription_price');
  const priceValue = _template(priceTemplate)({
    price,
    currency
  });
  const items = descriptionItemTranslationKeys.map((itemDescription, index) => {
    return /*#__PURE__*/React.createElement("div", {
      className: style.productDescriptionItem,
      key: index
    }, /*#__PURE__*/React.createElement("img", {
      className: style.productCheckbox,
      src: checkImage
    }), /*#__PURE__*/React.createElement("div", {
      className: style.productDescriptionText
    }, itemDescription));
  });
  return /*#__PURE__*/React.createElement("div", {
    className: style.product
  }, /*#__PURE__*/React.createElement("div", {
    className: style.productHeader
  }, /*#__PURE__*/React.createElement("div", {
    className: style.productHeaderTitle
  }, title), /*#__PURE__*/React.createElement("div", {
    className: style.productHeaderSubtitle
  }, subtitle)), /*#__PURE__*/React.createElement("div", {
    className: style.productBody
  }, /*#__PURE__*/React.createElement("div", {
    className: "product__description"
  }, items), /*#__PURE__*/React.createElement("hr", {
    className: style.productSeparation
  }), /*#__PURE__*/React.createElement("div", {
    className: style.productPrice
  }, /*#__PURE__*/React.createElement("div", {
    className: style.priceValue
  }, priceValue), /*#__PURE__*/React.createElement("div", {
    className: style.cancelText
  }, translate('product_cancel')))));
};
ProductCard.contextTypes = {
  translate: Provider.childContextTypes.translate
};
ProductCard.propTypes = process.env.NODE_ENV !== "production" ? {
  title: PropTypes.string.isRequired,
  subtitle: PropTypes.string.isRequired,
  currency: PropTypes.string.isRequired,
  price: PropTypes.string.isRequired,
  checkImage: PropTypes.string.isRequired
} : {};
export default ProductCard;
//# sourceMappingURL=index.js.map