'use strict';

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

require('./_commonjsHelpers-06173234.js');
require('./_to-object-329a650b.js');
require('./es6.string.iterator-cc0bbaa4.js');
require('./_library-dd23b178.js');
require('./_iter-detect-60b2f026.js');
require('./toConsumableArray-9a3476fe.js');
require('./core.get-iterator-method-f62321d4.js');
require('./_object-pie-68c5bcbc.js');
var _extends = require('./extends-60837c34.js');
require('./_object-sap-5e74ba08.js');
require('./inherits-513d81cd.js');
require('./define-property-f4d12f4e.js');
require('./web.dom.iterable-a0e279c1.js');
require('./typeof-725500bc.js');
require('./_is-array-754e012d.js');
var React = require('react');
var React__default = _interopDefault(React);
require('./index-fa8ed292.js');
require('prop-types');
require('react-bootstrap/Row');
require('react-bootstrap/Col');
require('./moment-575fe24c.js');
var Router = require('next/router');
var Router__default = _interopDefault(Router);
require('./isSymbol-04666465.js');
require('./debounce-eb287781.js');
require('react-dom');
require('./index-be0c82be.js');
require('./index-da796b8c.js');
require('./main-a4cb15bb.js');
require('./entities-310b46ee.js');
require('./stringify-7c5aff47.js');
var slicedToArray = require('./slicedToArray-8f385299.js');
require('./asyncToGenerator-533d476a.js');
require('./_set-species-f92c67c5.js');
require('./Segment.js');
require('./Beam.js');
require('./AdSlot.js');
var BlockContent = require('./BlockContent-091a991f.js');
require('./smoothscroll-95231a70.js');
require('./GroupDeck.js');
require('react-bootstrap');
require('./iconBase-68959171.js');
require('./index.esm-90433435.js');
var Button = _interopDefault(require('react-bootstrap/Button'));
var index$3 = require('./index-3294d3bc.js');
var getSerializers = require('./index-a5919bab.js');
require('./util-f2c1b65b.js');
require('./brightcove-react-player-loader.es-156bd4d6.js');
require('react-bootstrap/Pagination');
require('next/head');

var ExternalResources = function ExternalResources(props) {
  var resources = props.resources,
      display = props.display,
      client = props.client,
      _props$cta = props.cta,
      cta = _props$cta === undefined ? 'Learn More' : _props$cta,
      _props$url = props.url,
      url = _props$url === undefined ? 'resources' : _props$url;

  var _useState = React.useState(display && (display === 'recent' || display === 'archived') ? display : 'recent'),
      _useState2 = slicedToArray._slicedToArray(_useState, 2),
      active = _useState2[0],
      setActive = _useState2[1];

  var router = Router.useRouter();
  React.useEffect(function () {
    router.push(router.pathname, '/' + url + '?display=' + active, { shallow: true });
  }, [active]);
  return React__default.createElement(
    'div',
    { id: 'resources' },
    React__default.createElement(
      'div',
      { id: 'toggles' },
      React__default.createElement(
        'div',
        { onClick: function onClick() {
            return setActive(function () {
              return 'recent';
            });
          }, className: active === 'recent' ? 'active' : '' },
        'Recent'
      ),
      React__default.createElement(
        'div',
        { onClick: function onClick() {
            return setActive(function () {
              return 'archived';
            });
          }, className: active === 'archived' ? 'active' : '' },
        'Archive'
      )
    ),
    resources[active].length > 0 ? resources[active].map(function (r, i) {
      return React__default.createElement(
        'div',
        { key: i, className: 'resource' },
        React__default.createElement(
          'div',
          { id: 'thumb' },
          React__default.createElement(
            'a',
            { href: r.destination, target: '_blank', rel: 'noopener noreferrer' },
            React__default.createElement('img', { src: r.thumbnail })
          )
        ),
        React__default.createElement(
          'div',
          { id: 'details' },
          React__default.createElement(
            'a',
            { href: r.destination, target: '_blank', rel: 'noopener noreferrer' },
            React__default.createElement(
              'p',
              { id: 'title' },
              r.title
            ),
            r.intro && React__default.createElement(
              'div',
              { id: 'intro' },
              React__default.createElement(BlockContent.BlockContent, _extends._extends({ serializers: getSerializers.getSerializers(client), blocks: r.intro }, client.config()))
            ),
            React__default.createElement(
              'div',
              { id: 'date' },
              React__default.createElement(
                'p',
                { style: { fontWeight: 'bold' } },
                'Date:'
              ),
              React__default.createElement(
                'p',
                null,
                index$3.momentTimezone.tz(r.displayDate, 'America/New_York').format('MMMM Do YYYY, h:mm a z')
              )
            ),
            r.speakers && React__default.createElement(
              'div',
              { id: 'speakers' },
              React__default.createElement(
                'p',
                { style: { fontWeight: 'bold' } },
                'Speakers:'
              ),
              React__default.createElement(BlockContent.BlockContent, _extends._extends({ serializers: getSerializers.getSerializers(client), blocks: r.speakers }, client.config()))
            ),
            r.location && React__default.createElement(
              'div',
              { id: 'location' },
              React__default.createElement(
                'p',
                { style: { fontWeight: 'bold' } },
                'Location:'
              ),
              r.location
            ),
            r.sponsor && React__default.createElement(
              'div',
              { id: 'sponsor' },
              React__default.createElement(
                'p',
                { style: { fontWeight: 'bold' } },
                'Sponsors:'
              ),
              r.sponsor
            )
          ),
          React__default.createElement(
            Button,
            { id: 'cta', variant: 'secondary', href: r.destination, target: '_blank', rel: 'noopener noreferrer' },
            cta
          )
        )
      );
    }) : React__default.createElement(
      'p',
      null,
      'No ' + active + ' resources available. '
    ),
    React__default.createElement(
      'style',
      { jsx: true },
      '\n        .resource {\n          display: flex;\n          position: relative;\n          margin: 0 0 1rem 0;\n        }\n        .resource #thumb {\n          box-sizing: border-box;\n          padding: 0.5rem;\n          width: 25%;\n        }\n        .resource #thumb img {\n          width: 100%;\n        }\n        .resource #details {\n          box-sizing: border-box;\n          padding: 0.5rem;\n          width: 75%;\n        }\n        #resources .resource p {\n          margin: 0;\n        }\n        #toggles {\n          display: flex;\n          margin: 0 0 1rem 0;\n        }\n        #toggles > div {\n          padding: 0.5rem;\n          cursor: pointer;\n        }\n        #toggles > div:hover {\n          font-weight: bold;\n          border-bottom: 2px solid #cecece;\n        }\n        #toggles > div.active {\n          font-weight: bold;\n          border-bottom: 2px solid var(--primary);\n        }\n        .resource #title {\n          font-weight: bold;\n          font-size: 1.25rem;\n        }\n        .resource #date,\n        .resource #speakers,\n        .resource #location,\n        .resource #sponsor,\n        .resource #cta {\n          margin: 1rem 0 0 0;\n        }\n      '
    )
  );
};

module.exports = ExternalResources;
