import _map from "lodash/fp/map";
import _getOr from "lodash/fp/getOr";
import React from 'react';
import PropTypes from 'prop-types';
import Provider from '../../../atom/provider';
import CardsGrid from '../../../organism/cards-grid';
import SocialLink from '../../../atom/social-link';
import Link from '../../../atom/link';
import style from './style.css';
class Authors extends React.Component {
  static contextTypes = {
    translate: Provider.childContextTypes.translate,
    skin: Provider.childContextTypes.skin
  };
  constructor(props, context) {
    super(props);
    this.state = {
      fullDisplay: false
    };
    this.handleToggleDisplay = this.handleToggleDisplay.bind(this);
  }
  handleToggleDisplay() {
    this.setState(prevState => ({
      fullDisplay: !prevState.fullDisplay
    }));
  }
  render() {
    const {
      image,
      title,
      description,
      cards,
      cardsTitle,
      socialTitle,
      sociallinks,
      website,
      urlwebsite,
      urlcontent
    } = this.props;
    const {
      fullDisplay
    } = this.state;
    const {
      translate,
      skin
    } = this.context;
    const defaultColor = _getOr('#00B0FF', 'common.primary', skin);
    const toggleLabel = fullDisplay ? translate('See less') : translate('Show more');
    const socialView = _map.convert({
      cap: false
    })((sociallink, i) => /*#__PURE__*/React.createElement("div", {
      key: i,
      "data-name": "link",
      className: style.link
    }, /*#__PURE__*/React.createElement(SocialLink, sociallink)), sociallinks);
    const authorSocial = socialView.length > 0 ? /*#__PURE__*/React.createElement("div", {
      className: style.links
    }, /*#__PURE__*/React.createElement("span", null, socialTitle), socialView) : null;
    return /*#__PURE__*/React.createElement("div", {
      "data-name": "authors",
      className: style.wrapper
    }, /*#__PURE__*/React.createElement("div", {
      className: style.authorsWrapper
    }, /*#__PURE__*/React.createElement("div", {
      "data-name": "header",
      className: style.header
    }, /*#__PURE__*/React.createElement("div", {
      "data-name": "image",
      className: style.imgWrapper
    }, /*#__PURE__*/React.createElement("img", {
      src: image
    })), /*#__PURE__*/React.createElement("div", {
      className: style.descWrapper
    }, /*#__PURE__*/React.createElement("div", {
      "data-name": "title",
      className: style.title
    }, title), /*#__PURE__*/React.createElement("div", {
      className: style.linksWrapper
    }, /*#__PURE__*/React.createElement("span", null, website), /*#__PURE__*/React.createElement(Link, {
      "data-name": "linkSite",
      className: style.linksite,
      style: {
        color: defaultColor
      },
      href: urlwebsite,
      target: '_blank'
    }, urlcontent), authorSocial), /*#__PURE__*/React.createElement("div", {
      "data-name": "description",
      className: fullDisplay ? style.desc : style.shortDesc
    }, /*#__PURE__*/React.createElement("div", {
      className: style.innerHTML
      // eslint-disable-next-line react/no-danger
      ,
      dangerouslySetInnerHTML: {
        __html: description
      }
    })), /*#__PURE__*/React.createElement("div", {
      "data-name": "more",
      className: style.toggle,
      onClick: this.handleToggleDisplay
    }, toggleLabel))), /*#__PURE__*/React.createElement("div", {
      className: style.cardsTitle
    }, cardsTitle), /*#__PURE__*/React.createElement(CardsGrid, cards)));
  }
}
Authors.propTypes = process.env.NODE_ENV !== "production" ? {
  cards: PropTypes.shape(CardsGrid.propTypes),
  cardsTitle: PropTypes.string,
  image: PropTypes.string,
  title: PropTypes.string,
  website: PropTypes.string,
  urlcontent: PropTypes.string,
  urlwebsite: PropTypes.string,
  description: PropTypes.string,
  socialTitle: PropTypes.string,
  sociallinks: PropTypes.arrayOf(PropTypes.shape({
    type: PropTypes.string,
    link: PropTypes.string
  }))
} : {};
export default Authors;
//# sourceMappingURL=index.js.map