@mjhls/mjh-framework 1.0.233 → 1.0.235

package/dist/cjs/index.js

@@ -12,8 +12,8 @@ var PropTypes = _interopDefault(require('prop-types'));
 var Container = _interopDefault(require('react-bootstrap/Container'));
 var Row = _interopDefault(require('react-bootstrap/Row'));
 var Col = _interopDefault(require('react-bootstrap/Col'));
-var Card = _interopDefault(require('react-bootstrap/Card'));
-var visibilitySensor = require('./visibility-sensor-bea3105d.js');
+require('react-bootstrap/Card');
+var visibilitySensor = require('./visibility-sensor-8936e703.js');
 var Link = _interopDefault(require('next/link'));
 var Router = require('next/router');
 var Router__default = _interopDefault(Router);
@@ -27,7 +27,7 @@ var _babelHelpers = require('./_babelHelpers-f321c258.js');
 var AdSlot = require('./AdSlot-d87cef08.js');
 var DeckContent = require('./DeckContent.js');
 require('./get-126b1712.js');
-var GridContent = require('./GridContent-757aef92.js');
+var GridContent = require('./GridContent-6dae5d6a.js');
 var DeckQueue = require('./DeckQueue.js');
 require('react-bootstrap/Media');
 var ThumbnailCard = require('./ThumbnailCard.js');
@@ -44,6 +44,7 @@ var PublicationDeck = require('./PublicationDeck.js');
 var IssueDeck = require('./IssueDeck.js');
 require('react-bootstrap/Badge');
 var IssueContentDeck = require('./IssueContentDeck.js');
+var Spinner = _interopDefault(require('react-bootstrap/Spinner'));
 var TemplateNormal = require('./Normal-821546cd.js');
 require('react-bootstrap/ListGroup');
 var Head = _interopDefault(require('next/head'));
@@ -62,376 +63,431 @@ var DropdownButton = _interopDefault(require('react-bootstrap/DropdownButton'));
 var Dropdown = _interopDefault(require('react-bootstrap/Dropdown'));
 var Ustream = require('./Ustream-0d3dd953.js');
 
