@mjhls/mjh-framework 1.0.98 → 1.0.99-0.next12

package/dist/esm/View.js

@@ -0,0 +1,2590 @@
+import { _ as _asyncToGenerator, r as regenerator, a as _Promise } from './asyncToGenerator-9716ae8d.js';
+import { _ as _extends, a as _Object$assign } from './extends-dc6a71fd.js';
+import { a as _getIterator, _ as _slicedToArray } from './slicedToArray-ca2c8b8d.js';
+import React__default, { useState, useRef, useEffect, forwardRef } from 'react';
+import Head from 'next/head';
+import { useRouter } from 'next/router';
+import { _ as _JSON$stringify } from './stringify-c21932b3.js';
+import { _ as _toConsumableArray } from './toConsumableArray-7b1c0e23.js';
+import { m as moment } from './moment-bc12cb97.js';
+import { B as BlockContent } from './BlockContent-c99c9a8d.js';
+import { m as main_43 } from './main-1894c974.js';
+import 'react-bootstrap/Dropdown';
+import Form from 'react-bootstrap/Form';
+import FormControl from 'react-bootstrap/FormControl';
+import Button from 'react-bootstrap/Button';
+import { V as VisibilitySensor } from './visibility-sensor-72fd8f8b.js';
+import SocialShare from './SocialShare.js';
+import { r as renderAuthor, g as getSerializers } from './index-c60f3bb6.js';
+import DFPAdSlot from './AdSlot.js';
+import { S as SeriesSlider } from './SeriesSlider-609f9d94.js';
+import { a as getContentPlacementUrl, g as getTargeting } from './getTargeting-db566006.js';
+import getKeywords from './getKeywords.js';
+import urlFor from './urlFor.js';
+import { u as urlForFile } from './urlForFile-413f5ddb.js';
+import { _ as _typeof } from './typeof-83d9eb10.js';
+import { b as FaMinus, c as FaPlus } from './index.esm-1bd8a0a8.js';
+import { s as styleInject } from './style-inject.es-1f59c1d0.js';
+import './index-755f2cc2.js';
+import { DiscussionEmbed } from 'disqus-react';
+import Schema from './Schema.js';
+import FileSaver from 'file-saver';
+import { PixelTrackingArticle } from './PixelTracking.js';
+import { _ as _Object$keys } from './keys-425c8ab0.js';
+import { I as InfiniteScroll } from './index.es-a6137319.js';
+import { l as lib_3 } from './index-5cc7b406.js';
+import getRelatedArticle from './getRelatedArticle.js';
+import getQuery from './getQuery.js';
+import getSeriesDetail from './getSeriesDetail.js';
+import './_commonjsHelpers-0c4b6f40.js';
+import './core.get-iterator-method-e903ff31.js';
+import './web.dom.iterable-fdf034f5.js';
+import './_library-528f1934.js';
+import './_iter-detect-f089461c.js';
+import './_object-pie-133f504a.js';
+import 'prop-types';
+import './index-0dbff1d1.js';
+import 'react-dom';
+import 'react-share';
+import 'react-bootstrap';
+import './index-c7e2ac95.js';
+import './Beam.js';
+import './Segment.js';
+import './brightcove-react-player-loader.es-57a70a56.js';
+import 'react-bootstrap/Modal';
+import 'react-ga';
+import './GroupDeck.js';
+import './smoothscroll-fa4e3f8c.js';
+import './_is-array-893ab020.js';
+import './_object-to-array-50a6b9a3.js';
+import 'react-bootstrap/Pagination';
+import './entities-932b50cf.js';
+import 'react-bootstrap/Row';
+import 'react-bootstrap/Col';
+import './inherits-8a801a18.js';
+import './_object-sap-169d6272.js';
+import './define-property-99e66838.js';
+import './index.esm-eb1e8e80.js';
+import './iconBase-ccc56b97.js';
+import 'react-bootstrap/Figure';
+import 'react-bootstrap/OverlayTrigger';
+import 'react-bootstrap/Tooltip';
+import 'react-bootstrap/Popover';
+import './debounce-533d9748.js';
+import './isSymbol-a7e9aafe.js';
+import './toNumber-5aeba6e7.js';
+
+var getArticleSummary = function getArticleSummary(article) {
+  if (article.summary && article.summary.length > 0) {
+    return article.summary;
+  } else {
+    return false;
+  }
+};
+
+var getDocumentGroupUrl = function getDocumentGroupUrl(docGroup) {
+  if (!docGroup) {
+    return null;
+  }
+  var url = void 0;
+
+  if (docGroup.path && docGroup.path.includes('/') && (!docGroup.parent || !docGroup.parent.parent)) {
+    return '/' + docGroup.path;
+  }
+  // Checking if Parent has Parent
+  if (docGroup.path && docGroup.path.includes('/') && docGroup.parent && docGroup.parent.parent) {
+    if (docGroup.path.includes(docGroup.parent.identifier.current)) {
+      return '/' + docGroup.parent.parent.identifier.current + '/' + docGroup.path;
+    } else {
+      return '/' + docGroup.parent.parent.identifier.current + '/' + docGroup.parent.identifier.current + '/' + docGroup.path;
+    }
+  }
+
+  if (docGroup.parent) {
+    url = '/' + docGroup.parent.identifier.current;
+    if (docGroup.parent.parent && docGroup.parent.parent.name) {
+      url = '/' + docGroup.parent.parent.identifier.current + url;
+    }
+  }
+
+  if (!docGroup.thumbnail) ;
+  if (typeof url != 'undefined') {
+    url = url + '/' + docGroup.path;
+  } else {
+    url = '/' + docGroup.path;
+  }
+
+  return url;
+};
+
+var getDocumentGroupName = function getDocumentGroupName(docGroup) {
+  var name = void 0;
+  if (!docGroup) {
+    return null;
+  }
+
+  if (docGroup.parent) {
+    name = docGroup.parent.name;
+
+    if (docGroup.parent.parent && docGroup.parent.parent.name) {
+      name = docGroup.parent.parent.name + ' | ' + name;
+    }
+  }
+
+  //if (!docGroup.thumbnail) {
+  if (typeof name != 'undefined') {
+    name = name + ' | <b>' + docGroup.name + '</b>';
+  } else {
+    name = '<b>' + docGroup.name + '</b>';
+  }
+  //}
+
+  return name && typeof name != 'undefined' ? name : null;
+};
+
+var DocumentGroup = function DocumentGroup(_ref) {
+  var article = _ref.article,
+      client = _ref.client;
+
+  var mediaSeriesGroup = null;
+
+  if (article.documentGroup && article.documentGroup.isShow !== false && article.documentGroup.isSeries !== true) {
+    mediaSeriesGroup = article.documentGroup;
+  }
+  if (!article.documentGroup && article.documentGroupMapping) {
+    for (var i = 0; i < article.documentGroupMapping.length; i++) {
+      if (article.documentGroupMapping[i].isShow !== false && article.documentGroupMapping[i].isSeries !== true) {
+        mediaSeriesGroup = article.documentGroupMapping[i];
+        break;
+      }
+    }
+  }
+
+  if (!mediaSeriesGroup) {
+    return null;
+  }
+
+  var name = getDocumentGroupName(mediaSeriesGroup);
+  var url = getDocumentGroupUrl(mediaSeriesGroup);
+  var thumbnailUrl = false;
+
+  if (mediaSeriesGroup.thumbnail) {
+    thumbnailUrl = urlFor({ client: client, source: mediaSeriesGroup.thumbnail });
+  }
+
+  return React__default.createElement(
+    'a',
+    {
+      href: url,
+      className: 'doc-group',
+      style: { display: 'flex', flexDirection: 'column', padding: '0 1rem', justifyContent: thumbnailUrl ? 'center' : 'flex-start', alignItems: 'center' } },
+    thumbnailUrl && React__default.createElement('img', { style: { maxWidth: '220px', maxHeight: '100px', marginTop: '1rem' }, src: thumbnailUrl, alt: name }),
+    !thumbnailUrl && React__default.createElement('p', {
+      style: { maxWidth: '315px', margin: '0', color: 'var(--primary)', textAlign: thumbnailUrl ? 'center' : main_43 ? 'left' : 'right', marginTop: '.25rem' },
+      dangerouslySetInnerHTML: { __html: name } }),
+    main_43 && !thumbnailUrl && React__default.createElement(
+      'style',
+      { jsx: 'true' },
+      '\n          a.doc-group {\n            display: block !important;\n            padding: 0 !important;\n          }\n        '
+    )
+  );
+};
+
+var findIndex = function findIndex(arr) {
+  var indexes = [];
+  if ((typeof arr === 'undefined' ? 'undefined' : _typeof(arr)) === 'object') {
+    var _iteratorNormalCompletion = true;
+    var _didIteratorError = false;
+    var _iteratorError = undefined;
+
+    try {
+      for (var _iterator = _getIterator(arr), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+        var ele = _step.value;
+
+        if (ele['_type'] === 'block' && ele.children.some(function (child) {
+          return child.text.trim().length > 0;
+        }) && ele['listItem'] !== 'bullet' &&
+        //  To skip li tags when setting contextual native ads
+        ele['listItem'] !== 'number' && ele['style'] === 'normal' || ele['_type'] === 'figure') {
+          indexes.push(arr.indexOf(ele));
+        }
+      }
+    } catch (err) {
+      _didIteratorError = true;
+      _iteratorError = err;
+    } finally {
+      try {
+        if (!_iteratorNormalCompletion && _iterator.return) {
+          _iterator.return();
+        }
+      } finally {
+        if (_didIteratorError) {
+          throw _iteratorError;
+        }
+      }
+    }
+  }
+  return indexes;
+};
+
+var ISI = function ISI(props) {
+  var children = props.children;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      active = _useState2[0],
+      setActive = _useState2[1];
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      bottomOfArticle = _useState4[0],
+      setbottomOfArticle = _useState4[1];
+
+  var isi = useRef();
+
+  useEffect(function () {
+    if (active) {
+      var offset = '5rem';
+      var nav = document.getElementsByTagName('header');
+      if (nav && nav.length > 0) {
+        offset = nav[0].offsetHeight + 'px';
+      }
+      isi.current.style.maxHeight = 'calc(100% - ' + offset + ')';
+      isi.current.style.overflowY = 'scroll';
+    } else {
+      isi.current.style.maxHeight = '';
+      isi.current.style.overflowY = '';
+    }
+  }, [active]);
+  useEffect(function () {
+    var detectBottomOfArticle = function detectBottomOfArticle() {
+      var article_body = document.getElementById('article__block');
+      var isi = document.getElementById('isi');
+      var articleBottomPosition = article_body.getBoundingClientRect().bottom - window.innerHeight;
+      // console.log(articleBottomPosition, bottomOfArticle)
+      if (articleBottomPosition < 30 && !isi.classList.contains('in-view')) {
+        setbottomOfArticle(true);
+      }
+      if (articleBottomPosition > 60 && isi.classList.contains('in-view')) {
+        setbottomOfArticle(false);
+      }
+    };
+    window.addEventListener('scroll', detectBottomOfArticle);
+    return function () {
+      return window.removeEventListener('scroll', detectBottomOfArticle);
+    };
+  }, []);
+
+  useEffect(function () {
+    var isi = document.getElementById('isi');
+    if (bottomOfArticle) {
+      toggleSticky(true);
+      isi.classList.add('in-view');
+      if (active) {
+        setActive(false);
+      }
+    }
+    if (!bottomOfArticle) {
+      toggleSticky(false);
+      isi.classList.remove('in-view');
+    }
+  }, [bottomOfArticle]);
+
+  var toggleSticky = function toggleSticky(sticky) {
+    var isiToggle = document.getElementById('isiToggle');
+    var isiContent = document.getElementById('isiContent');
+    var isi = document.getElementById('isi');
+    if (sticky) {
+      isi.style.bottom = '-200px';
+      setTimeout(function () {
+        isi.style.maxHeight = 'unset';
+        isi.style.position = 'relative';
+        isi.style.boxShadow = 'none';
+        isi.style.zIndex = '1';
+        isi.style.marginTop = '-25rem';
+        isi.style.marginBottom = '15rem';
+        isiToggle.style.display = 'none';
+        isiContent.style.padding = '0';
+      }, 300);
+    } else if (!sticky) {
+
+      isi.style.marginBottom = '0';
+      isi.style.maxHeight = '12rem';
+      isi.style.position = 'fixed';
+      isi.style.boxShadow = '0 0 1rem 0 rgba(0, 0, 0, 0.5)';
+      isi.style.zIndex = '99999';
+
+      isiToggle.style.display = 'block';
+      isiContent.style.padding = '1rem';
+      setTimeout(function () {
+        isi.style.bottom = '0';
+        isi.style.marginTop = '0';
+      }, 300);
+    }
+  };
+  return React__default.createElement(
+    React__default.Fragment,
+    null,
+    React__default.createElement(
+      'div',
+      { id: 'isi', ref: isi },
+      React__default.createElement(
+        'div',
+        { id: 'isiContent' },
+        React__default.createElement(
+          'div',
+          { onClick: function onClick() {
+              return setActive(function (prev) {
+                return !prev;
+              });
+            }, id: 'isiToggle' },
+          active ? React__default.createElement(
+            'p',
+            null,
+            'Close ',
+            React__default.createElement(FaMinus, null)
+          ) : React__default.createElement(
+            'p',
+            null,
+            'See More ',
+            React__default.createElement(FaPlus, null)
+          )
+        ),
+        children
+      )
+    ),
+    React__default.createElement(
+      'style',
+      { jsx: true },
+      '\n        #isi {\n          position: fixed;\n          z-index: 9999999;\n          bottom: 0;\n          left: 0;\n          max-height: 12rem;\n          background-color: #ffffff;\n          overflow-x: hidden;\n          overflow-y: hidden;\n          width: 100%;\n          box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.5);\n          transition: bottom .5s ease , margin-top .3s, max-height .2s;\n        }\n        #isiContent {\n          width: 100%;\n          max-width: 1000px;\n          margin-left: auto;\n          margin-right: auto;\n          position: relative;\n          padding: 1rem;\n          font-size: 1rem;\n        }\n        #isi::-webkit-scrollbar {\n          display: none;\n        }\n        #isiToggle {\n          position: absolute;\n          top: 0;\n          right: 0;\n          padding: 1rem;\n          font-weight: bold;\n          cursor: pointer;\n          font-size: 1rem;\n        }\n        #isiToggle p {\n          margin: 0;\n        }\n      '
+    )
+  );
+};
+
+var css$1 = ".RelatedArticles-module_mediaContainer__10h9k {\r\n  display: flex;\r\n  flex-direction: row;\r\n  flex-wrap: nowrap;\r\n  margin: 0 -1rem;\r\n}\r\n.RelatedArticles-module_mediaCard__3wQbn {\r\n  margin: 0 1rem 1rem;\r\n  width: calc(33% - 1rem);\r\n  display: column;\r\n  flex-direction: row;\r\n  margin-bottom: 0.75rem;\r\n  padding-bottom: 0.75rem;\r\n  border-bottom: none;\r\n}\r\n.RelatedArticles-module_mediaCard__3wQbn:last-child {\r\n  border-bottom: none;\r\n}\r\n.RelatedArticles-module_cardTitle__3P-Ib {\r\n  font-weight: bold;\r\n  color: #252525;\r\n  margin-bottom: 0.25rem;\r\n  font-size: 15px;\r\n}\r\n.RelatedArticles-module_authorListing__1EFg4 span.RelatedArticles-module_text-muted__3b0zX {\r\n  color: #000;\r\n  font-weight: bold;\r\n}\r\n.RelatedArticles-module_cardDate__1wOR5 {\r\n  color: var(--dark);\r\n  display: block;\r\n  background: #fff !important;\r\n  margin-bottom: 0;\r\n}\r\n.RelatedArticles-module_imgWrapper__5Jx_4 {\r\n  display: block;\r\n  text-align: center;\r\n  margin-bottom: 0.5rem;\r\n}\r\n.RelatedArticles-module_imgWrapper__5Jx_4 img {\r\n  height: 135px;\r\n  width: 100%;\r\n  object-fit: cover;\r\n  object-position: center;\r\n}\r\n@media screen and (max-width: 1064px) {\r\n}\r\n@media screen and (max-width: 968px) {\r\n  .RelatedArticles-module_mediaContainer__10h9k {\r\n    flex-wrap: wrap;\r\n  }\r\n  .RelatedArticles-module_imgWrapper__5Jx_4 {\r\n    display: none;\r\n  }\r\n  .RelatedArticles-module_mediaCard__3wQbn {\r\n    width: 100%;\r\n    margin-bottom: 0.5rem;\r\n    padding: 0;\r\n  }\r\n  .RelatedArticles-module_cardTitle__3P-Ib {\r\n    font-size: 0.75rem;\r\n    margin-bottom: 0;\r\n  }\r\n}\r\n";
+var styles$1 = { "mediaContainer": "RelatedArticles-module_mediaContainer__10h9k", "mediaCard": "RelatedArticles-module_mediaCard__3wQbn", "cardTitle": "RelatedArticles-module_cardTitle__3P-Ib", "authorListing": "RelatedArticles-module_authorListing__1EFg4", "text-muted": "RelatedArticles-module_text-muted__3b0zX", "cardDate": "RelatedArticles-module_cardDate__1wOR5", "imgWrapper": "RelatedArticles-module_imgWrapper__5Jx_4" };
+styleInject(css$1);
+
+var RelatedArticle = function RelatedArticle(_ref) {
+  var articles = _ref.articles,
+      client = _ref.client,
+      fallbackImage = _ref.fallbackImage,
+      _ref$showRelatedArtic = _ref.showRelatedArticleFallbackImage,
+      showRelatedArticleFallbackImage = _ref$showRelatedArtic === undefined ? true : _ref$showRelatedArtic;
+
+  if (!articles || articles.length == 0 || !articles[0]) {
+    return null;
+  }
+  return React__default.createElement(
+    'div',
+    { className: styles$1.mediaContainer },
+    articles.map(function (article, index) {
+      if (article && article.url && article.url.current) {
+        return React__default.createElement(
+          'div',
+          { id: 'related-card', key: index, className: styles$1.mediaCard },
+          React__default.createElement(
+            'a',
+            { className: styles$1.imgWrapper, href: '/view/' + (article.url ? article.url.current : '') },
+            article.thumbnail ? React__default.createElement('img', {
+              style: { objectFit: 'cover', objectPosition: 'center' },
+              src: article.thumbnail && urlFor({ client: client, source: article.thumbnail.asset, imageWidth: 250 }),
+              alt: article.title
+            }) : React__default.createElement(
+              React__default.Fragment,
+              null,
+              fallbackImage && showRelatedArticleFallbackImage && React__default.createElement('img', { src: fallbackImage, alt: 'website logo', style: { objectFit: 'contain' } })
+            )
+          ),
+          React__default.createElement(
+            'div',
+            { className: styles$1.mediaBody },
+            React__default.createElement(
+              'a',
+              { href: '/view/' + (article.url ? article.url.current : '') },
+              React__default.createElement(
+                'div',
+                { className: styles$1.cardTitle },
+                article.title
+              )
+            )
+          )
+        );
+      }
+    })
+  );
+};
+
+var getSocialShareDisableFlag = function getSocialShareDisableFlag(article) {
+  //Need to check Taxonomy, DocumentGroup, and Authors for showSocialShare
+  var showSocialShare = true;
+  if (article.showSocialShare === true) {
+    return showSocialShare;
+  }
+
+  if (article.showSocialShare === false) {
+    showSocialShare = false;
+    return showSocialShare;
+  }
+
+  if (article.content_placement && article.content_placement.length > 0) {
+    //loop through each
+    article.content_placement.forEach(function (category) {
+      if (category.showSocialShare === false) {
+        showSocialShare = false;
+      }
+    });
+  }
+  if (article.authorDetails && article.authorDetails.length > 0) {
+    article.authorDetails.forEach(function (author) {
+      if (author.showSocialShare === false) {
+        showSocialShare = false;
+      }
+    });
+  }
+  if (article.documentGroup && article.documentGroup.length > 0) {
+    article.documentGroup.forEach(function (docGroup) {
+      if (docGroup.showSocialShare === false) {
+        showSocialShare = false;
+      }
+    });
+  }
+  if (article.documentGroupMapping && article.documentGroupMapping.length > 0) {
+    article.documentGroupMapping.forEach(function (docGroup) {
+      if (docGroup.showSocialShare === false) {
+        showSocialShare = false;
+      }
+    });
+  }
+
+  return showSocialShare;
+};
+
+var css = ".RecommendedArticles-module_recommendTitle__2kUji {\r\n  border-bottom: 2px solid var(--secondary-blue);\r\n  font-size: 1.5rem;\r\n  font-weight: bold;\r\n  color: #0d335a;\r\n  padding: 0.5rem;\r\n}\r\n.RecommendedArticles-module_recommendContainer__sZukI {\r\n  display: flex;\r\n  flex-direction: row;\r\n  flex-wrap: wrap;\r\n  margin: 0 -0.5rem;\r\n}\r\n.RecommendedArticles-module_recommendTop__1_yqw {\r\n  margin: 0.5rem;\r\n  width: 100%;\r\n  flex-basis: 100%;\r\n  display: flex;\r\n\r\n}\r\n.RecommendedArticles-module_recommendTopImg__1b9gu {\r\n  min-width: 55%;\r\n  width: 55%;\r\n  height: 100%;\r\n}\r\n.RecommendedArticles-module_recommendTopImg__1b9gu img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n.RecommendedArticles-module_recommendTopBody__-13FI {\r\n  margin-left: 1rem;\r\n  line-height: 1.3;\r\n  color: #121212;\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n.RecommendedArticles-module_topTitle__2EafN {\r\n  font-size: 25px;\r\n  font-weight: bold;\r\n  margin-bottom: 0.5rem;\r\n}\r\n.RecommendedArticles-module_topBody__2_VNi {\r\n  font-size: 19px;\r\n  margin-bottom: 0.5rem;\r\n}\r\n.RecommendedArticles-module_topLink__2RnXu {\r\n  font-size: 19px;\r\n  color: rgb(43, 43, 151);\r\n  text-decoration: underline;\r\n  margin-top: auto;\r\n}\r\n.RecommendedArticles-module_smContainer__4byBO {\r\n  width: calc(25% - 1rem);\r\n  margin: 0 0.5rem;\r\n}\r\n.RecommendedArticles-module_smImage__TYZGY img {\r\n  width: 100%;\r\n}\r\n.RecommendedArticles-module_title__3q1ud {\r\n  margin-top: 1rem;\r\n  line-height: 1.2;\r\n  color: #121212;\r\n}\r\n.RecommendedArticles-module_category__2jRto {\r\n  text-transform: uppercase;\r\n  font-size: 16px;\r\n  letter-spacing: 2px;\r\n  margin: 0.25rem 0;\r\n}\r\n\r\n/* media query */\r\n\r\n@media screen and (max-width: 1399px) {\r\n  .RecommendedArticles-module_topTitle__2EafN {\r\n    font-size: 21px;\r\n  }\r\n  .RecommendedArticles-module_topBody__2_VNi {\r\n    font-size: 15px;\r\n  }\r\n}\r\n@media screen and (max-width: 1191px) {\r\n  .RecommendedArticles-module_topTitle__2EafN {\r\n    font-size: 23px;\r\n  }\r\n  .RecommendedArticles-module_topBody__2_VNi,\r\n  .RecommendedArticles-module_topLink__2RnXu {\r\n    font-size: 17px;\r\n  }\r\n}\r\n@media screen and (max-width: 968px) {\r\n  .RecommendedArticles-module_topTitle__2EafN {\r\n    font-size: 18px;\r\n  }\r\n  .RecommendedArticles-module_topBody__2_VNi,\r\n  .RecommendedArticles-module_topLink__2RnXu {\r\n    font-size: 15px;\r\n  }\r\n}\r\n@media screen and (max-width: 768px) {\r\n  .RecommendedArticles-module_recommendTop__1_yqw {\r\n    flex-direction: column;\r\n  }\r\n  .RecommendedArticles-module_recommendTopImg__1b9gu,\r\n  .RecommendedArticles-module_recommendTopBody__-13FI {\r\n    width: 100%;\r\n    margin: 0;\r\n  }\r\n  .RecommendedArticles-module_recommendTopBody__-13FI {\r\n    margin-bottom: 1rem;\r\n  }\r\n  .RecommendedArticles-module_smContainer__4byBO {\r\n    width: calc(50% - 1rem);\r\n  }\r\n}";
+var styles = { "recommendTitle": "RecommendedArticles-module_recommendTitle__2kUji", "recommendContainer": "RecommendedArticles-module_recommendContainer__sZukI", "recommendTop": "RecommendedArticles-module_recommendTop__1_yqw", "recommendTopImg": "RecommendedArticles-module_recommendTopImg__1b9gu", "recommendTopBody": "RecommendedArticles-module_recommendTopBody__-13FI", "topTitle": "RecommendedArticles-module_topTitle__2EafN", "topBody": "RecommendedArticles-module_topBody__2_VNi", "topLink": "RecommendedArticles-module_topLink__2RnXu", "smContainer": "RecommendedArticles-module_smContainer__4byBO", "smImage": "RecommendedArticles-module_smImage__TYZGY", "title": "RecommendedArticles-module_title__3q1ud", "category": "RecommendedArticles-module_category__2jRto" };
+styleInject(css);
+
+var _this$2 = undefined;
+
+var Recommended = function Recommended(props) {
+  var article = props.article,
+      client = props.client,
+      _props$index = props.index,
+      index = _props$index === undefined ? 0 : _props$index,
+      cpModificationRequired = props.cpModificationRequired;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      segmentLoaded = _useState2[0],
+      setSegmentLoaded = _useState2[1];
+
+  var _useState3 = useState([]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      articles = _useState4[0],
+      setArticles = _useState4[1];
+
+  var _useState5 = useState('loading'),
+      _useState6 = _slicedToArray(_useState5, 2),
+      loaded = _useState6[0],
+      setLoaded = _useState6[1]; //loading, loaded, failed
+
+
+  var starting = index * 5;
+  var contentMapping = {
+    videos: 'video',
+    articles: 'article',
+    podcasts: 'podcast'
+  };
+
+  var mainCategories = article.content_placement.filter(function (cp) {
+    return cp.usedForRecommendations === true;
+  }).map(function (cp) {
+    return cp.name;
+  }).sort();
+
+  useEffect(function () {
+    try {
+      if (!segmentLoaded) {
+        return;
+      }
+      if (mainCategories.length > 0) {
+        //console.log(mainCategories)
+        analytics.track('Article Category Viewed', {
+          categories: _JSON$stringify(mainCategories)
+        });
+      }
+
+      // get users traits
+      var getSegmentProfile = function () {
+        var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() {
+          var anonymousId, response, data, addTaxonomyName, favoriteCategories, articlesCategory, videosCategory, podcastCategory, taxonomyCategories, taxonomies, articlesQuery, videosQuery, podcastQuery, params, _ref2, _ref3, _articles, videos, podcasts;
+
+          return regenerator.wrap(function _callee$(_context) {
+            while (1) {
+              switch (_context.prev = _context.next) {
+                case 0:
+                  anonymousId = analytics.user().anonymousId();
+                  _context.next = 3;
+                  return fetch('/api/getSegmentProfile', {
+                    method: 'POST',
+                    body: _JSON$stringify({ anonymousId: anonymousId })
+                  });
+
+                case 3:
+                  response = _context.sent;
+                  _context.next = 6;
+                  return response.json();
+
+                case 6:
+                  data = _context.sent;
+
+                  if (!(data && data.traits && data.traits.favorite_article_category)) {
+                    _context.next = 40;
+                    break;
+                  }
+
+                  //console.log('%csegment user profile', 'font-size:1.5rem;color:#000000;padding:1rem;background-color:yellow;', data.traits)
+
+                  addTaxonomyName = function addTaxonomyName(taxArr) {
+                    if (!taxArr) return '';
+                    var query = ' && ( ';
+                    taxArr.forEach(function (item, index) {
+                      if (index === 0) {
+                        query = query + ('name == \'' + item + '\'');
+                      } else {
+                        query = query + (' || name == \'' + item + '\'');
+                      }
+                    });
+
+                    query = query + ' )';
+
+                    return query;
+                  };
+
+                  favoriteCategories = JSON.parse(data.traits.favorite_article_category);
+
+                  //grab contentCategory ID
+
+                  _context.next = 12;
+                  return client.fetch("*[_type == 'contentCategory' && name == 'Articles'][0]{_id}");
+
+                case 12:
+                  articlesCategory = _context.sent;
+                  _context.next = 15;
+                  return client.fetch("*[_type == 'contentCategory' && name == 'Videos'][0]{_id}");
+
+                case 15:
+                  videosCategory = _context.sent;
+                  _context.next = 18;
+                  return client.fetch("*[_type == 'contentCategory' && name == 'Podcasts'][0]{_id}");
+
+                case 18:
+                  podcastCategory = _context.sent;
+                  _context.next = 21;
+                  return client.fetch('*[_type == \'taxonomy\' ' + addTaxonomyName(favoriteCategories) + ']');
+
+                case 21:
+                  taxonomyCategories = _context.sent;
+                  taxonomies = '';
+
+                  taxonomyCategories.forEach(function (taxonomy, index) {
+                    if (index === 0) {
+                      taxonomies = taxonomies + (' && ( references(\'' + taxonomy._id + '\')');
+                    } else {
+                      taxonomies = taxonomies + (' || references(\'' + taxonomy._id + '\')');
+                    }
+                  });
+                  taxonomies = taxonomies + ' )';
+
+                  // grab 3 articles from sanity different from the one currently being read
+                  articlesQuery = '*[_type == \'article\'\n          && !(_id in path("drafts.**"))\n          && defined(title)\n          && defined(url)\n          && is_visible == true \n          && passwordLock != true\n          && references(\'' + articlesCategory._id + '\')\n          ' + taxonomies + '\n          && defined(published)\n          && _id != $id\n          && dateTime(published) <= dateTime(now())] | order(published desc) [' + starting + '...' + (starting + 5) + '] {\n            ...,\n            title,\n            thumbnail,\n            url,\n            contentCategory->,\n            published,\n          }';
+                  videosQuery = '*[_type == \'article\'\n          && !(_id in path("drafts.**"))\n          && defined(title)\n          && defined(url)\n          && is_visible == true \n          && passwordLock != true\n          && references(\'' + videosCategory._id + '\')\n          ' + taxonomies + '\n          && defined(published)\n          && _id != $id\n          && dateTime(published) <= dateTime(now())] | order(published desc) [' + starting + '...' + (starting + 1) + '] {\n            ...,\n            title,\n            thumbnail,\n            url,\n            contentCategory->,\n            published,\n          }';
+                  podcastQuery = '*[_type == \'article\'\n          && !(_id in path("drafts.**"))\n          && defined(title)\n          && defined(url)\n          && is_visible == true \n          && passwordLock != true\n          && references(\'' + podcastCategory._id + '\')\n          ' + taxonomies + '\n          && defined(published)\n          && _id != $id\n          && dateTime(published) <= dateTime(now())] | order(published desc) [' + starting + '...' + (starting + 2) + '] {\n            ...,\n            title,\n            thumbnail,\n            url,\n            contentCategory->,\n            published,\n          }';
+                  params = {
+                    id: article._id
+                  };
+                  _context.next = 31;
+                  return _Promise.all([client.fetch(articlesQuery, params), client.fetch(videosQuery, params), client.fetch(podcastQuery, params)]);
+
+                case 31:
+                  _ref2 = _context.sent;
+                  _ref3 = _slicedToArray(_ref2, 3);
+                  _articles = _ref3[0];
+                  videos = _ref3[1];
+                  podcasts = _ref3[2];
+
+                  if (_articles.length === 0) setLoaded('failed');
+                  if (_articles) {
+                    if (videos[0] && _articles[2]) {
+                      _articles[2] = videos[0];
+                    }
+                    if (videos[1] && _articles[4]) {
+                      _articles[4] = videos[1];
+                    }
+                    if (podcasts[0] && _articles[3]) {
+                      _articles[3] = podcasts[0];
+                    }
+                    setArticles(_articles);
+                  }
+                  _context.next = 41;
+                  break;
+
+                case 40:
+                  setLoaded('failed');
+
+                case 41:
+                case 'end':
+                  return _context.stop();
+              }
+            }
+          }, _callee, _this$2);
+        }));
+
+        return function getSegmentProfile() {
+          return _ref.apply(this, arguments);
+        };
+      }();
+
+      getSegmentProfile();
+    } catch (err) {
+      console.log(err);
+      setLoaded('failed');
+    }
+  }, [segmentLoaded]);
+
+  useEffect(function () {
+    if (articles && articles.length > 0) {
+      setLoaded('loaded');
+    }
+  }, [articles]);
+
+  useEffect(function () {
+    try {
+      analytics.ready(function () {
+        setSegmentLoaded(function () {
+          return 'loaded';
+        });
+      });
+    } catch (err) {
+      console.log(err);
+      setLoaded('failed');
+    }
+  }, []);
+
+  return React__default.createElement(
+    'div',
+    { id: 'recommended', style: { minHeight: '150px' } },
+    loaded === 'loaded' && React__default.createElement(
+      React__default.Fragment,
+      null,
+      React__default.createElement(
+        'h4',
+        { className: styles.recommendTitle },
+        'Recommended For You'
+      ),
+      React__default.createElement(
+        'div',
+        { className: styles.recommendContainer, id: 'recommendedContent' },
+        articles.map(function (article, index) {
+          if (index === 0) {
+            return React__default.createElement(
+              'div',
+              { key: article._id + ('-' + index), className: styles.recommendTop },
+              React__default.createElement(
+                'div',
+                { className: styles.recommendTopImg },
+                React__default.createElement(
+                  'a',
+                  { href: '/view/' + article.url.current + '?utm_source=website&utm_medium=dynamic_content&utm_campaign=in_feed_unit' },
+                  React__default.createElement('img', { src: urlFor({ source: article.thumbnail, client: client, imageHeight: 306, imageWidth: 544 }) })
+                )
+              ),
+              React__default.createElement(
+                'div',
+                { className: styles.recommendTopBody },
+                React__default.createElement(
+                  'div',
+                  { className: styles.topTitle },
+                  article.title
+                ),
+                React__default.createElement(
+                  'p',
+                  { className: styles.topBody },
+                  article.summary
+                ),
+                React__default.createElement(
+                  'a',
+                  { href: '/view/' + article.url.current + '?utm_source=website&utm_medium=dynamic_content&utm_campaign=in_feed_unit', className: styles.topLink },
+                  '>> ',
+                  'Read Article'
+                )
+              )
+            );
+          } else {
+            return React__default.createElement(
+              'div',
+              { key: article._id + ('-' + index), className: styles.smContainer },
+              React__default.createElement(
+                'div',
+                { className: styles.category },
+                contentMapping[article.contentCategory.name.toLowerCase()] ? contentMapping[article.contentCategory.name.toLowerCase()] : article.contentCategory.name
+              ),
+              React__default.createElement(
+                'a',
+                { href: '/view/' + article.url.current + '?utm_source=website&utm_medium=dynamic_content&utm_campaign=in_feed_unit' },
+                React__default.createElement(
+                  'div',
+                  { className: styles.smImage },
+                  React__default.createElement('img', { src: urlFor({ source: article.thumbnail, client: client, imageHeight: 270, imageWidth: 480 }) })
+                ),
+                React__default.createElement(
+                  'div',
+                  { className: styles.title },
+                  article.title
+                )
+              )
+            );
+          }
+        })
+      )
+    ),
+    loaded === 'failed' && React__default.createElement(
+      'section',
+      { id: 'related-content-section', className: 'my-1' },
+      (article.relatedArticle || RelevantTopics({ article: article })) && React__default.createElement(
+        'p',
+        { className: 'mb-0' },
+        React__default.createElement(
+          'b',
+          null,
+          'Related Content:'
+        )
+      ),
+      React__default.createElement(RelevantTopics, { article: article, cpModificationRequired: cpModificationRequired, Settings: props.Settings }),
+      React__default.createElement(
+        'div',
+        { className: 'pt-2' },
+        React__default.createElement(RelatedArticle, {
+          articles: article.relatedArticle,
+          client: client,
+          fallbackImage: props.Settings.logo,
+          showRelatedArticleFallbackImage: props.showRelatedArticleFallbackImage
+        })
+      )
+    )
+  );
+};
+
+var RelevantTopics = function RelevantTopics(props) {
+  var article = props.article,
+      cpModificationRequired = props.cpModificationRequired;
+  var content_placement = article.content_placement,
+      documentGroupMapping = article.documentGroupMapping,
+      issueGroup = article.issueGroup;
+
+  if (content_placement && content_placement.length > 0 || documentGroupMapping && documentGroupMapping.length > 0) {
+    var relatedLinks = [];
+    if (documentGroupMapping && documentGroupMapping.length > 0) {
+      documentGroupMapping.forEach(function (documentGroup) {
+        if (documentGroup.isShow === false || documentGroup.excludeRelatedContents) {
+          return null;
+        }
+        if (documentGroup.parent) {
+          relatedLinks = [].concat(_toConsumableArray(relatedLinks), [{
+            label: documentGroup.name,
+            href: cpModificationRequired ? getDocumentGroupUrl(documentGroup) : documentGroup.parent.identifier && documentGroup.parent.identifier.current && !documentGroup.path.includes('/') ? '/' + documentGroup.parent.identifier.current + '/' + documentGroup.path : '/' + documentGroup.path
+          }]);
+        }
+      });
+    }
+    if (content_placement && content_placement.length > 0) {
+      content_placement.filter(function (item) {
+        return item.path !== 'news';
+      }).forEach(function (cp) {
+        if (cp.excludeRelatedContents) {
+          return null;
+        }
+        var cp_url = cpModificationRequired ? getContentPlacementUrl(cp) : cp.path;
+        var href = '/' + cp_url;
+        relatedLinks = [].concat(_toConsumableArray(relatedLinks), [{ label: cp.name, href: href }]);
+      });
+    }
+    if (issueGroup && issueGroup.name && issueGroup.identifier && issueGroup.identifier.current && issueGroup.parent && issueGroup.parent.identifier && issueGroup.parent.identifier.current) {
+      var _props$Settings$issue = props.Settings.issueMapping,
+          issueMapping = _props$Settings$issue === undefined ? '/publications' : _props$Settings$issue;
+
+      relatedLinks = [].concat(_toConsumableArray(relatedLinks), [{ label: issueGroup.name, href: issueMapping + '/' + issueGroup.parent.identifier.current + '/' + issueGroup.identifier.current }]);
+    }
+    if (relatedLinks && relatedLinks.length > 0) {
+      return React__default.createElement(
+        'div',
+        null,
+        relatedLinks.map(function (relatedLink, index) {
+          if (relatedLink && relatedLink.href && relatedLink.label) {
+            return React__default.createElement(
+              'span',
+              { key: relatedLink.label, className: 'related-link' },
+              React__default.createElement(
+                'a',
+                { className: 'related-links', style: { color: 'blue' }, href: relatedLink.href },
+                relatedLink.label
+              ),
+              React__default.createElement(
+                'style',
+                { jsx: 'true' },
+                '\n                      .related-link:not(:first-child):before {\n                        content: \' | \';\n                      }\n                    '
+              )
+            );
+          }
+        })
+      );
+    }
+    return null;
+  }
+  return null;
+};
+
+var checkDocGroupMappingForSeries = function checkDocGroupMappingForSeries(docGroupArray) {
+
+  for (var i = 0; i < docGroupArray.length; i++) {
+    if (docGroupArray[i].isSeries) {
+      return docGroupArray[i];
+    }
+  }
+
+  return false;
+};
+
+var Article = React__default.memo(forwardRef(function (props, ref) {
+  var onVote = function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(nodeKey, selectedChoice) {
+      var response, result;
+      return regenerator.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _context.next = 2;
+              return fetch('/api/polls/vote', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: _JSON$stringify({ articleId: props.article._id, nodeKey: nodeKey, selectedChoice: selectedChoice, body: articleBody })
+              });
+
+            case 2:
+              response = _context.sent;
+
+              if (!response.ok) {
+                _context.next = 11;
+                break;
+              }
+
+              _context.next = 6;
+              return response.json();
+
+            case 6:
+              result = _context.sent;
+
+              setArticleBody(result.body);
+
+              console.log('Voted successfully');
+              _context.next = 12;
+              break;
+
+            case 11:
+              console.log('Unable to vote!');
+
+            case 12:
+            case 'end':
+              return _context.stop();
+          }
+        }
+      }, _callee, this);
+    }));
+
+    return function onVote(_x, _x2) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+
+  var article = props.article,
+      Ads = props.Ads,
+      showRelatedArticles = props.showRelatedArticles,
+      _props$hideFBShare = props.hideFBShare,
+      hideFBShare = _props$hideFBShare === undefined ? false : _props$hideFBShare,
+      _props$hidePinterestS = props.hidePinterestShare,
+      hidePinterestShare = _props$hidePinterestS === undefined ? false : _props$hidePinterestS,
+      onChangeArticle = props.onChangeArticle,
+      _props$showSocialShar = props.showSocialShare,
+      showSocialShare = _props$showSocialShar === undefined ? true : _props$showSocialShar;
+  var client = props.client,
+      pageview = props.pageview,
+      videoAccountIDs = props.videoAccountIDs,
+      drupalLeadSettings = props.drupalLeadSettings,
+      currentPage = props.currentPage,
+      _props$showAuthorDeta = props.showAuthorDetails,
+      showAuthorDetails = _props$showAuthorDeta === undefined ? false : _props$showAuthorDeta,
+      audioAutoplay = props.audioAutoplay,
+      _props$article = props.article,
+      title = _props$article.title,
+      _props$article$passwo = _props$article.passwordLock,
+      passwordLock = _props$article$passwo === undefined ? false : _props$article$passwo,
+      authorDetails = _props$article.authorDetails,
+      pageNumber = _props$article.pageNumber,
+      published = _props$article.published,
+      _props$article$showPu = _props$article.showPublished,
+      showPublished = _props$article$showPu === undefined ? true : _props$article$showPu,
+      body = _props$article.body,
+      thumbnail = _props$article.thumbnail,
+      content_placement = _props$article.content_placement,
+      _props$article$url = _props$article.url;
+  _props$article$url = _props$article$url === undefined ? {
+    current: ''
+  } : _props$article$url;
+  var url = _props$article$url.current,
+      issue = _props$article.issue,
+      source = _props$article.source,
+      documentGroupMapping = _props$article.documentGroupMapping,
+      issueGroup = _props$article.issueGroup,
+      showIsi = _props$article.showIsi,
+      isi = _props$article.isi,
+      _props$article$displa = _props$article.display_summary,
+      display_summary = _props$article$displa === undefined ? true : _props$article$displa,
+      regionalPages = props.regionalPages,
+      nationalPage = props.nationalPage,
+      ISIContent = props.ISIContent,
+      shareOptions = props.shareOptions,
+      cpModificationRequired = props.cpModificationRequired,
+      authorPrefix = props.authorPrefix,
+      _props$lgContextAd = props.lgContextAd,
+      lgContextAd = _props$lgContextAd === undefined ? false : _props$lgContextAd,
+      queueData = props.queueData,
+      _props$sponsoredFlag = props.sponsoredFlag,
+      sponsoredFlag = _props$sponsoredFlag === undefined ? false : _props$sponsoredFlag,
+      _props$authorImgHeigh = props.authorImgHeight,
+      authorImgHeight = _props$authorImgHeigh === undefined ? 270 : _props$authorImgHeigh;
+      props.active;
+      var _props$refreshFlag = props.refreshFlag,
+      refreshFlag = _props$refreshFlag === undefined ? false : _props$refreshFlag,
+      disqusConfig = props.disqusConfig,
+      showDisqus = props.showDisqus,
+      _props$downloadCitati = props.downloadCitation,
+      downloadCitation = _props$downloadCitati === undefined ? false : _props$downloadCitati,
+      _props$useSegmentReco = props.useSegmentRecommendedArticles,
+      useSegmentRecommendedArticles = _props$useSegmentReco === undefined ? false : _props$useSegmentReco;
+  var sliderData = props.sliderData;
+
+  var disableEpisodeNumber = false;
+  if (article && article.documentGroup && article.documentGroup.disableEpisodeNumber === true) {
+    disableEpisodeNumber = true;
+  }
+  var logicforDisplayingEpisodeNumber = disableEpisodeNumber ? false : true;
+  var targeting = getTargeting(props);
+  //remove slider data if toggled
+  if (article && article.documentGroup && article.documentGroup.hideSeriesSlider === true) {
+    sliderData = null;
+  }
+
+  //next video url
+  if (sliderData) {
+    var nextArticle = void 0;
+    sliderData.forEach(function (data, index) {
+      if (data.url.current === props.article.url.current) {
+        nextArticle = index + 1;
+      }
+    });
+
+    if (nextArticle && sliderData[nextArticle]) {
+      article.nextVideo = sliderData[nextArticle].url.current;
+    }
+  }
+
+  //if showSocialShare is not disabled for entire site, check article taxonomy, docgroup, authors for showSocialShare === false
+  if (showSocialShare) {
+    showSocialShare = getSocialShareDisableFlag(props.article);
+  }
+
+  //If sponsored flag, disable contextual ads
+  if (sponsoredFlag) {
+    article.contextualVideoAD = false;
+    article.contextualAD = false;
+    showRelatedArticles = false;
+  }
+  if (article.disableRelatedContent) {
+    showRelatedArticles = false;
+  }
+  //This was being done in ArticleQueue2 which wasnt effecting articles excluded from infinite scroll, moved inside article component
+  if (!sponsoredFlag && Ads.getVideoContextualAD) {
+    article.contextualVideoAD = Ads.getVideoContextualAD(getTargeting(props, 'in-context_video'));
+  }
+  if (!sponsoredFlag && Ads.getNativeContextualAD) {
+    article.contextualAD = Ads.getNativeContextualAD(getTargeting(props, 'native-ad'));
+  }
+
+  var _useState = useState(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      contextualADFlag = _useState2[0],
+      setContextualADFlag = _useState2[1];
+  //  Setting new Flag 'visibleFlag' to know when the article is visible so that new contextual ad can be appended into DOM.
+
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      visibleFlag = _useState4[0],
+      setVisibleFlag = _useState4[1];
+
+  var summary = getArticleSummary(props.article);
+
+  var _useState5 = useState(1),
+      _useState6 = _slicedToArray(_useState5, 2),
+      auth = _useState6[0],
+      setAuth = _useState6[1];
+
+  var _useState7 = useState(''),
+      _useState8 = _slicedToArray(_useState7, 2),
+      passwordKey = _useState8[0],
+      setPasswordKey = _useState8[1];
+
+  var _useState9 = useState(body),
+      _useState10 = _slicedToArray(_useState9, 2),
+      articleBody = _useState10[0],
+      setArticleBody = _useState10[1];
+
+  var _useState11 = useState(0),
+      _useState12 = _slicedToArray(_useState11, 2),
+      containerHeight = _useState12[0],
+      setContainerHeight = _useState12[1];
+
+  var _useState13 = useState(true),
+      _useState14 = _slicedToArray(_useState13, 2);
+      _useState14[0];
+      var setPreviewAd = _useState14[1];
+
+  var _useState15 = useState(props.index === 0),
+      _useState16 = _slicedToArray(_useState15, 2),
+      isFirstArticle = _useState16[0],
+      setIsFirstArticle = _useState16[1];
+
+  useEffect(function () {
+    var path = window && window.location && window.location.search;
+    // Setting flag for Ad-preview URLs
+    setPreviewAd(path.split('&').some(function (param) {
+      return param.includes('creativeId');
+    }));
+    setContainerHeight(window.innerHeight);
+  }, []);
+
+  var isCutomPage = function isCutomPage(article) {
+    var url = article.url.current;
+
+    if (regionalPages || nationalPage) {
+      return regionalPages.includes(url) || nationalPage === url;
+    } else {
+      return false;
+    }
+  };
+  var renderAuthorBiography = function renderAuthorBiography(biography) {
+    if (biography) {
+      return React__default.createElement(BlockContent, _extends({
+        serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, false, contextualADFlag),
+        blocks: [biography]
+      }, client.config()));
+    }
+  };
+
+  var getAbstract = function getAbstract() {
+    return article.abstract && article.abstract.map(function (block) {
+      if (block.children) return block.children.map(function (child) {
+        if (child._type === 'span') return child.text;
+      });
+    }).join(' ');
+  };
+
+  var renderIsiContent = function renderIsiContent(article) {
+    var url = article.url.current;
+
+    if (regionalPages && ISIContent && regionalPages.includes(url)) {
+      return React__default.createElement(ISIContent, null);
+    } else if (nationalPage === url && ISIContent) {
+      return React__default.createElement(ISIContent, { national: true });
+    }
+    return null;
+  };
+  var generateRIS = function generateRIS() {
+    var fileContent = 'TY  - JOUR\n';
+    if (issue) {
+      if (article.title) {
+        fileContent += 'TI  - ' + article.title + '\n'; //Title - TI
+        fileContent += 'T1  - ' + article.title + '\n'; //Title - T1
+      }
+      if (authorDetails && authorDetails.length) {
+        authorDetails.map(function (authorDetail, index) {
+          return fileContent += 'AU  - ' + (authorDetail.firstName && authorDetail.lastName ? authorDetail.lastName + ', ' + authorDetail.firstName : '' + authorDetail.displayName) + '\n';
+        } //Author
+        );
+      }
+      if (issue.publication && issue.publication.name) {
+        fileContent += 'T2  - ' + issue.publication.name + '\n'; //Secondary Title - T2
+        fileContent += 'JF  - ' + issue.publication.name + '\n'; //Journal Name - JF
+      }
+      if (issue.name) {
+        fileContent += 'T3  - ' + issue.name + '\n'; //Issue Name - T3
+      }
+      if (issue.abbreviatedJournal) {
+        fileContent += 'JO  - ' + issue.abbreviatedJournal + '\n'; //Journal Name - JO
+      }
+      if (article.abstract) fileContent += 'AB - ' + getAbstract() + '\n'; //Abstract - AB
+      if (article.abstract) fileContent += 'N2  - ' + getAbstract() + '\n'; //Abstract - N2
+      if (issue.issueNumber) fileContent += 'IS  - ' + issue.issueNumber + '\n'; //Issue Number - IS
+      fileContent += 'PB  - MJH Life Sciences\n'; //Publisher - PB
+      if (issue.year) fileContent += 'PY  - ' + issue.year + '\n'; //Published Year - PY
+      if (issue.volume) fileContent += 'VL  - ' + issue.volume + '\n'; //Volume - VL
+      if (issue.url) fileContent += 'L1  - ' + issue.url + '\n'; //Link to PDF - L1
+      if (shareOptions && shareOptions.shareBaseUrl) {
+        fileContent += 'L2  - ' + (shareOptions.shareBaseUrl + url) + '\n'; //Link to Full-text - L2
+        fileContent += 'UR  - ' + (shareOptions.shareBaseUrl + url) + '\n'; //Doc URL - UR
+      }
+      if (props.Website) fileContent += 'LK  - https://' + props.Website.liveDomain + '\n'; //Website Link - LK
+      if (issue.isbn_issn) {
+        fileContent += 'SN  - ' + issue.isbn_issn + '\n'; //ISSN/ISBN - TI
+      }
+      if (pageNumber) {
+        if (pageNumber.includes('-')) {
+          fileContent += 'SP  - ' + pageNumber.split('-')[0] + '\n'; //Start Page - SP
+          fileContent += 'EP  - ' + pageNumber.split('-')[1] + '\n'; //End Page - EP
+        } else {
+          fileContent += 'SP  - ' + pageNumber + '\n';
+        }
+      }
+      if (article.published) fileContent += 'Y1  - ' + moment(published).format('DD-MMMM-YYYY') + '\n'; //Primary Date - Y1
+      fileContent += 'Y2  - ' + moment().format('DD-MMMM-YYYY') + '\n'; //Access Date - Y2
+    }
+    fileContent += 'ER  -\n'; //End of Record
+    return fileContent;
+  };
+  var getAuthorList = function getAuthorList() {
+    var authorList = '';
+    if (authorDetails && authorDetails.length > 0) {
+      authorDetails.map(function (author) {
+        if (author.lastName && author.firstName) authorList += author.lastName + ',' + author.firstName + ';';else if (author.displayName) authorList += author.displayName + ';';
+      });
+    }
+    return authorList;
+  };
+  var downloadRIS = function downloadRIS() {
+    var fileContent = generateRIS();
+    var file = new File([fileContent], 'citation-' + url + '.ris', { type: 'application/x-research-info-systems;charset=utf-8' });
+    FileSaver.saveAs(file, 'citation-' + url + '.ris');
+  };
+
+  var RelevantTopics = function RelevantTopics() {
+    if (content_placement && content_placement.length > 0 || documentGroupMapping && documentGroupMapping.length > 0) {
+      var relatedLinks = [];
+      if (documentGroupMapping && documentGroupMapping.length > 0) {
+        documentGroupMapping.forEach(function (documentGroup) {
+          if (documentGroup.isShow === false || documentGroup.excludeRelatedContents) {
+            return null;
+          }
+          if (documentGroup.parent) {
+            relatedLinks = [].concat(_toConsumableArray(relatedLinks), [{
+              label: documentGroup.name,
+              href: cpModificationRequired ? getDocumentGroupUrl(documentGroup) : documentGroup.parent.identifier && documentGroup.parent.identifier.current && !documentGroup.path.includes('/') ? '/' + documentGroup.parent.identifier.current + '/' + documentGroup.path : '/' + documentGroup.path
+            }]);
+          }
+        });
+      }
+      if (content_placement && content_placement.length > 0) {
+        content_placement.filter(function (item) {
+          return item.path !== 'news';
+        }).forEach(function (cp) {
+          if (cp.excludeRelatedContents) {
+            return null;
+          }
+          var cp_url = cpModificationRequired ? getContentPlacementUrl(cp) : cp.path;
+          var href = '/' + cp_url;
+          relatedLinks = [].concat(_toConsumableArray(relatedLinks), [{ label: cp.name, href: href }]);
+        });
+      }
+      if (issueGroup && issueGroup.name && issueGroup.identifier && issueGroup.identifier.current && issueGroup.parent && issueGroup.parent.identifier && issueGroup.parent.identifier.current) {
+        var _props$Settings$issue = props.Settings.issueMapping,
+            issueMapping = _props$Settings$issue === undefined ? '/publications' : _props$Settings$issue;
+
+        relatedLinks = [].concat(_toConsumableArray(relatedLinks), [{ label: issueGroup.name, href: issueMapping + '/' + issueGroup.parent.identifier.current + '/' + issueGroup.identifier.current }]);
+      }
+      if (relatedLinks && relatedLinks.length > 0) {
+        return React__default.createElement(
+          'div',
+          null,
+          relatedLinks.map(function (relatedLink, index) {
+            if (relatedLink && relatedLink.href && relatedLink.label) {
+              return React__default.createElement(
+                'span',
+                { key: index, className: 'related-link' },
+                React__default.createElement(
+                  'a',
+                  { className: 'related-links', style: { color: 'blue' }, href: relatedLink.href },
+                  relatedLink.label
+                ),
+                React__default.createElement(
+                  'style',
+                  { jsx: 'true' },
+                  '\n                          .related-link:not(:first-child):before {\n                            content: \' | \';\n                          }\n                        '
+                )
+              );
+            }
+          })
+        );
+      }
+      return null;
+    }
+    return null;
+  };
+
+  var RelatedContent = React__default.memo(function () {
+    return React__default.createElement(
+      'div',
+      null,
+      useSegmentRecommendedArticles ? React__default.createElement(Recommended, {
+        client: client,
+        article: article,
+        index: props.index,
+        Settings: props.Settings,
+        showRelatedArticleFallbackImage: props.showRelatedArticleFallbackImage,
+        cpModificationRequired: cpModificationRequired
+      }) : React__default.createElement(
+        'section',
+        { id: 'related-content-section', className: 'my-1' },
+        (article.relatedArticle || RelevantTopics()) && React__default.createElement(
+          'p',
+          { className: 'mb-0' },
+          React__default.createElement(
+            'b',
+            null,
+            'Related Content:'
+          )
+        ),
+        React__default.createElement(RelevantTopics, null),
+        React__default.createElement(
+          'div',
+          { className: 'pt-2' },
+          React__default.createElement(RelatedArticle, {
+            articles: article.relatedArticle,
+            client: client,
+            fallbackImage: props.Settings.logo,
+            showRelatedArticleFallbackImage: props.showRelatedArticleFallbackImage
+          })
+        )
+      )
+    );
+  });
+
+  var form = function form() {
+    return React__default.createElement(
+      React__default.Fragment,
+      null,
+      React__default.createElement(
+        Head,
+        null,
+        React__default.createElement('meta', { name: 'googlebot', content: 'noindex' })
+      ),
+      React__default.createElement(
+        'div',
+        { className: 'mt-5', style: { display: 'flex', justifyContent: 'center', alignItems: 'center' } },
+        React__default.createElement(
+          Form,
+          {
+            inline: true,
+            onSubmit: function onSubmit(e) {
+              e.preventDefault();
+            } },
+          React__default.createElement(FormControl, { type: 'text', className: 'mr-sm-2', value: passwordKey, onChange: function onChange(e) {
+              return setPasswordKey(e.target.value);
+            }, placeholder: 'Password' }),
+          React__default.createElement(
+            Button,
+            {
+              variant: 'primary',
+              onClick: function onClick() {
+                if (passwordKey === props.article.password) {
+                  setAuth(2);
+                } else {
+                  alert('Incorrect Password');
+                }
+              } },
+            'Submit'
+          )
+        )
+      )
+    );
+  };
+
+  var renderBlockContent = function renderBlockContent(payload, meta, authorImgHeight) {
+    var _payload = payload,
+        body = _payload.body;
+
+    var indexes = findIndex(body);
+    var seriesInfo = checkIfMediaSeriesHasVideo(article);
+    var isMediaSeries = false;
+    if (article.documentGroup && article.documentGroup.isSeries) {
+      isMediaSeries = true;
+    } else if (!article.documentGroup && article.documentGroupMapping && checkDocGroupMappingForSeries(article.documentGroupMapping)) {
+      isMediaSeries = true;
+    }
+
+    if (indexes.length >= 2 && body.length > 3 && payload.contextualAD && payload.contextualVideoAD) {
+      payload = _extends({}, payload, {
+        contextualAD: _extends({}, payload.contextualAD, {
+          slotId: (payload.contextualAD.slotId || 'contextual_ad') + '-' + payload._id
+        }),
+        contextualVideoAD: _extends({}, payload.contextualVideoAD, {
+          slotId: (payload.contextualVideoAD.slotId || 'in-context_video') + '-' + payload._id
+        })
+      });
+      var selectedIndex = !(indexes.length % 2) ? indexes.length / 2 + 1 : Math.round(indexes.length / 2);
+      if (seriesInfo.hasVideo) {
+        selectedIndex = seriesInfo.videoIndex;
+      }
+
+      var checkIsVideoAdFound = function checkIsVideoAdFound(isFound) {
+        if (!isFound) {
+          var parent = document.getElementById('contextual-video-ad-' + payload._id);
+          parent.style.height = '0%';
+          parent.style.width = '0%';
+          parent.style.display = 'none';
+          setContextualADFlag(false);
+        } else {
+          setContextualADFlag(true);
+        }
+      };
+      return React__default.createElement(
+        React__default.Fragment,
+        null,
+        React__default.createElement(BlockContent, _extends({
+          serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, isMediaSeries, contextualADFlag, null, article.Ads, targeting, article, meta, authorPrefix, authorImgHeight, audioAutoplay),
+          blocks: [].concat(_toConsumableArray(articleBody.slice(0, selectedIndex))),
+          imageOptions: { w: 320, h: 240, fit: 'max' }
+        }, client.config())),
+        React__default.createElement('span', { className: 'clearfix' }),
+        isMediaSeries && sliderData && seriesInfo.hasVideo && React__default.createElement(SeriesSlider, { dataset: sliderData, client: client, nowPlaying: article.title, displayEpisodeNumber: logicforDisplayingEpisodeNumber }),
+        React__default.createElement(
+          'div',
+          { id: 'contextual-native-ad-' + payload._id, className: 'contextual-native-ad' },
+          React__default.createElement(DFPAdSlot, _extends({}, payload.contextualAD, { refreshFlag: refreshFlag }))
+        ),
+        React__default.createElement(
+          'style',
+          { jsx: 'true' },
+          '\n              .contextual-native-ad {\n                margin-bottom: 1rem;\n              }\n            '
+        ),
+        React__default.createElement('span', { className: 'clearfix' }),
+        React__default.createElement(
+          'div',
+          { id: 'contextual-video-ad-' + payload._id, className: 'contextual-video-ad' },
+          React__default.createElement(DFPAdSlot, _extends({}, payload.contextualVideoAD, { refreshFlag: refreshFlag, checkIsAdFound: checkIsVideoAdFound }))
+        ),
+        React__default.createElement(BlockContent, _extends({
+          serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, isMediaSeries, null, null, article.Ads, targeting, article, meta, authorPrefix, authorImgHeight, audioAutoplay),
+          blocks: [].concat(_toConsumableArray(articleBody.slice(selectedIndex))),
+          imageOptions: { w: 320, h: 240, fit: 'max' }
+        }, client.config()))
+      );
+    } else if (indexes.length >= 2 && body.length >= 3 && payload.contextualAD && !payload.contextualVideoAD) {
+      payload = _extends({}, payload, {
+        contextualAD: _extends({}, payload.contextualAD, {
+          slotId: (payload.contextualAD.slotId || 'contextual_ad') + '-' + payload._id,
+          className: 'ADFluid',
+          //  Fetching new contextual targeting based on the current active article.
+          targeting: getTargeting(props, 'native-ad'),
+          // Adding new ad size for large contextual ad for desktop screen width >= 1400
+          sizes: lgContextAd ? [[728, 90], 'fluid', [300, 100]] : ['fluid', [300, 100]],
+          sizeMapping: lgContextAd ? [{
+            viewport: [1400, 0],
+            sizes: [[728, 90], 'fluid', [300, 100]]
+          }, { viewport: [0, 0], sizes: ['fluid', [300, 100]] }] : [{ viewport: [0, 0], sizes: ['fluid', [300, 100]] }]
+        })
+      });
+      var _selectedIndex = !(indexes.length % 2) ? indexes.length / 2 + 1 : Math.round(indexes.length / 2);
+      if (seriesInfo.hasVideo) {
+        _selectedIndex = seriesInfo.videoIndex;
+      }
+      return React__default.createElement(
+        React__default.Fragment,
+        null,
+        React__default.createElement(BlockContent, _extends({
+          serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, isMediaSeries, contextualADFlag, null, article.Ads, targeting, article, meta, authorPrefix, authorImgHeight, audioAutoplay),
+          blocks: [].concat(_toConsumableArray(articleBody.slice(0, _selectedIndex))),
+          imageOptions: { w: 320, h: 240, fit: 'max' }
+        }, client.config())),
+        contextualADFlag && React__default.createElement('span', { className: 'clearfix' }),
+        isMediaSeries && sliderData && seriesInfo.hasVideo && React__default.createElement(SeriesSlider, { dataset: sliderData, client: client, nowPlaying: article.title, displayEpisodeNumber: logicforDisplayingEpisodeNumber }),
+        (visibleFlag || queueData && queueData.length === 1 || !props.infiniteScroll) && React__default.createElement(
+          React__default.Fragment,
+          null,
+          React__default.createElement(
+            'div',
+            { id: 'contextual-native-ad-' + payload._id, className: 'contextual-native-ad' },
+            React__default.createElement(DFPAdSlot, _extends({}, payload.contextualAD, { refreshFlag: refreshFlag }))
+          ),
+          React__default.createElement(
+            'style',
+            { jsx: 'true' },
+            '\n                  .contextual-native-ad {\n                    margin-bottom: 1rem;\n                  }\n                '
+          )
+        ),
+        contextualADFlag && React__default.createElement('span', { className: 'clearfix' }),
+        React__default.createElement(BlockContent, _extends({
+          serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, isMediaSeries, null, null, article.Ads, targeting, article, meta, authorPrefix, authorImgHeight, audioAutoplay),
+          blocks: [].concat(_toConsumableArray(articleBody.slice(_selectedIndex))),
+          imageOptions: { w: 320, h: 240, fit: 'max' }
+        }, client.config()))
+      );
+    } else if (indexes.length >= 2 && body.length > 3 && payload.contextualVideoAD && !payload.contextualAD) {
+      payload = _extends({}, payload, {
+        contextualVideoAD: _extends({}, payload.contextualVideoAD, {
+          slotId: (payload.contextualVideoAD.slotId || 'in-context_video') + '-' + payload._id
+        })
+      });
+      var _selectedIndex2 = !(indexes.length % 2) ? indexes.length / 2 + 1 : Math.round(indexes.length / 2);
+      if (seriesInfo.hasVideo) {
+        _selectedIndex2 = seriesInfo.videoIndex;
+      }
+      var checkIsAdFound = function checkIsAdFound(isFound) {
+        if (!isFound) {
+          var parent = document.getElementById('contextual-video-ad-' + payload._id);
+          parent.style.height = '0%';
+          parent.style.width = '0%';
+          parent.style.display = 'none';
+          setContextualADFlag(false);
+        } else {
+          if (body && body[1] && body[1]._type === 'figure') {
+            setContextualADFlag(true);
+          }
+        }
+      };
+
+      return React__default.createElement(
+        React__default.Fragment,
+        null,
+        React__default.createElement(BlockContent, _extends({
+          serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, isMediaSeries, contextualADFlag, null, article.Ads, targeting, article, meta, authorPrefix, authorImgHeight, audioAutoplay),
+          blocks: [].concat(_toConsumableArray(articleBody.slice(0, _selectedIndex2))),
+          imageOptions: { w: 320, h: 240, fit: 'max' }
+        }, client.config())),
+        React__default.createElement('span', { className: 'clearfix' }),
+        isMediaSeries && sliderData && seriesInfo.hasVideo && React__default.createElement(SeriesSlider, { dataset: sliderData, client: client, nowPlaying: article.title, displayEpisodeNumber: logicforDisplayingEpisodeNumber }),
+        React__default.createElement(
+          'div',
+          { id: 'contextual-video-ad-' + payload._id, className: 'contextual-video-ad' },
+          React__default.createElement(DFPAdSlot, _extends({}, payload.contextualVideoAD, { refreshFlag: refreshFlag, checkIsAdFound: checkIsAdFound }))
+        ),
+        React__default.createElement(BlockContent, _extends({
+          serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, isMediaSeries, null, null, article.Ads, targeting, article, meta, authorPrefix, authorImgHeight, audioAutoplay),
+          blocks: [].concat(_toConsumableArray(articleBody.slice(_selectedIndex2))),
+          imageOptions: { w: 320, h: 240, fit: 'max' }
+        }, client.config()))
+      );
+    } else {
+      var _selectedIndex3 = !(indexes.length % 2) ? indexes.length / 2 + 1 : Math.round(indexes.length / 2);
+      if (seriesInfo.hasVideo) {
+        _selectedIndex3 = seriesInfo.videoIndex;
+      }
+
+      return React__default.createElement(
+        'div',
+        null,
+        React__default.createElement(BlockContent, _extends({
+          serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, isMediaSeries, false, null, article.Ads, targeting, article, meta, authorPrefix, authorImgHeight, audioAutoplay),
+          blocks: article.documentGroup && article.documentGroup.isSeries ? [].concat(_toConsumableArray(articleBody.slice(0, _selectedIndex3))) : articleBody,
+          imageOptions: { w: 320, h: 240, fit: 'max' }
+        }, client.config())),
+        isMediaSeries && sliderData && seriesInfo.hasVideo && React__default.createElement(SeriesSlider, { dataset: sliderData, client: client, nowPlaying: article.title, displayEpisodeNumber: logicforDisplayingEpisodeNumber }),
+        article.documentGroup && article.documentGroup.isSeries && React__default.createElement(BlockContent, _extends({
+          serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, isMediaSeries, null, null, article.Ads, targeting, article, meta, authorPrefix, authorImgHeight, audioAutoplay),
+          blocks: [].concat(_toConsumableArray(articleBody.slice(_selectedIndex3))),
+          imageOptions: { w: 320, h: 240, fit: 'max' }
+        }, client.config()))
+      );
+    }
+  };
+
+  var checkIfVideoSeries = function checkIfVideoSeries(article) {
+    if (!article || !article.body) {
+      return false;
+    }
+
+    for (var i = 0; i < article.body.length; i++) {
+      var block = article.body[i];
+      if (block._type === 'youtubeGallery') {
+        return true;
+      }
+    }
+
+    return false;
+  };
+  var checkIfFormAssembly = function checkIfFormAssembly(article) {
+    if (!article || !article.body) {
+      return false;
+    }
+
+    for (var i = 0; i < article.body.length; i++) {
+      var block = article.body[i];
+      if (block._type === 'formassembly') {
+        return true;
+      }
+    }
+    return false;
+  };
+  var checkIfMediaSeriesHasVideo = function checkIfMediaSeriesHasVideo(article) {
+    var seriesInfo = { hasVideo: false, videoIndex: 0 };
+    if (!article || !article.body) {
+      return false;
+    }
+
+    for (var i = 0; i < article.body.length; i++) {
+      var block = article.body[i];
+      if (block._type == 'video' || block._type == 'youtube' || block._type == 'audio') {
+        seriesInfo.hasVideo = true;
+        seriesInfo.videoIndex = i + 1;
+      }
+    }
+
+    return seriesInfo;
+  };
+
+  var detail = function detail() {
+    var shareVia = shareOptions.shareVia,
+        shareSubject = shareOptions.shareSubject,
+        twitterSiteName = shareOptions.twitterSiteName,
+        shareImageDefault = shareOptions.shareImageDefault,
+        shareBaseUrl = shareOptions.shareBaseUrl;
+        shareOptions.shareSiteTitle;
+
+    var shareUrl = shareBaseUrl + props.article.url.current;
+    var shareTitle = article.title;
+    var shareSummary = article.summary;
+    var shareImage = thumbnail && thumbnail.asset ? urlFor({ client: props.client, source: thumbnail.asset }) : shareImageDefault;
+    var siteName = props.Website && props.Website.title ? props.Website.title : '';
+    var shareKeywords = getKeywords(props.article).join(',');
+
+    var meta = {
+      shareTitle: shareTitle,
+      shareSiteName: props.cache.siteSettingCache.name,
+      shareSummary: shareSummary,
+      shareUrl: shareUrl,
+      shareImage: shareImage,
+      shareVia: props.Settings.title,
+      shareKeywords: shareKeywords
+    };
+    if (!props.infiniteScroll) {
+      onChangeArticle = function onChangeArticle() {
+        return null;
+      };
+    }
+    var fetchCurrentEpisode = function fetchCurrentEpisode(sliderData, article) {
+      if (!sliderData) return null;
+      var episode = null;
+      sliderData.forEach(function (seriesArticle, index) {
+        if (seriesArticle.title === article.title) {
+          episode = index + 1;
+        }
+      });
+      return episode;
+    };
+    // pixels from bottom of window to change trigger visibility change
+    var triggerOffset = 20;
+    var isVideoSeries = checkIfVideoSeries(article);
+    var episodeNumber = fetchCurrentEpisode(sliderData, props.article);
+    var isMediaSeries = false;
+    var mediaSeriesName = '';
+    var seriesInfo = checkIfMediaSeriesHasVideo(article);
+    var isFormAssembly = checkIfFormAssembly(article);
+
+    if (article.documentGroup && article.documentGroup.isSeries) {
+      isMediaSeries = true;
+      mediaSeriesName = article.documentGroup.name;
+    }
+    if (!article.documentGroup && article.documentGroupMapping && checkDocGroupMappingForSeries(article.documentGroupMapping)) {
+      isMediaSeries = true;
+      mediaSeriesName = checkDocGroupMappingForSeries(article.documentGroupMapping).name;
+    }
+
+    return React__default.createElement(
+      React__default.Fragment,
+      null,
+      React__default.createElement(
+        VisibilitySensor,
+        {
+          partialVisibility: true,
+          offset: { bottom: triggerOffset, top: containerHeight && containerHeight },
+          onChange: function onChange(isVisible) {
+            if (isVisible && !isFirstArticle) {
+              var pageviewProperties = _extends({}, targeting, {
+                category: article && article.category ? article.category.name : ''
+              });
+              onChangeArticle(url, meta, pageviewProperties);
+              setVisibleFlag(function () {
+                return true;
+              });
+            }
+            if (isFirstArticle) {
+              setIsFirstArticle(false);
+            }
+          } },
+        React__default.createElement(
+          'div',
+          { id: 'article__block', style: { position: 'relative' }, ref: ref },
+          React__default.createElement(PixelTrackingArticle, { article: article, infiniteScroll: props.infiniteScroll }),
+          React__default.createElement(
+            'div',
+            { className: 'video-detail', style: { marginBottom: isCutomPage(props.article) || showIsi && Array.isArray(isi) && isi.length > 0 ? '15rem' : 0 } },
+            issue && React__default.createElement(
+              Head,
+              null,
+              article.title && React__default.createElement('meta', { name: 'citation_title', content: article.title }),
+              published && React__default.createElement('meta', { name: 'citation_date', content: moment(published).format('LL') }),
+              issue.year && React__default.createElement('meta', { name: 'citation_year', content: issue.year }),
+              issue.isbn_issn && React__default.createElement('meta', { name: 'citation_isbn', content: issue.isbn_issn }),
+              article.abstract && React__default.createElement('meta', { name: 'citation_abstract', content: getAbstract() }),
+              React__default.createElement('meta', { name: 'citation_author', content: getAuthorList() }),
+              issue.pdf && React__default.createElement('meta', { name: 'citation_pdf_url', content: urlForFile({ asset: issue.pdf }) })
+            ),
+            isVideoSeries && renderBlockContent(article, meta, authorImgHeight),
+            !isVideoSeries && React__default.createElement(
+              'div',
+              null,
+              isMediaSeries && React__default.createElement(
+                'p',
+                { style: { fontSize: '14px' } },
+                disableEpisodeNumber ? '' + mediaSeriesName : mediaSeriesName + ' - Episode ' + episodeNumber
+              ),
+              React__default.createElement(
+                'h1',
+                { className: 'page-title', style: { fontSize: '1.9rem' } },
+                title
+              )
+            ),
+            React__default.createElement(
+              'div',
+              { className: 'mb-3 doc-group-container', style: { display: 'flex', justifyContent: 'space-between', alignItems: 'flex-end' } },
+              React__default.createElement(
+                'style',
+                { jsx: 'true' },
+                '\n                    .social-ris-container {\n                      display: flex;\n                      justify-content: space-between;\n                    }\n                    @media screen and (max-width: 468px) {\n                      .video-detail .doc-group-container {\n                        flex-direction: column;\n                        align-items: flex-start !important;\n                      }\n                      .video-detail .doc-group {\n                        margin-top: 2rem;\n                        width: calc(100vw - 45px);\n                        align-items: center;\n                      }\n                      .video-detail .doc-group img,\n                      .doc-group p {\n                        max-width: calc(100vw - 45px) !important;\n                      }\n                      .social-ris-container {\n                        flex-direction: column;\n                      }\n                    }\n                    .author-details-img {\n                      margin-right: 10px;\n                      max-height: 250px;\n                      min-height: 150px;\n                      max-width: 250px;\n                      min-width: 150px;\n                      width: 100%;\n                      height: 100%;\n                      object-fit: contain;\n                    }\n                    .author-details-img-container {\n                      text-align: center;\n                    }\n                    .author-details-col {\n                      padding-left: 25px;\n                    }\n                    .left-wrap {\n                      width: 100%;\n                    }\n                  '
+              ),
+              React__default.createElement(
+                'div',
+                { className: 'left-wrap' },
+                !isVideoSeries && !isFormAssembly && showPublished && React__default.createElement(
+                  'div',
+                  null,
+                  React__default.createElement(
+                    'time',
+                    {
+                      className: 'meta-date',
+                      dateTime: moment(published).utc().format(moment.HTML5_FMT.DATETIME_LOCAL_MS) },
+                    moment(published).format('LL')
+                  )
+                )
+                /* Show Published date */
+                ,
+                React__default.createElement(
+                  'div',
+                  { className: 'mb-3' },
+                  !isVideoSeries && authorDetails && authorDetails.map(function (authorDetail, index) {
+                    return React__default.createElement(
+                      'span',
+                      { key: index },
+                      renderAuthor(authorDetail.displayName, authorDetail.url, index, authorDetails.length, authorPrefix, authorDetail.biography && renderAuthorBiography(authorDetail.biography[0]), authorDetail.profileImage && urlFor({ client: props.client, source: authorDetail.profileImage, imageHeight: authorImgHeight }), showAuthorDetails)
+                    );
+                  }),
+                  React__default.createElement(
+                    'div',
+                    null,
+                    source && React__default.createElement(
+                      'p',
+                      {
+                        style: {
+                          display: 'inline-block',
+                          padding: '0 .25rem',
+                          color: 'var(--franchise-primary, #484848)',
+                          borderRadius: '2px',
+                          fontWeight: 'bold',
+                          border: '2px solid var(--franchise-primary, #484848)'
+                        },
+                        className: 'source-label' },
+                      source
+                    )
+                  ),
+                  issue && React__default.createElement(
+                    'div',
+                    { className: 'volume-issue' },
+                    issue.publication && issue.publication.name && React__default.createElement(
+                      'span',
+                      { className: 'mb-0' },
+                      React__default.createElement(
+                        'b',
+                        null,
+                        issue.publication.name
+                      ),
+                      ',',
+                      ' '
+                    ),
+                    issue.name && React__default.createElement(
+                      'span',
+                      { className: 'mb-0' },
+                      issue.name,
+                      ', '
+                    ),
+                    issue.volume && React__default.createElement(
+                      'span',
+                      null,
+                      'Volume ' + issue.volume,
+                      ','
+                    ),
+                    issue.issueNumber && React__default.createElement(
+                      'span',
+                      null,
+                      ' Issue ' + issue.issueNumber
+                    )
+                  ),
+                  pageNumber && React__default.createElement(
+                    'div',
+                    { className: 'article-pageNumber' },
+                    'Pages: ' + pageNumber
+                  )
+                ),
+                React__default.createElement(
+                  'div',
+                  { className: 'social-ris-container' },
+                  !isVideoSeries && showSocialShare && React__default.createElement(
+                    'p',
+                    null,
+                    React__default.createElement(SocialShare, {
+                      shareUrl: shareUrl,
+                      shareTitle: shareTitle,
+                      shareVia: shareVia,
+                      shareSummary: shareSummary,
+                      shareSubject: shareSubject,
+                      shareImage: shareImage,
+                      size: 32,
+                      siteName: siteName,
+                      twitterSiteName: twitterSiteName,
+                      disableMeta: true,
+                      hidePinterest: hidePinterestShare,
+                      hideFacebook: hideFBShare
+                    })
+                  ),
+                  issue && downloadCitation && (!issue.hasOwnProperty('show_download_ris_button') || issue.show_download_ris_button !== false) && (!issue.publication || !issue.publication.hasOwnProperty('show_download_ris_button') || issue.publication.show_download_ris_button !== false) && React__default.createElement(
+                    Button,
+                    { className: 'ris-download-button', onClick: function onClick() {
+                        return downloadRIS();
+                      } },
+                    'Download RIS'
+                  )
+                )
+              ),
+              React__default.createElement(
+                'div',
+                null,
+                React__default.createElement(DocumentGroup, { article: props.article, client: props.client })
+              )
+            ),
+            !isVideoSeries && summary && display_summary && React__default.createElement(
+              'p',
+              null,
+              React__default.createElement(
+                'em',
+                null,
+                summary
+              )
+            ),
+            React__default.createElement(
+              'div',
+              { className: 'ad-box', style: { textAlign: 'center' } },
+              main_43 && !sponsoredFlag && props.article.Ads && props.article.Ads.length > 0 && props.article.Ads.map(function (ad, index) {
+                if (index === 0) {
+                  return React__default.createElement(
+                    'div',
+                    {
+                      key: index,
+                      id: 'addid-' + index,
+                      style: {
+                        display: 'flex',
+                        flex: '1 0 auto',
+                        justifyContent: 'center',
+                        alignItems: 'center',
+                        textAlign: 'center'
+                      } },
+                    ad.component
+                  );
+                }
+              })
+            ),
+            React__default.createElement(
+              'div',
+              { className: 'block-content mt-3' },
+              !isVideoSeries && renderBlockContent(article, meta),
+              React__default.createElement('div', { className: 'clearfix' }),
+              React__default.createElement(
+                'noscript',
+                null,
+                React__default.createElement(
+                  'div',
+                  { style: { display: 'flex', justifyContent: 'center' }, className: 'series-links' },
+                  props.article.seriesDetail && props.article.seriesDetail.prevUrl && React__default.createElement(
+                    'a',
+                    { className: 'mx-3', href: props.article.seriesDetail.prevUrl },
+                    'Previous ',
+                    props.article.seriesDetail.type
+                  ),
+                  props.article.seriesDetail && props.article.seriesDetail.nextUrl && React__default.createElement(
+                    'a',
+                    { className: 'mx-3', href: props.article.seriesDetail.nextUrl },
+                    'Next ',
+                    props.article.seriesDetail.type
+                  )
+                )
+              ),
+              React__default.createElement(
+                'div',
+                { className: 'downloads-container' },
+                issue && issue.pdf && React__default.createElement(
+                  'a',
+                  { rel: 'noopener', href: urlForFile({ asset: issue.pdf }), target: '_blank', title: 'Download issue' },
+                  React__default.createElement('img', { style: { margin: '1rem', maxHeight: '40px', maxWidth: '40px' }, src: '/download.png', alt: 'download issue' }),
+                  'Download Issue : ',
+                  issue.name
+                )
+              )
+            ),
+            React__default.createElement('div', { className: 'clearfix', style: { minHeight: '1px' } }),
+            article.documentGroup && article.documentGroup.isSeries && sliderData && !seriesInfo.hasVideo && React__default.createElement(
+              'div',
+              null,
+              false ,
+              React__default.createElement(SeriesSlider, { dataset: sliderData, client: client, nowPlaying: article.title, displayEpisodeNumber: logicforDisplayingEpisodeNumber })
+            ),
+            showRelatedArticles && !showIsi && React__default.createElement(RelatedContent, null),
+            disqusConfig && showDisqus && React__default.createElement(
+              'div',
+              { id: 'disqusContainer' },
+              React__default.createElement(DiscussionEmbed, {
+                shortname: disqusConfig.shortname,
+                config: {
+                  url: disqusConfig.url,
+                  identifier: disqusConfig.identifier,
+                  title: disqusConfig.title
+                }
+              })
+            )
+          ),
+          renderIsiContent(props.article)
+        )
+      ),
+      showIsi && Array.isArray(isi) && isi.length > 0 && React__default.createElement(
+        ISI,
+        null,
+        React__default.createElement(BlockContent, {
+          serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, false, false, null, article.Ads, targeting),
+          blocks: isi
+        })
+      ),
+      main_43 && !sponsoredFlag && props.article.Ads && props.article.Ads.length > 0 && props.article.Ads.map(function (ad, index) {
+        if (index > 0) {
+          return React__default.createElement(
+            'div',
+            { key: index, id: 'addid-' + index },
+            ad.component
+          );
+        }
+      }),
+      React__default.createElement(
+        'noscript',
+        null,
+        props.infiniteScroll && props.article.relatedArticle && props.article.relatedArticle[0] && props.article.relatedArticle[0].url && props.article.relatedArticle[0].url.current && React__default.createElement(
+          'div',
+          { style: { textAlign: 'center' } },
+          React__default.createElement(
+            'a',
+            { href: '/view/' + props.article.relatedArticle[0].url.current },
+            'Related Article ',
+            '>>>'
+          )
+        )
+      ),
+      props.infiniteScroll && React__default.createElement('hr', { className: 'article-seperater mb-5 mt-3' }),
+      React__default.createElement(Schema, { article: props.article, Website: props.Website, client: props.client })
+    );
+  };
+
+  if (passwordLock) {
+    if (auth === 2) {
+      return detail();
+    } else {
+      return form();
+    }
+  } else {
+    return detail();
+  }
+}), function (prevProps, nextProps) {
+  if (prevProps.article._id === nextProps.article._id) return true;
+  return false;
+});
+
+var _this$1 = undefined;
+
+var ArticleQueue = function ArticleQueue(props) {
+  var router = useRouter();
+
+  var _props$prevUrl = props.prevUrl,
+      prevUrl = _props$prevUrl === undefined ? '/' : _props$prevUrl,
+      Ads = props.Ads,
+      _props$maxListLength = props.maxListLength,
+      maxListLength = _props$maxListLength === undefined ? 10 : _props$maxListLength;
+      props.sponsoredTaxonomies;
+      var _props$cpModification = props.cpModificationRequired,
+      cpModificationRequired = _props$cpModification === undefined ? false : _props$cpModification,
+      _props$authorPrefix = props.authorPrefix,
+      authorPrefix = _props$authorPrefix === undefined ? 'authors' : _props$authorPrefix,
+      showRelatedArticles = props.showRelatedArticles,
+      canonicalTag = props.canonicalTag,
+      _props$disablePrevUrl = props.disablePrevUrlCheckContentPlacement,
+      disablePrevUrlCheckContentPlacement = _props$disablePrevUrl === undefined ? false : _props$disablePrevUrl;
+
+  var _useState = useState(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      containerHeight = _useState2[0],
+      setContainerHeight = _useState2[1];
+
+  useEffect(function () {
+    var checkFullScreen = function checkFullScreen() {
+      if (window.innerWidth == screen.width && window.innerHeight == screen.height) {
+        return true;
+      } else {
+        return false;
+      }
+    };
+    setContainerHeight(function () {
+      return window.innerHeight;
+    });
+    var handleResize = function handleResize() {
+      return !checkFullScreen() && setContainerHeight(function () {
+        return window.innerHeight;
+      });
+    };
+    window.addEventListener('resize', handleResize);
+    return function () {
+      return window.removeEventListener('resize', handleResize);
+    };
+  }, []);
+
+  var firstArticle = function firstArticle() {
+    var article = _Object$assign({}, props.article);
+    var targeting = getTargeting(props);
+    article.Ads = Ads.getRightItems(targeting);
+    return article;
+  };
+
+  var _useState3 = useState([firstArticle()]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      queueData = _useState4[0],
+      setQueueData = _useState4[1];
+
+  var _useState5 = useState(queueData[0]._id),
+      _useState6 = _slicedToArray(_useState5, 2),
+      active = _useState6[0],
+      setActive = _useState6[1];
+
+  var refreshAD = function refreshAD(path) {
+    var activeArticle = queueData.find(function (item) {
+      return item.url.current === path;
+    });
+    var targeting = getTargeting({ article: activeArticle, cpModificationRequired: cpModificationRequired, position: props.position, prevUrl: prevUrl, disablePrevUrlCheckContentPlacement: disablePrevUrlCheckContentPlacement });
+    if (!main_43) {
+      lib_3.getGoogletag().then(function (googletag) {
+        if (window.googletag && googletag.pubadsReady) {
+          var slots = googletag.pubads().getSlots();
+          slots.forEach(function (slot) {
+            var pos = slot.getTargeting('pos');
+            slot.clearTargeting();
+            _Object$keys(targeting).forEach(function (key) {
+              slot.setTargeting(key, targeting[key]);
+            });
+            slot.setTargeting('pos', pos);
+          });
+          lib_3.refresh();
+        }
+      });
+    }
+    //Refresh leaderboard ad on mobile
+    if (main_43) {
+      var leaderboardSlotId = '';
+      lib_3.getGoogletag().then(function (googletag) {
+        if (window.googletag && googletag.pubadsReady) {
+          var slots = googletag.pubads().getSlots();
+          slots.forEach(function (slot) {
+            var pos = slot.getTargeting('pos');
+            if (pos == 'top-mobile') {
+              //gets the slotId of the leaderboard ad to refresh
+              leaderboardSlotId = slot.getSlotId().getDomId();
+              slot.clearTargeting();
+              _Object$keys(targeting).forEach(function (key) {
+                slot.setTargeting(key, targeting[key]);
+              });
+              slot.setTargeting('pos', pos);
+            }
+          });
+          lib_3.refresh(leaderboardSlotId);
+        }
+      });
+    }
+  };
+
+  var hasVerticalScroll = function hasVerticalScroll() {
+    if (window.innerHeight) {
+      return document.body.offsetHeight > window.innerHeight;
+    } else {
+      return document.documentElement.scrollHeight > document.documentElement.offsetHeight || document.body.scrollHeight > document.body.offsetHeight;
+    }
+  };
+
+  useEffect(function () {
+    // Fetching related article after component mounted if vertical scroll not found
+    setTimeout(function () {
+      if (!hasVerticalScroll()) {
+        loadmore();
+      }
+    }, 1000);
+  }, [queueData.length]);
+
+  var loadmore = function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() {
+      var index, article, startingIndex, endingIndex, targeting;
+      return regenerator.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (!(queueData && queueData.length < maxListLength)) {
+                _context.next = 27;
+                break;
+              }
+
+              index = queueData.length - 1;
+              article = null;
+              _context.prev = 3;
+              _context.next = 6;
+              return getRelatedArticle(null, props.client, props.article, prevUrl, index);
+
+            case 6:
+              article = _context.sent;
+              _context.next = 12;
+              break;
+
+            case 9:
+              _context.prev = 9;
+              _context.t0 = _context['catch'](3);
+
+              console.error(_context.t0);
+
+            case 12:
+              if (!(article && article._id)) {
+                _context.next = 27;
+                break;
+              }
+
+              //query next 4 related article without repeating previous 4 related articles
+              startingIndex = queueData.length + 1;
+              endingIndex = startingIndex + 2;
+              _context.prev = 15;
+              _context.next = 18;
+              return getRelatedArticle(null, props.client, props.article, prevUrl, startingIndex + '..' + endingIndex);
+
+            case 18:
+              article.relatedArticle = _context.sent;
+              _context.next = 24;
+              break;
+
+            case 21:
+              _context.prev = 21;
+              _context.t1 = _context['catch'](15);
+
+              console.error(_context.t1);
+
+            case 24:
+              targeting = getTargeting({ article: article, cpModificationRequired: cpModificationRequired, prevUrl: prevUrl, disablePrevUrlCheckContentPlacement: disablePrevUrlCheckContentPlacement });
+
+              article.Ads = Ads.getRightItems(targeting);
+              setQueueData([].concat(_toConsumableArray(queueData), [article]));
+
+            case 27:
+            case 'end':
+              return _context.stop();
+          }
+        }
+      }, _callee, _this$1, [[3, 9], [15, 21]]);
+    }));
+
+    return function loadmore() {
+      return _ref.apply(this, arguments);
+    };
+  }();
+
+  var currentPath = router && router.asPath;
+  var seoLinks = props.cache.seoManager && props.cache.seoManager.filter(function (eachDocument) {
+    return eachDocument.urlSeo == currentPath;
+  });
+
+  var metaDescriptionSanity = seoLinks && seoLinks.length == 1 && seoLinks[0].metaDescription;
+  var metaTitleSanity = seoLinks && seoLinks.length == 1 && seoLinks[0].metaTitle;
+  // let urlSeo = seoLinks && seoLinks.length ==1 && seoLinks[0].urlSeo
+
+  var changeMetaFromSanity = function changeMetaFromSanity(metaDescription, metaTitle, oldMeta) {
+    document.title = metaTitle;
+    //this was throwing an error if there was no description, doing a check for the description meta
+    if (document.querySelector('meta[name="description"]')) document.querySelector('meta[name="description"]').setAttribute('content', metaDescription);
+    document.querySelector('meta[name="keywords"]').setAttribute('content', oldMeta.shareKeywords);
+    document.querySelector('meta[property="og:url"]').setAttribute('content', oldMeta.shareUrl);
+    document.querySelector('meta[property="og:title"]').setAttribute('content', metaTitle);
+    document.querySelector('meta[property="og:site_name"]').setAttribute('content', oldMeta.shareVia);
+    document.querySelector('meta[property="og:description"]').setAttribute('content', metaDescription);
+    document.querySelector('meta[name="twitter:title"]').setAttribute('content', metaTitle);
+    document.querySelector('meta[name="twitter:image"]').setAttribute('content', oldMeta.shareImage);
+    document.querySelector('meta[name="twitter:site"]').setAttribute('content', oldMeta.shareVia);
+    //this was throwing an error if there was no description, doing a check for the description meta
+    if (document.querySelector('meta[name="twitter:description"]')) document.querySelector('meta[name="twitter:description"]').setAttribute('content', metaDescription);
+    if (canonicalTag) {
+      document.querySelector('link[rel="canonical"]').setAttribute('href', oldMeta.shareUrl);
+    }
+  };
+
+  var changeMeta = function changeMeta(meta) {
+    document.title = meta.shareTitle;
+    //this was throwing an error if there was no description, doing a check for the description meta
+    if (document.querySelector('meta[name="description"]')) document.querySelector('meta[name="description"]').setAttribute('content', meta.shareSummary);
+    document.querySelector('meta[name="keywords"]').setAttribute('content', meta.shareKeywords);
+    document.querySelector('meta[property="og:url"]').setAttribute('content', meta.shareUrl);
+    document.querySelector('meta[property="og:title"]').setAttribute('content', meta.shareTitle);
+    document.querySelector('meta[property="og:site_name"]').setAttribute('content', meta.shareVia);
+    document.querySelector('meta[property="og:description"]').setAttribute('content', meta.shareSummary);
+    document.querySelector('meta[name="twitter:title"]').setAttribute('content', meta.shareTitle);
+    document.querySelector('meta[name="twitter:image"]').setAttribute('content', meta.shareImage);
+    document.querySelector('meta[name="twitter:site"]').setAttribute('content', meta.shareVia);
+    //this was throwing an error if there was no description, doing a check for the description meta
+    if (document.querySelector('meta[name="twitter:description"]')) document.querySelector('meta[name="twitter:description"]').setAttribute('content', meta.shareSummary);
+    if (canonicalTag) {
+      document.querySelector('link[rel="canonical"]').setAttribute('href', meta.shareUrl);
+    }
+  };
+
+  var onChangeArticle = function onChangeArticle(path, meta, pageviewProperties) {
+    var newPath = '/view/' + path;
+    var activeArticle = queueData.find(function (item) {
+      return item.url.current === path;
+    });
+    setActive(function () {
+      return activeArticle._id;
+    });
+    // Change URL and do other changes
+    window.history.pushState({ page: path }, meta.shareTitle, newPath);
+
+    if (metaDescriptionSanity && metaTitleSanity && currentPath == newPath) {
+      changeMetaFromSanity(metaDescriptionSanity, metaTitleSanity, meta);
+    } else {
+      changeMeta(meta);
+    }
+    if (props.setCustomDimensions) {
+      props.setCustomDimensions(activeArticle, '200', prevUrl, '');
+    }
+    if (props.pageview) props.pageview(newPath, null, pageviewProperties);
+    if (props.gtagSetCustomDimensions) props.gtagSetCustomDimensions(activeArticle, '200', prevUrl, '', true);
+    refreshAD(path);
+  };
+
+  return React__default.createElement(
+    InfiniteScroll,
+    { dataLength: queueData.length, next: loadmore, scrollThreshold: '40%', hasMore: true, style: { overflow: 'hidden' } },
+    queueData.map(function (article, index) {
+      return React__default.createElement(
+        React__default.Fragment,
+        { key: index },
+        React__default.createElement(Article, _extends({}, props, {
+          containerHeight: containerHeight,
+          onChangeArticle: onChangeArticle,
+          authorPrfix: authorPrefix,
+          article: article,
+          cpModificationRequired: cpModificationRequired,
+          active: active === article._id
+          // Passing queueData to check for single article
+          , queueData: queueData,
+          showRelatedArticles: showRelatedArticles,
+          index: index
+        }))
+      );
+    })
+  );
+};
+
+var _this = undefined;
+
+var View = function View(props) {
+  var router = useRouter();
+  var shareOptions = props.shareOptions,
+      article = props.article,
+      _props$article = props.article,
+      hideComments = _props$article.hideComments,
+      content_placement = _props$article.content_placement,
+      _props$sponsoredFlag = props.sponsoredFlag,
+      sponsoredFlag = _props$sponsoredFlag === undefined ? false : _props$sponsoredFlag;
+      props.sponsoredTaxonomies;
+      var Ads = props.Ads,
+      setCustomDimensions = props.setCustomDimensions,
+      gtagSetCustomDimensions = props.gtagSetCustomDimensions,
+      statusCode = props.statusCode,
+      prevUrl = props.prevUrl,
+      pageview = props.pageview,
+      _props$showRelatedArt = props.showRelatedArticles,
+      showRelatedArticles = _props$showRelatedArt === undefined ? false : _props$showRelatedArt,
+      _props$canonicalTag = props.canonicalTag,
+      canonicalTag = _props$canonicalTag === undefined ? true : _props$canonicalTag,
+      _props$infiniteScroll = props.infiniteScrollFlag,
+      infiniteScrollFlag = _props$infiniteScroll === undefined ? true : _props$infiniteScroll;
+  var _props$article2 = props.article,
+      _props$article2$passw = _props$article2.passwordLock,
+      passwordLock = _props$article2$passw === undefined ? false : _props$article2$passw;
+      _props$article2.description;
+      var title = _props$article2.title,
+      seriesShareOptions = _props$article2.seriesShareOptions;
+
+  var _useState = useState(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      currentPage = _useState2[0],
+      setCurrentPage = _useState2[1];
+  // Logging GA pageview for the initial article with custom dimensions
+
+
+  useEffect(function () {
+    if (pageview && setCustomDimensions) {
+      var timer = void 0;
+      var pageviewProperties = _extends({}, getTargeting(props), {
+        category: article && article.category ? article.category.name : ''
+      });
+      var waitAndExicute = function waitAndExicute() {
+        if (typeof window.GA_INITIALIZED !== 'undefined') {
+          setCustomDimensions(article, statusCode, prevUrl, '');
+          pageview(router.asPath, null, pageviewProperties);
+        } else timer = setTimeout(waitAndExicute, 1000);
+      };
+      waitAndExicute();
+      return function () {
+        clearTimeout(timer);
+      };
+    } else if (gtagSetCustomDimensions) {
+      var _timer = void 0;
+      var _waitAndExicute = function _waitAndExicute() {
+        if (typeof window.GA_INITIALIZED !== 'undefined') {
+          gtagSetCustomDimensions(article, statusCode, prevUrl, '', false);
+        } else _timer = setTimeout(_waitAndExicute, 1000);
+      };
+      _waitAndExicute();
+      return function () {
+        clearTimeout(_timer);
+      };
+    }
+  }, []);
+
+  var isVideoSeries = false;
+  // check for certain serializers that need to disable infinite scroll
+  var checkBodyForDisableInfiniteScroll = function checkBodyForDisableInfiniteScroll(article) {
+    if (!article || !article.body) {
+      return false;
+    }
+    for (var i = 0; i < article.body.length; i++) {
+      if (article.body[i]._type === 'articleSeries' || article.body[i]._type === 'slideshows' || article.body[i]._type === 'quiz') {
+        return true;
+      }
+      var row = article.body[i];
+      if (typeof row.videos !== 'undefined') {
+        isVideoSeries = true;
+        return true;
+      }
+    }
+    return false;
+  };
+
+  var isMediaSeries = false;
+
+  if (article.documentGroup && article.documentGroup.isSeries) {
+    isMediaSeries = true;
+  }
+  if (!article.documentGroup && article.documentGroupMapping && checkDocGroupMappingForSeries(article.documentGroupMapping)) {
+    isMediaSeries = true;
+  }
+
+  var disableInfiniteScroll = checkBodyForDisableInfiniteScroll(props.article);
+  var commentsEnabledInTaxonomy = Array.isArray(content_placement) && content_placement.some(function (t) {
+    return t.showComments === true;
+  });
+  var showDisqus = commentsEnabledInTaxonomy || hideComments === false;
+  var needInfiniteScroll = ['Articles', 'Videos', 'Podcasts'].includes(article.category.name) && article.taxonomyMapping && article.passwordLock !== true && !disableInfiniteScroll && !article.ExcludeFromInfiniteScroll && !sponsoredFlag && infiniteScrollFlag && !article.showIsi && !isMediaSeries && !showDisqus;
+
+  if (['Articles', 'Videos', 'Podcasts'].includes(article.category.name)) {
+    title = null;
+  }
+
+  if (!needInfiniteScroll && !title) {
+    title = props.article ? props.article.title : '';
+  }
+  // add mobile ads to articles not using infinite scroll
+  if (!needInfiniteScroll) {
+    var targeting = getTargeting(props);
+    article.Ads = Ads.getRightItems(targeting);
+    if (!sponsoredFlag && Ads.getVideoContextualAD) {
+      article.contextualVideoAD = Ads.getVideoContextualAD(getTargeting(props, 'in-context_video'));
+    }
+    if (!sponsoredFlag && Ads.getNativeContextualAD) {
+      article.contextualAD = Ads.getNativeContextualAD(getTargeting(props, 'native-ad'));
+    }
+  }
+  useEffect(function () {
+    router.asPath && router.asPath.length > 0 && router.asPath.includes('?') && router.asPath.split('?')[1].split('&').forEach(function (item) {
+      if (item.includes('page=')) {
+        setCurrentPage(item.split('=')[1]);
+      } else {
+        setCurrentPage(0);
+      }
+    });
+    if (!router.asPath.includes('page=') && currentPage !== 0) {
+      setCurrentPage(0);
+    }
+  }, [router]);
+
+  var meta_description = seriesShareOptions && seriesShareOptions.seriesSummary ? '' + seriesShareOptions.seriesSummary + (currentPage > 0 ? ' | Page ' + currentPage : '') : article.seo && article.seo.meta_description ? '' + article.seo.meta_description + (currentPage > 0 ? ' | Page ' + currentPage : '') : shareOptions.shareSummary ? '' + shareOptions.shareSummary + (currentPage > 0 ? ' | Page ' + currentPage : '') : '' + (currentPage > 0 ? 'Page ' + currentPage : '');
+
+  if (isVideoSeries) {
+    meta_description = seriesShareOptions && seriesShareOptions.seriesSummary ? '' + seriesShareOptions.seriesSummary + (currentPage > 0 ? ' | Page ' + currentPage : '') : '';
+  }
+
+  var currentPath = router && router.asPath;
+  var seoLinks = props.cache.seoManager && props.cache.seoManager.filter(function (eachDocument) {
+    return eachDocument.urlSeo == currentPath;
+  });
+
+  var metaDescriptionSanity = seoLinks && seoLinks.length == 1 && seoLinks[0].metaDescription;
+  var metaTitleSanity = seoLinks && seoLinks.length == 1 && seoLinks[0].metaTitle;
+  return React__default.createElement(
+    React__default.Fragment,
+    null,
+    React__default.createElement(
+      Head,
+      null,
+      React__default.createElement(
+        'title',
+        { key: 'title' },
+        metaTitleSanity ? '' + metaTitleSanity + (currentPage > 0 ? ' | Page ' + currentPage : '') : seriesShareOptions && seriesShareOptions.seriesTitle ? '' + seriesShareOptions.seriesTitle + (currentPage > 0 ? ' | Page ' + currentPage : '') : article && article.seo && article.seo.seo_title ? '' + article.seo.seo_title + (currentPage > 0 ? ' | Page ' + currentPage : '') : '' + article.title + (currentPage > 0 ? ' | Page ' + currentPage : '')
+      ),
+      metaDescriptionSanity ? React__default.createElement('meta', { name: 'description', key: 'description', content: metaDescriptionSanity }) : meta_description && React__default.createElement('meta', { name: 'description', key: 'description', content: meta_description }),
+      React__default.createElement('meta', { name: 'keywords', content: getKeywords(article).join(','), key: 'keywords' }),
+      passwordLock && React__default.createElement('meta', { name: 'robots', content: 'noindex, nofollow' }),
+      React__default.createElement('meta', {
+        property: 'og:url',
+        content: seriesShareOptions && seriesShareOptions.seriesUrl ? shareOptions.shareUrl + seriesShareOptions.seriesUrl : shareOptions.shareUrl,
+        key: 'og:url'
+      }),
+      React__default.createElement('meta', {
+        property: 'og:title',
+        content: metaTitleSanity ? '' + metaTitleSanity + (currentPage > 0 ? ' | Page ' + currentPage : '') : seriesShareOptions && seriesShareOptions.seriesTitle ? '' + seriesShareOptions.seriesTitle + (currentPage > 0 ? ' | Page ' + currentPage : '') : article.seo && article.seo.seo_title ? '' + article.seo.seo_title + (currentPage > 0 ? ' | Page ' + currentPage : '') : '' + shareOptions.shareTitle + (currentPage > 0 ? ' | Page ' + currentPage : ''),
+        key: 'og:title'
+      }),
+      React__default.createElement('meta', {
+        property: 'og:image',
+        content: seriesShareOptions && seriesShareOptions.seriesThumbnail ? seriesShareOptions.seriesThumbnail : shareOptions.shareImage,
+        key: 'og:image'
+      }),
+      React__default.createElement('meta', { property: 'og:site_name', content: props.Settings.title, key: 'og:site_name' }),
+      metaDescriptionSanity ? React__default.createElement('meta', { property: 'og:description', key: 'og:description', content: metaDescriptionSanity }) : meta_description && React__default.createElement('meta', { property: 'og:description', key: 'og:description', content: meta_description }),
+      React__default.createElement('meta', { name: 'twitter:card', content: 'summary', key: 'twitter:card' }),
+      React__default.createElement('meta', {
+        name: 'twitter:title',
+        content: metaTitleSanity ? '' + metaTitleSanity + (currentPage > 0 ? ' | Page ' + currentPage : '') : seriesShareOptions && seriesShareOptions.seriesTitle ? '' + seriesShareOptions.seriesTitle + (currentPage > 0 ? ' | Page ' + currentPage : '') : article.seo && article.seo.seo_title ? '' + article.seo.seo_title + (currentPage > 0 ? ' | Page ' + currentPage : '') : '' + shareOptions.shareTitle + (currentPage > 0 ? ' | Page ' + currentPage : ''),
+        key: 'twitter:title'
+      }),
+      React__default.createElement('meta', {
+        name: 'twitter:image',
+        content: seriesShareOptions && seriesShareOptions.seriesThumbnail ? seriesShareOptions.seriesThumbnail : shareOptions.shareImage,
+        key: 'twitter:image'
+      }),
+      React__default.createElement('meta', { name: 'twitter:site', content: '@' + props.Settings.title, key: 'twitter:site' }),
+      metaDescriptionSanity ? React__default.createElement('meta', { name: 'twitter:description', key: 'twitter:description', content: metaDescriptionSanity }) : meta_description && React__default.createElement('meta', { name: 'twitter:description', key: 'twitter:description', content: meta_description }),
+      canonicalTag && React__default.createElement('link', {
+        rel: 'canonical',
+        href: seriesShareOptions && seriesShareOptions.seriesUrl ? shareOptions.shareUrl + seriesShareOptions.seriesUrl : shareOptions.shareUrl,
+        key: 'canonical'
+      }),
+      React__default.createElement(
+        'noscript',
+        null,
+        props.article.seriesDetail && props.article.seriesDetail.prevUrl && React__default.createElement('link', { rel: 'prev', href: props.article.seriesDetail.prevUrl }),
+        props.article.seriesDetail && props.article.seriesDetail.nextUrl && React__default.createElement('link', { rel: 'next', href: props.article.seriesDetail.nextUrl })
+      )
+    ),
+    !needInfiniteScroll ? React__default.createElement(Article, _extends({ infiniteScroll: false, showRelatedArticles: showRelatedArticles, showDisqus: showDisqus }, props)) : React__default.createElement(ArticleQueue, _extends({
+      infiniteScroll: true,
+      showRelatedArticles: showRelatedArticles,
+      canonicalTag: canonicalTag,
+      checkSponsered: true,
+      Ads: props.WAds,
+      onVote: function onVote() {},
+      sponsoredTaxonomies: []
+    }, props))
+  );
+};
+
+// This should be called in /view/[url] getInitialProps to fetch the article data and related articles.  This will also set the sponsoredFlag to true if any taxonomies have disabled ads.
+View.returnGetInitialProps = function () {
+  var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(url, prevUrl, seriesVid, client, sao) {
+    var context = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : null;
+
+    var article, relatedArticleQuery, sliderData, statusCode, sliderArticles, _sliderArticles, _context$query$series, seriesArticle, sponsoredFlag;
+
+    return regenerator.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            _context.next = 2;
+            return client.fetch(getQuery('article'), { url: url });
+
+          case 2:
+            article = _context.sent;
+            relatedArticleQuery = getQuery('related');
+
+            article.seriesDetail = getSeriesDetail(article, seriesVid);
+            sliderData = [];
+            statusCode = 200;
+
+            if (!article || !article._id || !article.body) {
+              statusCode = 404;
+            }
+
+            if (!(article.documentGroup && article.documentGroup.isSeries)) {
+              _context.next = 15;
+              break;
+            }
+
+            _context.next = 11;
+            return client.fetch('*[!(_id in path("drafts.**")) \n    && _type == "article"\n    && defined(title)\n    && references(\'' + article.documentGroup._id + '\')\n    && is_visible == true\n    && defined(published)\n    && dateTime(published) <= dateTime(now())\n  ] | order(published asc)  {\n      title,\n      thumbnail,\n      url,\n      published\n    }');
+
+          case 11:
+            sliderArticles = _context.sent;
+
+            sliderData = sliderArticles;
+            _context.next = 20;
+            break;
+
+          case 15:
+            if (!(article.documentGroupMapping && article.documentGroupMapping[0] && article.documentGroupMapping[0].isSeries)) {
+              _context.next = 20;
+              break;
+            }
+
+            _context.next = 18;
+            return client.fetch('*[!(_id in path("drafts.**")) \n    && _type == "article"\n    && defined(title)\n    && references(\'' + article.documentGroupMapping[0]._id + '\')\n    && is_visible == true\n    && defined(published)\n    && dateTime(published) <= dateTime(now())\n  ] | order(published asc)  {\n      title,\n      thumbnail,\n      url,\n      published\n    }');
+
+          case 18:
+            _sliderArticles = _context.sent;
+
+            sliderData = _sliderArticles;
+
+          case 20:
+            _context$query$series = context.query.seriesArticle, seriesArticle = _context$query$series === undefined ? false : _context$query$series;
+
+            if ((seriesArticle || seriesVid) && article.body) {
+              article.body.map(function (block) {
+                if (block._type === 'articleSeries' && block.articles && block.articles.length > 0) {
+                  block.articles.map(function (subArticle) {
+                    if (subArticle.param.current === seriesArticle) {
+                      var seriesShareOptions = {
+                        seriesUrl: '?seriesArticle=' + seriesArticle,
+                        seriesTitle: subArticle.title,
+                        seriesSummary: subArticle.summary,
+                        seriesThumbnail: subArticle.thumbnail && subArticle.thumbnail.asset ? urlFor({ client: client, source: subArticle.thumbnail.asset }) : null
+                      };
+                      article.seriesShareOptions = seriesShareOptions;
+                    }
+                  });
+                }
+                if (block._type === 'youtubeGallery' && block.videos && block.videos.length > 0) {
+                  block.videos.map(function (video, index) {
+                    if (index + 1 === Number(seriesVid)) {
+                      var seriesShareOptions = {
+                        seriesUrl: '?seriesVid=' + seriesVid,
+                        seriesTitle: video.title,
+                        seriesSummary: video.intro,
+                        seriesThumbnail: video.thumbnail && video.thumbnail.asset ? urlFor({ client: client, source: video.thumbnail.asset }) : null
+                      };
+                      article.seriesShareOptions = seriesShareOptions;
+                    }
+                  });
+                }
+              });
+            }
+            sponsoredFlag = false;
+            // check for disableAds flag on each taxonomoy
+
+            if (article && article.content_placement) {
+              article.content_placement.forEach(function (x) {
+                if (x.disableAds) {
+                  sponsoredFlag = true;
+                }
+              });
+            }
+            // check for disableAds flag on content category
+            if (article.category && article.category.disableAds) {
+              sponsoredFlag = true;
+            }
+
+            if (!article.disableRelatedContent) {
+              _context.next = 30;
+              break;
+            }
+
+            article.relatedArticle = null;
+            _context.next = 34;
+            break;
+
+          case 30:
+            if (!article) {
+              _context.next = 34;
+              break;
+            }
+
+            _context.next = 33;
+            return getRelatedArticle(context, client, article, prevUrl, '0..2');
+
+          case 33:
+            article.relatedArticle = _context.sent;
+
+          case 34:
+            return _context.abrupt('return', {
+              url: url,
+              sao: sao,
+              statusCode: statusCode,
+              prevUrl: prevUrl,
+              relatedArticleQuery: relatedArticleQuery,
+              article: article,
+              sliderData: sliderData,
+              sponsoredFlag: sponsoredFlag
+            });
+
+          case 35:
+          case 'end':
+            return _context.stop();
+        }
+      }
+    }, _callee, _this);
+  }));
+
+  return function (_x, _x2, _x3, _x4, _x5) {
+    return _ref.apply(this, arguments);
+  };
+}();
+
+export default View;