import { _ as _asyncToGenerator, r as regenerator } from './asyncToGenerator-64822ccc.js';
import { _ as _toConsumableArray } from './toConsumableArray-f7074d7c.js';
import { _ as _JSON$stringify } from './stringify-2b084bee.js';
import { _ as _slicedToArray } from './slicedToArray-6ebcbfea.js';
import { m as moment } from './moment-bc12cb97.js';
import React__default, { useState, useEffect } from 'react';
import { Col, Row } from 'react-bootstrap';
import './_commonjsHelpers-0c4b6f40.js';
import './core.get-iterator-method-ea258bb1.js';
import './web.dom.iterable-ab4dea5c.js';
import './_library-528f1934.js';
import './_set-species-2cd9340f.js';
import './_iter-detect-98db3b07.js';

function PtceDeck(props) {
  var _this = this;

  var initialData = props.initialData;

  var _useState = useState(),
      _useState2 = _slicedToArray(_useState, 2),
      cmeData = _useState2[0],
      setCmeData = _useState2[1];

  var _useState3 = useState(),
      _useState4 = _slicedToArray(_useState3, 2),
      hasMore = _useState4[0],
      setHasMore = _useState4[1];

  var _useState5 = useState(),
      _useState6 = _slicedToArray(_useState5, 2),
      paginatedPoint = _useState6[0],
      setPaginatedPoint = _useState6[1];

  useEffect(function () {
    //set inital data
    if (initialData && initialData.pageInfo) {
      setHasMore(initialData.pageInfo.hasMore);
      setPaginatedPoint(initialData.pageInfo.cursor);
      setCmeData(initialData.contentItems);
    }
    //set hasMore and breakpoint
  }, []);

  var loadMore = function () {
    var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() {
      var response, data;
      return regenerator.wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              _context.next = 2;
              return fetch('/api/get_activities-CE', {
                headers: {
                  'Content-Type': 'application/json',
                  Accept: 'application/json'
                },
                method: 'post',
                credentials: 'same-origin',
                body: _JSON$stringify({ params: { paginatedPoint: paginatedPoint } })
              });

            case 2:
              response = _context.sent;
              _context.next = 5;
              return response.json();

            case 5:
              data = _context.sent;


              if (data.pageInfo) {
                setHasMore(data.pageInfo.hasMore);
                setPaginatedPoint(data.pageInfo.cursor);
                setCmeData(function (prevState) {
                  return [].concat(_toConsumableArray(prevState), _toConsumableArray(data.contentItems));
                });
              }

            case 7:
            case 'end':
              return _context.stop();
          }
        }
      }, _callee, _this);
    }));

    return function loadMore() {
      return _ref.apply(this, arguments);
    };
  }();

  return React__default.createElement(
    'div',
    null,
    cmeData && cmeData.map(function (activity) {
      var href = activity.url ? activity.url : 'https://www.pharmacytimes.org/courses/' + activity.slug;
      return React__default.createElement(
        Col,
        { xl: 12, style: { marginBottom: '1rem' } },
        React__default.createElement(
          Row,
          null,
          React__default.createElement(
            Col,
            { xs: 3, sm: 4, md: 4, lg: 4, xl: 4, style: { padding: '0' } },
            React__default.createElement(
              'a',
              { href: href, rel: 'noopener', target: '_blank' },
              React__default.createElement('img', { style: { width: '100%', borderRadius: '0 0 0 10%', marginBottom: '20px', borderTop: '1px solid #EEE' }, src: activity.asset })
            )
          ),
          React__default.createElement(
            Col,
            { xs: 9, sm: 8, md: 8, lg: 8, xl: 8, style: { paddingTop: '10px', marginBottom: '20px', borderTop: '1px solid #EEE' } },
            React__default.createElement(
              'a',
              { href: href, rel: 'noopener', target: '_blank' },
              React__default.createElement('h4', { className: 'mb-1', style: { fontWeight: '500', fontSize: '22px' }, dangerouslySetInnerHTML: { __html: activity.title } }),
              React__default.createElement(
                'p',
                { className: 'mb-2' },
                'Expiration Date: ',
                moment(activity.courseEndDate).format('MMM Do YYYY')
              ),
              React__default.createElement('p', { dangerouslySetInnerHTML: { __html: activity.description } })
            )
          )
        )
      );
    }),
    hasMore && React__default.createElement(
      'div',
      { className: 'text-center my-5' },
      React__default.createElement(
        'button',
        { onClick: loadMore, className: 'btn btn-lg btn-primary' },
        'Load More'
      )
    )
  );
}

export { PtceDeck as default };