-var EventsDeck = function (_React$Component) {
-  _babelHelpers.inherits(EventsDeck, _React$Component);
-
-  function EventsDeck() {
-    var _ref;
+var clientId = process.env.CVENT_CLIENT_ID;
+var clientSecret = process.env.CVENT_CLIENT_SECRET;
+var corsProxy = 'https://cors-anywhere.herokuapp.com/';
+var currentTime = visibilitySensor.moment().toISOString();
+
+var EventsDeck = function EventsDeck(_ref) {
+  var _ref$autoScroll = _ref.autoScroll,
+      autoScroll = _ref$autoScroll === undefined ? true : _ref$autoScroll,
+      rightItems = _ref.rightItems,
+      _ref$seoPaginate = _ref.seoPaginate,
+      seoPaginate = _ref$seoPaginate === undefined ? true : _ref$seoPaginate,
+      pageview = _ref.pageview,
+      _ref$filter = _ref.filter,
+      filter = _ref$filter === undefined ? 'start gt \'' + currentTime + '\' and status eq \'Active\'' : _ref$filter;
 
-    var _temp, _this, _ret;
+  var router = Router.useRouter();
 
-    _babelHelpers.classCallCheck(this, EventsDeck);
+  var _useState = React.useState(true),
+      _useState2 = _babelHelpers.slicedToArray(_useState, 2),
+      isLoading = _useState2[0],
+      setIsLoading = _useState2[1];
 
-    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
+  var _useState3 = React.useState(null),
+      _useState4 = _babelHelpers.slicedToArray(_useState3, 2),
+      accessToken = _useState4[0],
+      setAccessToken = _useState4[1];
 
-    return _ret = (_temp = (_this = _babelHelpers.possibleConstructorReturn(this, (_ref = EventsDeck.__proto__ || Object.getPrototypeOf(EventsDeck)).call.apply(_ref, [this].concat(args))), _this), _this.data = _this.props.dataRecord || [], _this.params = _this.props.params, _this.state = {
-      data: _this.data,
-      dataKeptToCompareNewDatarecord: _this.data,
-      page: _this.props.currentPage || 1,
-      scrolling: true,
-      currentPage: _this.props.currentPage || 1,
-      params: _this.params
-    }, _this.loadMore = debounce.debounce_1(function () {
-      _this.setState(function (prevState) {
-        return {
-          page: prevState.page + 1
-        };
-      }, _this.loadData);
-    }, 0), _this.loadData = function () {
-      var _this$state = _this.state,
-          data = _this$state.data,
-          page = _this$state.page,
-          params = _this$state.params;
-      var dataHandler = _this.props.dataHandler;
+  var _useState5 = React.useState([]),
+      _useState6 = _babelHelpers.slicedToArray(_useState5, 2),
+      data = _useState6[0],
+      setData = _useState6[1];
 
+  var _useState7 = React.useState(null),
+      _useState8 = _babelHelpers.slicedToArray(_useState7, 2),
+      nextPagingToken = _useState8[0],
+      setNextPagingToken = _useState8[1];
 
-      var dataHandlerPromise = new Promise(function (resolve, reject) {
-        try {
-          var result = dataHandler(params);
-          resolve(result);
-        } catch (e) {
-          reject(e);
-        }
-      });
-      dataHandlerPromise.then(function (newData) {
-        _this.loadDataFinished(data, newData, page);
-      });
-    }, _this.loadDataFinished = function (data, newData, page) {
-      var newDataArray = newData.data.map(function (item) {
+  var _useState9 = React.useState(true),
+      _useState10 = _babelHelpers.slicedToArray(_useState9, 2),
+      scrolling = _useState10[0],
+      setScrolling = _useState10[1];
+
+  var _useState11 = React.useState(1),
+      _useState12 = _babelHelpers.slicedToArray(_useState11, 2),
+      page = _useState12[0],
+      setPage = _useState12[1];
+
+  var _useState13 = React.useState(1),
+      _useState14 = _babelHelpers.slicedToArray(_useState13, 2),
+      currentPage = _useState14[0],
+      setCurrentPage = _useState14[1];
+
+  var getEvents = function getEvents() {
+    var itemsPerPage = 10;
+    var url = corsProxy + 'https://api-platform.cvent.com/event/v1/events/filter?limit=' + itemsPerPage;
+    fetch(url, {
+      headers: {
+        Accept: 'application/json',
+        'x-api-key': clientId,
+        Authorization: 'Bearer ' + accessToken
+      },
+      body: JSON.stringify({ filter: filter }),
+      method: 'POST'
+    }).then(function (response) {
+      return response.json();
+    }).then(function (events) {
+      setIsLoading(false);
+      var newData = events.data.map(function (item) {
         return _babelHelpers._extends({}, item, {
           pageNumber: page
         });
       });
-      var newParams = _babelHelpers._extends({}, _this.state.params, { nextPagingToken: newData.paging.nextToken });
-      _this.setState(function () {
-        if (newDataArray.length > 0) {
-          return {
-            data: [].concat(_babelHelpers.toConsumableArray(data), _babelHelpers.toConsumableArray(newDataArray)),
-            params: newParams,
-            scrolling: true
-          };
+      console.log(events.paging);
+      if (newData.length > 0) {
+        setData(function (prevData) {
+          return [].concat(_babelHelpers.toConsumableArray(prevData), _babelHelpers.toConsumableArray(newData));
+        });
+        setNextPagingToken(events.paging.nextToken ? events.paging.nextToken : null);
+        setScrolling(true);
+      } else {
+        setScrolling(false);
+      }
+    });
+  };
+
+  React.useEffect(function () {
+    // load initial data
+    if (accessToken && page === 1 && currentPage === 1) {
+      getEvents();
+    }
+  }, [accessToken, filter, page, currentPage]);
+
+  React.useEffect(function () {
+    // reset state when filter changes
+    setIsLoading(true);
+    setData([]);
+    setPage(1);
+    setCurrentPage(1);
+  }, [filter]);
+
+  React.useEffect(function () {
+    // get access token
+    var encodedData = window.btoa(clientId + ':' + clientSecret);
+    var url = corsProxy + 'https://api-platform.cvent.com/ea/oauth2/token';
+    fetch(url, {
+      headers: {
+        'Content-Type': 'application/x-www-form-urlencoded',
+        Authorization: 'Basic ' + encodedData
+      },
+      method: 'POST',
+      body: 'grant_type=client_credentials&client_id=' + clientId
+    }).then(function (response) {
+      return response.json();
+    }).then(function (json) {
+      return setAccessToken(json.access_token);
+    }).catch(function (e) {
+      return console.log(e);
+    });
+  }, []);
+
+  var loadMore = debounce.debounce_1(function () {
+    setPage(function (prevPage) {
+      return prevPage + 1;
+    });
+  }, 0);
+
+  React.useEffect(function () {
+    // load more events
+    page !== 1 && page !== currentPage && loadMoreEvents();
+  }, [page]);
+
+  var loadMoreEvents = function loadMoreEvents() {
+    console.log(nextPagingToken, 'nextPagingToken');
+    if (nextPagingToken) {
+      var url = corsProxy + 'https://api-platform.cvent.com/event/v1/events/filter?token=' + nextPagingToken;
+      fetch(url, {
+        headers: {
+          Accept: 'application/json',
+          'x-api-key': clientId,
+          Authorization: 'Bearer ' + accessToken
+        },
+        body: JSON.stringify({ filter: filter }),
+        method: 'POST'
+      }).then(function (response) {
+        return response.json();
+      }).then(function (events) {
+        var newData = events.data.map(function (item) {
+          return _babelHelpers._extends({}, item, {
+            pageNumber: page
+          });
+        });
+        console.log(events.paging);
+        if (newData.length > 0) {
+          setData(function (prevData) {
+            return [].concat(_babelHelpers.toConsumableArray(prevData), _babelHelpers.toConsumableArray(newData));
+          });
+          setNextPagingToken(events.paging.nextToken ? events.paging.nextToken : null);
+          setScrolling(true);
         } else {
-          return {
-            scrolling: false
-          };
+          setScrolling(false);
         }
       });
-    }, _this.changePageNumber = function (pageNumber) {
-      var _this$props = _this.props,
-          seoPaginate = _this$props.seoPaginate,
-          pageview = _this$props.pageview,
-          router = _this$props.router;
-      var currentPage = _this.state.currentPage;
-
-      if (seoPaginate) {
-        var path = router.asPath;
-        var qrIndex = path.indexOf('?');
-        var pathname = router.pathname;
-        var queryString = '';
-
-        if (qrIndex > 0) {
-          path = path.substring(1, qrIndex);
-
-          var partialQS = router.asPath.substring(qrIndex + 1);
-          var partialQSArr = partialQS.split('&');
-
-          // exclude page=xxx from query string
-          partialQSArr.map(function (item) {
-            var itemArr = item.split('=');
-            var key = itemArr[0];
-            var val = itemArr[1];
-
-            if (key !== 'page') {
-              queryString += (queryString.length === 0 ? '' : '&') + key + '=' + val;
-            }
-          });
-        }
+    }
+  };
 
-        if (queryString.length > 0) {
-          path += '?' + queryString;
-        }
+  var changePageNumber = function changePageNumber(pageNumber) {
+    if (seoPaginate) {
+      var path = router.asPath;
+      var qrIndex = path.indexOf('?');
+      var pathname = router.pathname;
+      var queryString = '';
 
-        pageNumber = parseInt(pageNumber);
+      if (qrIndex > 0) {
+        path = path.substring(1, qrIndex);
 
-        if (currentPage !== pageNumber) {
-          index.lib_3.refresh();
+        var partialQS = router.asPath.substring(qrIndex + 1);
+        var partialQSArr = partialQS.split('&');
 
-          _this.setState({
-            currentPage: pageNumber
-          }, function () {
-            if (path[0] !== '/') {
-              path = '/' + path;
-            }
+        // exclude page=xxx from query string
+        partialQSArr.map(function (item) {
+          var itemArr = item.split('=');
+          var key = itemArr[0];
+          var val = itemArr[1];
 
-            var newPath = pageNumber === 1 ? '' + path : path + '?page=' + pageNumber;
-
-            // please leave this for later debug purpose : Yong Jun.
-            /* console.log('page change reported', {
-              currentPage: currentPage,
-              pageNumber: pageNumber,
-              pathname: pathname,
-              path: path,
-              newPath: newPath,
-              firstPage: pageNumber === 1,
-              queryString: queryString
-            }) */
-
-            if (pageview) {
-              pageview(newPath);
-            }
+          if (key !== 'page') {
+            queryString += (queryString.length === 0 ? '' : '&') + key + '=' + val;
+          }
+        });
+      }
 
-            router.push(pathname, newPath, {
-              shallow: true
-            });
-          });
+      if (queryString.length > 0) {
+        path += '?' + queryString;
+      }
+
+      pageNumber = parseInt(pageNumber);
+
+      if (currentPage !== pageNumber) {
+        index.lib_3.refresh();
+
+        setCurrentPage(pageNumber);
+        if (path[0] !== '/') {
+          path = '/' + path;
+        }
+        var newPath = pageNumber === 1 ? '' + path : path + '?page=' + pageNumber;
+
+        if (pageview) {
+          pageview(newPath);
         }
+
+        router.push(pathname, newPath, {
+          shallow: true
+        });
       }
-    }, _this.registrationButton = function (registrationLink) {
-      return React__default.createElement(
-        'a',
-        { href: registrationLink, target: '_blank' },
-        React__default.createElement(
-          Button,
-          { className: 'event-registration-button' },
-          'Register Now'
-        )
-      );
-    }, _this.renderVenue = function (venue, index) {
-      return React__default.createElement(
-        Col,
-        { xs: 12, sm: 6, md: 6, xl: 6 },
-        React__default.createElement(
-          'div',
-          { className: 'venue-card', style: { width: '18rem' } },
+    }
+  };
+
+  var renderRegisterButton = function renderRegisterButton(registrationLink) {
+    return React__default.createElement(
+      'a',
+      { href: registrationLink, target: '_blank' },
+      React__default.createElement(
+        Button,
+        { size: 'sm', className: 'event-registration-button' },
+        'Register Now'
+      )
+    );
+  };
+
+  var cardLoader = function cardLoader() {
+    var numberOfItemsBeforeAd = 5;
+    return React__default.createElement(
+      Row,
+      null,
+      data && data.map(function (row, index) {
+        var title = row.title,
+            description = row.description,
+            start = row.start,
+            venues = row.venues,
+            _links = row._links,
+            virtual = row.virtual;
+
+        var pageNumber = row.pageNumber || 1;
+        return React__default.createElement(
+          React__default.Fragment,
+          { key: index },
           React__default.createElement(
-            Card.Body,
-            null,
-            React__default.createElement(
-              Card.Title,
-              null,
-              venue.name
-            ),
-            React__default.createElement(
-              Card.Subtitle,
-              { className: 'mb-2 text-muted' },
-              venue.address.address1
-            ),
-            React__default.createElement(
-              Card.Subtitle,
-              { className: 'mb-2 text-muted' },
-              venue.address.city
-            ),
-            React__default.createElement(
-              Card.Subtitle,
-              { className: 'mb-2 text-muted' },
-              venue.address.country
-            ),
-            React__default.createElement(
-              Card.Subtitle,
-              { className: 'mb-2 text-muted' },
-              venue.address.postalCode
-            )
-          )
-        )
-      );
-    }, _this.cardLoader = function () {
-      var numberOfItemsBeforeAd = 5;
-      return React__default.createElement(
-        Row,
-        null,
-        _this.state.data && _this.state.data.map(function (row, index) {
-          var title = row.title,
-              description = row.description,
-              start = row.start,
-              venues = row.venues,
-              _links = row._links;
-
-          var pageNumber = row.pageNumber || _this.state.page;
-          return React__default.createElement(
-            React__default.Fragment,
-            { key: index },
+            visibilitySensor.VisibilitySensor,
+            {
+              onChange: function onChange(isVisible) {
+                isVisible && changePageNumber(pageNumber);
+              } },
             React__default.createElement(
-              visibilitySensor.VisibilitySensor,
-              {
-                onChange: function onChange(isVisible) {
-                  isVisible && _this.changePageNumber(pageNumber);
-                } },
+              Col,
+              { xl: 12, style: { paddingTop: '10px', marginBottom: '20px', borderTop: '1px solid #D3D3D3' } },
               React__default.createElement(
-                Col,
-                { xl: 12, style: { marginBottom: '1rem' } },
+                Row,
+                null,
                 React__default.createElement(
-                  Row,
-                  null,
-                  React__default.createElement(
-                    Col,
-                    { xs: 12, style: { paddingTop: '10px', marginBottom: '20px', borderTop: '1px solid #EEE' } },
-                    !main.main_36 && React__default.createElement(
-                      'div',
-                      { style: { float: 'right' } },
-                      _this.registrationButton(_links.registration.href)
+                  Col,
+                  { xs: 12, sm: 4 },
+                  venues && venues.length > 0 && React__default.createElement(
+                    'div',
+                    null,
+                    React__default.createElement(
+                      'h5',
+                      null,
+                      venues[0].name
                     ),
-                    React__default.createElement('h4', { className: 'mb-1', style: { fontWeight: '500', fontSize: '22px' }, dangerouslySetInnerHTML: { __html: title } }),
                     React__default.createElement(
                       'p',
-                      { className: 'mb-2' },
-                      'Sarting at ',
-                      visibilitySensor.moment(start).format('MMMM Do YYYY, h:mma')
+                      { style: { padding: 0, margin: 0 } },
+                      visibilitySensor.moment(start).format('LL')
                     ),
-                    description && React__default.createElement('p', { dangerouslySetInnerHTML: { __html: description } }),
                     React__default.createElement(
-                      Row,
-                      null,
-                      venues && venues.length > 0 && venues.map(function (venue, index) {
-                        return _this.renderVenue(venue, index);
-                      })
-                    ),
-                    main.main_36 && _this.registrationButton(_links.registration.href)
+                      'p',
+                      { style: { padding: 0, margin: 0 } },
+                      visibilitySensor.moment(start).format('LT')
+                    )
                   )
+                ),
+                React__default.createElement(
+                  Col,
+                  { xs: 12, sm: 5 },
+                  React__default.createElement('h6', { className: 'mb-1', dangerouslySetInnerHTML: { __html: title } }),
+                  virtual && React__default.createElement(
+                    'h5',
+                    null,
+                    'VIRTUAL MEETING'
+                  )
+                ),
+                React__default.createElement(
+                  Col,
+                  { xs: 12, sm: 3 },
+                  renderRegisterButton(_links.registration.href)
+                )
+              ),
+              description && React__default.createElement(
+                Row,
+                { style: { marginTop: '8px' } },
+                React__default.createElement(
+                  Col,
+                  null,
+                  React__default.createElement('p', { dangerouslySetInnerHTML: { __html: description } })
                 )
               )
-            ),
-            main.main_36 && _this.rightItems && (index + 1) % numberOfItemsBeforeAd === 0 && React__default.createElement(
-              'div',
-              { style: { margin: '0 auto' } },
-              _this.renderMobileAd(index, numberOfItemsBeforeAd, _this.rightItems)
             )
-          );
-        })
-      );
-    }, _this.renderMobileAd = function (index, numberOfItemsBeforeAd) {
-      var rightItems = _this.props.rightItems;
+          ),
+          main.main_36 && rightItems && (index + 1) % numberOfItemsBeforeAd === 0 && React__default.createElement(
+            'div',
+            { style: { margin: '0 auto' } },
+            renderMobileAd(index, numberOfItemsBeforeAd)
+          )
+        );
+      })
+    );
+  };
 
-      var i = ((index + 1) / numberOfItemsBeforeAd - 1) % rightItems.length;
-      return React__default.createElement(
-        Col,
-        { md: 12, style: { display: 'flex', flex: '1 0 auto' } },
-        rightItems[i].component
-      );
-    }, _this.renderManualPagination = function () {
-      var currentPage = _this.state.currentPage;
+  var renderMobileAd = function renderMobileAd(index, numberOfItemsBeforeAd) {
+    var i = ((index + 1) / numberOfItemsBeforeAd - 1) % rightItems.length;
+    return React__default.createElement(
+      Col,
+      { md: 12, style: { display: 'flex', flex: '1 0 auto' } },
+      rightItems[i].component
+    );
+  };
 
-      return React__default.createElement(
-        'div',
-        { className: 'd-flex justify-content-between' },
-        currentPage && currentPage > 1 && React__default.createElement(
-          'a',
-          { href: '?page=' + (currentPage - 1) },
-          '<< Previous'
-        ),
+  var renderManualPagination = function renderManualPagination() {
+    var currentPage = 1;
+    return React__default.createElement(
+      'div',
+      { className: 'd-flex justify-content-between' },
+       currentPage > 1 ,
+      React__default.createElement(
+        'a',
+        { href: '?page=' + (currentPage + 1) },
+        'Next >>'
+      )
+    );
+  };
+
+  if (isLoading) {
+    return React__default.createElement(
+      'div',
+      { style: { display: 'flex', justifyContent: 'center', marginTop: '48px' } },
+      React__default.createElement(
+        Spinner,
+        { animation: 'border', role: 'status' },
         React__default.createElement(
-          'a',
-          { href: '?page=' + (currentPage + 1) },
-          'Next >>'
+          'span',
+          { className: 'sr-only' },
+          'Loading...'
         )
-      );
-    }, _temp), _babelHelpers.possibleConstructorReturn(_this, _ret);
+      )
+    );
   }
 
-  _babelHelpers.createClass(EventsDeck, [{
-    key: 'componentDidUpdate',
-    value: function componentDidUpdate(prevProps, prevState) {
-      if (this.state.dataKeptToCompareNewDatarecord !== this.props.dataRecord) {
-        // eslint-disable-next-line react/no-did-update-set-state
-        this.setState({
-          data: this.props.dataRecord,
-          dataKeptToCompareNewDatarecord: this.props.dataRecord,
-          page: 1,
-          scrolling: true
-        });
-      }
-    }
-  }, {
-    key: 'componentDidMount',
-    value: function componentDidMount() {
-      // this.loadData();
-    }
-  }, {
-    key: 'render',
-    value: function render() {
-      var _this2 = this;
-
-      var autoScroll = this.props.autoScroll;
-
-      console.log(this.state.data);
-      return React__default.createElement(
-        'div',
-        { className: 'contentDeck' },
-        autoScroll ? React__default.createElement(
-          React__default.Fragment,
-          null,
-          React__default.createElement(
-            visibilitySensor.InfiniteScroll,
-            { dataLength: this.state.data.length, next: this.loadMore, hasMore: this.state.scrolling, scrollThreshold: 0.9 },
-            React__default.createElement(
-              Container,
-              null,
-              this.cardLoader()
-            )
-          ),
+  if (data.length > 0) {
+    return React__default.createElement(
+      'div',
+      { className: 'contentDeck' },
+      autoScroll ? React__default.createElement(
+        React__default.Fragment,
+        null,
+        React__default.createElement(
+          visibilitySensor.InfiniteScroll,
+          { dataLength: data.length, next: loadMore, hasMore: scrolling, scrollThreshold: 0.9 },
           React__default.createElement(
-            'noscript',
+            Container,
             null,
-            this.renderManualPagination()
+            cardLoader()
           )
-        ) : React__default.createElement(
-          React__default.Fragment,
+        ),
+        React__default.createElement(
+          'noscript',
           null,
-          React__default.createElement(
-            Container,
-            null,
-            this.cardLoader()
-          ),
-          React__default.createElement(
-            'div',
-            { style: { padding: '0px 10px' } },
-            this.state.scrolling ? React__default.createElement(
-              'button',
-              {
-                style: { margin: 'auto', width: '100%' },
-                onClick: function onClick(e) {
-                  _this2.loadMore();
-                } },
-              'Load More'
-            ) : React__default.createElement(
-              'p',
-              { style: { textAlign: 'center' } },
-              React__default.createElement(
-                'b',
-                null,
-                'End of data'
-              )
+          renderManualPagination()
+        )
+      ) : React__default.createElement(
+        React__default.Fragment,
+        null,
+        React__default.createElement(
+          Container,
+          null,
+          cardLoader()
+        ),
+        React__default.createElement(
+          'div',
+          { style: { padding: '0px 10px' } },
+          scrolling ? React__default.createElement(
+            'button',
+            {
+              style: { margin: 'auto', width: '100%' },
+              onClick: function onClick(e) {
+                loadMore();
+              } },
+            'Load More'
+          ) : React__default.createElement(
+            'p',
+            { style: { textAlign: 'center' } },
+            React__default.createElement(
+              'b',
+              null,
+              'End of data'
             )
-          ),
-          React__default.createElement(
-            'noscript',
-            null,
-            this.renderManualPagination()
           )
         ),
         React__default.createElement(
-          'style',
-          { jsx: 'true' },
-          '\n          .venue-card {\n            border: 1px solid #c0c0c0;\n            border-radius: 6px;\n            padding: 2px;\n          }\n        '
+          'noscript',
+          null,
+          renderManualPagination()
         )
-      );
-    }
-  }]);
-  return EventsDeck;
-}(React__default.Component);
-
-var EventsDeck$1 = Router.withRouter(EventsDeck);
+      )
+    );
+  } else {
+    return React__default.createElement(
+      'div',
+      null,
+      React__default.createElement(
+        'div',
+        null,
+        'No events found '
+      )
+    );
+  }
+};
 
 var AccordionPanel = function AccordionPanel(props) {
   var accordionClassName = props.accordionClassName,
@@ -12140,7 +12196,7 @@ var OncliveLargeHero = function OncliveLargeHero(props) {
     React__default.createElement(
       'style',
       { jsx: 'true' },
-      '\n        .article-hero-container {\n          margin: 0 -0.8rem;\n        }\n        @media screen and (min-width: 1400px) {\n          .article-hero-container {\n            display: flex;\n            flex-direction: row;\n          }\n        }\n        .top-article {\n          // width: 50%;\n          margin: 0 1rem;\n          height: 100%;\n          display: block;\n        }\n        .top-article figure {\n          width: 100%;\n          height: 60%;\n        }\n        .top-article figure img {\n          width: 100%;\n          height: 100%;\n          object-fit: cover;\n        }\n        .top-article--body h1 {\n          font-size: 1.4rem;\n          color: black !important;\n          font-weight: bold;\n        }\n        // .sub-articles-container {\n        //   width: 50%;\n        //   flex: 1 1 auto;\n        //   min-width: 350px;\n        // }\n        .sub-article {\n          margin: 0 1rem 1rem;\n          display: flex;\n          flex-direction: row;\n        }\n        .sub-article figure {\n          width: 125px;\n        }\n        .sub-article figure img {\n          width: 125px;\n          height: auto;\n          object-fit: cover;\n        }\n        .sub-article--body {\n          padding-left: 1rem;\n          font-size: 0.9rem;\n        }\n        .sub-article--body h2 {\n          font-size: 1rem;\n          font-weight: bold;\n        }\n        @media screen and (max-width: 1368px) {\n          .article-hero-container {\n            flex-direction: column;\n          }\n          .top-article {\n            // width: unset;\n            flex: 1 1 auto;\n          }\n          .sub-articles-container {\n            width: 100%;\n            margin-top: 1rem;\n            min-width: 280px;\n          }\n        }\n        @media screen and (max-width: 1399px) and (min-width: 992px) {\n          .top-article {\n            // width: 50%;\n            flex: 1 1 auto;\n            margin-bottom: 1rem;\n          }\n          .middle-group {\n            display: none;\n          }\n          .middle-single {\n            display: block !important;\n            margin-top: 0 !important;\n          }\n          .top-article figure img {\n            max-height: 180px !important;\n          }\n          .top-article-summary {\n            display: none;\n          }\n        }\n        // @media only screen and (min-width) {\n        //   .sub-outer-container {\n        //     width: 50%;\n        //     flex: 1 1 auto;\n        //     min-width: 350px;\n        //   }\n        // }\n        .middle-single {\n          display: none;\n        }\n        .top-outer {\n          display: flex;\n        }\n      '
+      '\n        .article-hero-container {\n          margin: 0 -0.8rem;\n        }\n        @media screen and (min-width: 1400px) {\n          .article-hero-container {\n            display: flex;\n            flex-direction: row;\n            margin-bottom: 30px;\n          }\n          .top-outer {\n            width: 50%;\n          }\n          .sub-outer-container {\n            width: 50%;\n          }\n        }\n        .top-article {\n          // width: 50%;\n          margin: 0 1rem;\n          height: 100%;\n          display: block;\n        }\n        .top-article figure {\n          width: 100%;\n          height: 60%;\n        }\n        .top-article figure img {\n          width: 100%;\n          height: 100%;\n          object-fit: cover;\n        }\n        .top-article--body h1 {\n          font-size: 1.4rem;\n          color: black !important;\n          font-weight: bold;\n        }\n        // .sub-articles-container {\n        //   width: 50%;\n        //   flex: 1 1 auto;\n        //   min-width: 350px;\n        // }\n        .sub-article {\n          margin: 0 1rem 1rem;\n          display: flex;\n          flex-direction: row;\n        }\n        .sub-article figure {\n          width: 125px;\n        }\n        .sub-article figure img {\n          width: 125px;\n          height: auto;\n          object-fit: cover;\n        }\n        .sub-article--body {\n          padding-left: 1rem;\n          font-size: 0.9rem;\n        }\n        .sub-article--body h2 {\n          font-size: 1rem;\n          font-weight: bold;\n        }\n        @media screen and (max-width: 1368px) {\n          .article-hero-container {\n            flex-direction: column;\n          }\n          .top-article {\n            // width: unset;\n            flex: 1 1 auto;\n          }\n          .sub-articles-container {\n            width: 100%;\n            margin-top: 1rem;\n            min-width: 280px;\n          }\n        }\n        @media screen and (max-width: 1399px) and (min-width: 992px) {\n          .top-article {\n            // width: 50%;\n            flex: 1 1 auto;\n            margin-bottom: 1rem;\n          }\n          .middle-group {\n            display: none;\n          }\n          .middle-single {\n            display: block !important;\n            margin-top: 0 !important;\n          }\n          .top-article figure img {\n            max-height: 180px !important;\n          }\n          .top-article-summary {\n            display: none;\n          }\n        }\n        // @media only screen and (min-width) {\n        //   .sub-outer-container {\n        //     width: 50%;\n        //     flex: 1 1 auto;\n        //     min-width: 350px;\n        //   }\n        // }\n        .middle-single {\n          display: none;\n        }\n        .top-outer {\n          display: flex;\n        }\n      '
     )
   );
 };
@@ -13084,7 +13140,7 @@ exports.ArticleDetailDropdown = ArticleDetailDropdown;
 exports.ArticleQueue = ArticleQueue;
 exports.Breadcrumbs = Breadcrumbs$1;
 exports.ConferenceArticleCard = ConferenceArticleCard;
-exports.EventsDeck = EventsDeck$1;
+exports.EventsDeck = EventsDeck;
 exports.Feature = Feature;
 exports.ForbesHero = fbsHero;
 exports.Hero = Hero;