@mjhls/mjh-framework 1.0.280 → 1.0.282

package/dist/esm/index.js

@@ -1,12 +1,12 @@
 import { c as createCommonjsModule, a as commonjsGlobal, g as getCjsExportFromNamespace, u as unwrapExports } from './_commonjsHelpers-0c4b6f40.js';
 import { _ as _objectKeys, a as _toObject, b as _core } from './_to-object-b9b796ec.js';
 import './web.dom.iterable-3be50d6c.js';
-import { d as debounce_1, l as lib_3, a as lib_1 } from './debounce-d15d4a31.js';
+import { d as debounce_1, l as lib_3, a as lib_1, i as isObjectLike_1, _ as _baseGetTag, t as toNumber_1, b as _root, c as _freeGlobal } from './debounce-93ab8f80.js';
 import { m as main_36, a as main_16, b as main_35 } from './main-155ec04f.js';
 import { _ as _toConsumableArray, a as _Array$from } from './toConsumableArray-eb308ede.js';
 import './core.get-iterator-method-31c1fb1a.js';
 import { _ as _extends$2 } from './extends-dbbe308d.js';
-import { _ as _objectSap, a as _inherits$1, b as _classCallCheck$1, c as _possibleConstructorReturn$1, d as _Object$getPrototypeOf, e as _createClass$1 } from './inherits-1d7657b5.js';
+import { _ as _objectSap, a as _inherits$1, b as _classCallCheck$1, c as _possibleConstructorReturn$1, d as _Object$getPrototypeOf, e as _createClass$1 } from './inherits-2a854891.js';
 import React__default, { useState, useRef, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import Container from 'react-bootstrap/Container';
@@ -21,13 +21,13 @@ import { i as imageUrlBuilder } from './index-3849e3fe.js';
 import './index-5f9f807a.js';
 import { h as html_decode_1, c as clean_html_1 } from './entities-7cc3bf45.js';
 import { _ as _slicedToArray } from './slicedToArray-d0a9593a.js';
-import { _ as _JSON$stringify, a as _asyncToGenerator, r as regenerator, D as DFPAdSlot, B as Beam } from './AdSlot-1f20130d.js';
-export { D as AdSlot, B as Beam } from './AdSlot-1f20130d.js';
-import './promise-eabb7f7e.js';
-import './ADInfeed-cc019fcb.js';
+import { _ as _JSON$stringify, a as _asyncToGenerator, r as regenerator, D as DFPAdSlot, B as Beam } from './AdSlot-cc6a4f74.js';
+export { D as AdSlot, B as Beam } from './AdSlot-cc6a4f74.js';
+import './promise-e3480f1c.js';
+import './ADInfeed-fd816c1f.js';
 export { default as DeckContent } from './DeckContent.js';
-import './get-a0244443.js';
-export { A as AD, G as GridContent } from './GridContent-1292ff20.js';
+import { i as isFunction_1, a as isArray_1, _ as _arrayMap } from './get-9c285a85.js';
+export { A as AD, G as GridContent } from './GridContent-2e9e7528.js';
 export { default as DeckQueue } from './DeckQueue.js';
 import 'react-bootstrap/Media';
 export { default as ThumbnailCard } from './ThumbnailCard.js';
@@ -49,8 +49,8 @@ export { default as IssueDeck } from './IssueDeck.js';
 import 'react-bootstrap/Badge';
 export { default as IssueContentDeck } from './IssueContentDeck.js';
 import Spinner from 'react-bootstrap/Spinner';
-import { M as MdPictureAsPdf, T as TemplateNormal } from './Normal-a2c50ae2.js';
-export { A as AD728x90, C as Column1, a as Column2, b as Column3, f as HamMagazine, H as Header, L as LeftNav, e as NavDvm, c as NavMagazine, N as NavNative, d as NavNormal, P as PageFilter, S as Search, g as SideFooter, T as TemplateNormal } from './Normal-a2c50ae2.js';
+import { M as MdPictureAsPdf, T as TemplateNormal } from './Normal-6a056c0d.js';
+export { A as AD728x90, C as Column1, a as Column2, b as Column3, f as HamMagazine, H as Header, L as LeftNav, e as NavDvm, c as NavMagazine, N as NavNative, d as NavNormal, P as PageFilter, S as Search, g as SideFooter, T as TemplateNormal } from './Normal-6a056c0d.js';
 import 'react-bootstrap/ListGroup';
 import Head from 'next/head';
 import Accordion from 'react-bootstrap/Accordion';
@@ -15135,81 +15135,854 @@ var ConferenceArticleCard = function ConferenceArticleCard(props) {
   );
 };
 
-var InscreenSensor = function (_React$Component) {
-    _inherits$1(InscreenSensor, _React$Component);
+/**
+ * The base implementation of `_.findIndex` and `_.findLastIndex` without
+ * support for iteratee shorthands.
+ *
+ * @private
+ * @param {Array} array The array to inspect.
+ * @param {Function} predicate The function invoked per iteration.
+ * @param {number} fromIndex The index to search from.
+ * @param {boolean} [fromRight] Specify iterating from right to left.
+ * @returns {number} Returns the index of the matched value, else `-1`.
+ */
+function baseFindIndex(array, predicate, fromIndex, fromRight) {
+  var length = array.length,
+      index = fromIndex + (fromRight ? 1 : -1);
 
-    function InscreenSensor(props) {
-        _classCallCheck$1(this, InscreenSensor);
+  while ((fromRight ? index-- : ++index < length)) {
+    if (predicate(array[index], index, array)) {
+      return index;
+    }
+  }
+  return -1;
+}
 
-        var _this = _possibleConstructorReturn$1(this, (InscreenSensor.__proto__ || _Object$getPrototypeOf(InscreenSensor)).call(this, props));
+var _baseFindIndex = baseFindIndex;
 
-        _this.scrollHandler = function () {
-            // this.checkInside()
+/**
+ * The base implementation of `_.isNaN` without support for number objects.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is `NaN`, else `false`.
+ */
+function baseIsNaN(value) {
+  return value !== value;
+}
 
-            var visible = _this.checkInside();
-            if (visible != _this.visible) {
-                _this.visible = visible;
-                _this.props.onChange(visible);
-            }
-        };
+var _baseIsNaN = baseIsNaN;
 
-        _this.checkInside = function () {
-            var rect = _this.wraperRef.current.getBoundingClientRect();
-            var _this$props$offSetTop = _this.props.offSetTop,
-                offSetTop = _this$props$offSetTop === undefined ? 0 : _this$props$offSetTop;
-            var top = rect.top,
-                height = rect.height;
-
-            var bottom = top + height;
-            var viewHeight = window.innerHeight;
-            if (bottom < offSetTop) {
-                return false;
-            } else if (top > offSetTop && bottom <= viewHeight) {
-                return true;
-            } else if (top > offSetTop && top <= viewHeight && bottom > viewHeight) {
-                return 'top';
-            } else if (bottom <= viewHeight) {
-                return 'bottom';
-            } else {
-                return false;
-            }
-        };
+/**
+ * A specialized version of `_.indexOf` which performs strict equality
+ * comparisons of values, i.e. `===`.
+ *
+ * @private
+ * @param {Array} array The array to inspect.
+ * @param {*} value The value to search for.
+ * @param {number} fromIndex The index to search from.
+ * @returns {number} Returns the index of the matched value, else `-1`.
+ */
+function strictIndexOf(array, value, fromIndex) {
+  var index = fromIndex - 1,
+      length = array.length;
 
-        _this.wraperRef = React__default.createRef();
-        _this.visible = false;
-        return _this;
+  while (++index < length) {
+    if (array[index] === value) {
+      return index;
     }
+  }
+  return -1;
+}
 
-    _createClass$1(InscreenSensor, [{
-        key: 'componentDidMount',
-        value: function componentDidMount() {
-            this.visible = this.checkInside();
-            this.props.onChange(this.visible);
-            window.addEventListener('scroll', this.scrollHandler);
-        }
-    }, {
-        key: 'componentWillUnmount',
-        value: function componentWillUnmount() {
-            window.removeEventListener('scroll', this.scrollHandler);
-        }
-    }, {
-        key: 'render',
-        value: function render() {
-            var _props = this.props,
-                _props$className = _props.className,
-                className = _props$className === undefined ? '' : _props$className,
-                _props$style = _props.style,
-                style = _props$style === undefined ? {} : _props$style;
+var _strictIndexOf = strictIndexOf;
 
-            return React__default.createElement(
-                'div',
-                { ref: this.wraperRef, className: className, style: style },
-                this.props.children
-            );
-        }
-    }]);
+/**
+ * The base implementation of `_.indexOf` without `fromIndex` bounds checks.
+ *
+ * @private
+ * @param {Array} array The array to inspect.
+ * @param {*} value The value to search for.
+ * @param {number} fromIndex The index to search from.
+ * @returns {number} Returns the index of the matched value, else `-1`.
+ */
+function baseIndexOf(array, value, fromIndex) {
+  return value === value
+    ? _strictIndexOf(array, value, fromIndex)
+    : _baseFindIndex(array, _baseIsNaN, fromIndex);
+}
+
+var _baseIndexOf = baseIndexOf;
+
+/** Used as references for various `Number` constants. */
+var MAX_SAFE_INTEGER = 9007199254740991;
+
+/**
+ * Checks if `value` is a valid array-like length.
+ *
+ * **Note:** This method is loosely based on
+ * [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a valid length, else `false`.
+ * @example
+ *
+ * _.isLength(3);
+ * // => true
+ *
+ * _.isLength(Number.MIN_VALUE);
+ * // => false
+ *
+ * _.isLength(Infinity);
+ * // => false
+ *
+ * _.isLength('3');
+ * // => false
+ */
+function isLength(value) {
+  return typeof value == 'number' &&
+    value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
+}
+
+var isLength_1 = isLength;
+
+/**
+ * Checks if `value` is array-like. A value is considered array-like if it's
+ * not a function and has a `value.length` that's an integer greater than or
+ * equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is array-like, else `false`.
+ * @example
+ *
+ * _.isArrayLike([1, 2, 3]);
+ * // => true
+ *
+ * _.isArrayLike(document.body.children);
+ * // => true
+ *
+ * _.isArrayLike('abc');
+ * // => true
+ *
+ * _.isArrayLike(_.noop);
+ * // => false
+ */
+function isArrayLike(value) {
+  return value != null && isLength_1(value.length) && !isFunction_1(value);
+}
+
+var isArrayLike_1 = isArrayLike;
+
+/** `Object#toString` result references. */
+var stringTag = '[object String]';
+
+/**
+ * Checks if `value` is classified as a `String` primitive or object.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a string, else `false`.
+ * @example
+ *
+ * _.isString('abc');
+ * // => true
+ *
+ * _.isString(1);
+ * // => false
+ */
+function isString$1(value) {
+  return typeof value == 'string' ||
+    (!isArray_1(value) && isObjectLike_1(value) && _baseGetTag(value) == stringTag);
+}
+
+var isString_1 = isString$1;
+
+/** Used as references for various `Number` constants. */
+var INFINITY = 1 / 0,
+    MAX_INTEGER = 1.7976931348623157e+308;
+
+/**
+ * Converts `value` to a finite number.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.12.0
+ * @category Lang
+ * @param {*} value The value to convert.
+ * @returns {number} Returns the converted number.
+ * @example
+ *
+ * _.toFinite(3.2);
+ * // => 3.2
+ *
+ * _.toFinite(Number.MIN_VALUE);
+ * // => 5e-324
+ *
+ * _.toFinite(Infinity);
+ * // => 1.7976931348623157e+308
+ *
+ * _.toFinite('3.2');
+ * // => 3.2
+ */
+function toFinite(value) {
+  if (!value) {
+    return value === 0 ? value : 0;
+  }
+  value = toNumber_1(value);
+  if (value === INFINITY || value === -INFINITY) {
+    var sign = (value < 0 ? -1 : 1);
+    return sign * MAX_INTEGER;
+  }
+  return value === value ? value : 0;
+}
+
+var toFinite_1 = toFinite;
+
+/**
+ * Converts `value` to an integer.
+ *
+ * **Note:** This method is loosely based on
+ * [`ToInteger`](http://www.ecma-international.org/ecma-262/7.0/#sec-tointeger).
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to convert.
+ * @returns {number} Returns the converted integer.
+ * @example
+ *
+ * _.toInteger(3.2);
+ * // => 3
+ *
+ * _.toInteger(Number.MIN_VALUE);
+ * // => 0
+ *
+ * _.toInteger(Infinity);
+ * // => 1.7976931348623157e+308
+ *
+ * _.toInteger('3.2');
+ * // => 3
+ */
+function toInteger(value) {
+  var result = toFinite_1(value),
+      remainder = result % 1;
+
+  return result === result ? (remainder ? result - remainder : result) : 0;
+}
+
+var toInteger_1 = toInteger;
+
+/**
+ * The base implementation of `_.values` and `_.valuesIn` which creates an
+ * array of `object` property values corresponding to the property names
+ * of `props`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @param {Array} props The property names to get values for.
+ * @returns {Object} Returns the array of property values.
+ */
+function baseValues(object, props) {
+  return _arrayMap(props, function(key) {
+    return object[key];
+  });
+}
+
+var _baseValues = baseValues;
+
+/**
+ * The base implementation of `_.times` without support for iteratee shorthands
+ * or max array length checks.
+ *
+ * @private
+ * @param {number} n The number of times to invoke `iteratee`.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @returns {Array} Returns the array of results.
+ */
+function baseTimes(n, iteratee) {
+  var index = -1,
+      result = Array(n);
+
+  while (++index < n) {
+    result[index] = iteratee(index);
+  }
+  return result;
+}
+
+var _baseTimes = baseTimes;
+
+/** `Object#toString` result references. */
+var argsTag = '[object Arguments]';
+
+/**
+ * The base implementation of `_.isArguments`.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an `arguments` object,
+ */
+function baseIsArguments(value) {
+  return isObjectLike_1(value) && _baseGetTag(value) == argsTag;
+}
+
+var _baseIsArguments = baseIsArguments;
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty$1 = objectProto.hasOwnProperty;
+
+/** Built-in value references. */
+var propertyIsEnumerable = objectProto.propertyIsEnumerable;
 
-    return InscreenSensor;
+/**
+ * Checks if `value` is likely an `arguments` object.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an `arguments` object,
+ *  else `false`.
+ * @example
+ *
+ * _.isArguments(function() { return arguments; }());
+ * // => true
+ *
+ * _.isArguments([1, 2, 3]);
+ * // => false
+ */
+var isArguments = _baseIsArguments(function() { return arguments; }()) ? _baseIsArguments : function(value) {
+  return isObjectLike_1(value) && hasOwnProperty$1.call(value, 'callee') &&
+    !propertyIsEnumerable.call(value, 'callee');
+};
+
+var isArguments_1 = isArguments;
+
+/**
+ * This method returns `false`.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.13.0
+ * @category Util
+ * @returns {boolean} Returns `false`.
+ * @example
+ *
+ * _.times(2, _.stubFalse);
+ * // => [false, false]
+ */
+function stubFalse() {
+  return false;
+}
+
+var stubFalse_1 = stubFalse;
+
+var isBuffer_1 = createCommonjsModule(function (module, exports) {
+/** Detect free variable `exports`. */
+var freeExports =  exports && !exports.nodeType && exports;
+
+/** Detect free variable `module`. */
+var freeModule = freeExports && 'object' == 'object' && module && !module.nodeType && module;
+
+/** Detect the popular CommonJS extension `module.exports`. */
+var moduleExports = freeModule && freeModule.exports === freeExports;
+
+/** Built-in value references. */
+var Buffer = moduleExports ? _root.Buffer : undefined;
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeIsBuffer = Buffer ? Buffer.isBuffer : undefined;
+
+/**
+ * Checks if `value` is a buffer.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.3.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a buffer, else `false`.
+ * @example
+ *
+ * _.isBuffer(new Buffer(2));
+ * // => true
+ *
+ * _.isBuffer(new Uint8Array(2));
+ * // => false
+ */
+var isBuffer = nativeIsBuffer || stubFalse_1;
+
+module.exports = isBuffer;
+});
+
+/** Used as references for various `Number` constants. */
+var MAX_SAFE_INTEGER$1 = 9007199254740991;
+
+/** Used to detect unsigned integer values. */
+var reIsUint = /^(?:0|[1-9]\d*)$/;
+
+/**
+ * Checks if `value` is a valid array-like index.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.
+ * @returns {boolean} Returns `true` if `value` is a valid index, else `false`.
+ */
+function isIndex(value, length) {
+  var type = typeof value;
+  length = length == null ? MAX_SAFE_INTEGER$1 : length;
+
+  return !!length &&
+    (type == 'number' ||
+      (type != 'symbol' && reIsUint.test(value))) &&
+        (value > -1 && value % 1 == 0 && value < length);
+}
+
+var _isIndex = isIndex;
+
+/** `Object#toString` result references. */
+var argsTag$1 = '[object Arguments]',
+    arrayTag = '[object Array]',
+    boolTag = '[object Boolean]',
+    dateTag = '[object Date]',
+    errorTag = '[object Error]',
+    funcTag = '[object Function]',
+    mapTag = '[object Map]',
+    numberTag = '[object Number]',
+    objectTag = '[object Object]',
+    regexpTag = '[object RegExp]',
+    setTag = '[object Set]',
+    stringTag$1 = '[object String]',
+    weakMapTag = '[object WeakMap]';
+
+var arrayBufferTag = '[object ArrayBuffer]',
+    dataViewTag = '[object DataView]',
+    float32Tag = '[object Float32Array]',
+    float64Tag = '[object Float64Array]',
+    int8Tag = '[object Int8Array]',
+    int16Tag = '[object Int16Array]',
+    int32Tag = '[object Int32Array]',
+    uint8Tag = '[object Uint8Array]',
+    uint8ClampedTag = '[object Uint8ClampedArray]',
+    uint16Tag = '[object Uint16Array]',
+    uint32Tag = '[object Uint32Array]';
+
+/** Used to identify `toStringTag` values of typed arrays. */
+var typedArrayTags = {};
+typedArrayTags[float32Tag] = typedArrayTags[float64Tag] =
+typedArrayTags[int8Tag] = typedArrayTags[int16Tag] =
+typedArrayTags[int32Tag] = typedArrayTags[uint8Tag] =
+typedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] =
+typedArrayTags[uint32Tag] = true;
+typedArrayTags[argsTag$1] = typedArrayTags[arrayTag] =
+typedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] =
+typedArrayTags[dataViewTag] = typedArrayTags[dateTag] =
+typedArrayTags[errorTag] = typedArrayTags[funcTag] =
+typedArrayTags[mapTag] = typedArrayTags[numberTag] =
+typedArrayTags[objectTag] = typedArrayTags[regexpTag] =
+typedArrayTags[setTag] = typedArrayTags[stringTag$1] =
+typedArrayTags[weakMapTag] = false;
+
+/**
+ * The base implementation of `_.isTypedArray` without Node.js optimizations.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.
+ */
+function baseIsTypedArray(value) {
+  return isObjectLike_1(value) &&
+    isLength_1(value.length) && !!typedArrayTags[_baseGetTag(value)];
+}
+
+var _baseIsTypedArray = baseIsTypedArray;
+
+/**
+ * The base implementation of `_.unary` without support for storing metadata.
+ *
+ * @private
+ * @param {Function} func The function to cap arguments for.
+ * @returns {Function} Returns the new capped function.
+ */
+function baseUnary(func) {
+  return function(value) {
+    return func(value);
+  };
+}
+
+var _baseUnary = baseUnary;
+
+var _nodeUtil = createCommonjsModule(function (module, exports) {
+/** Detect free variable `exports`. */
+var freeExports =  exports && !exports.nodeType && exports;
+
+/** Detect free variable `module`. */
+var freeModule = freeExports && 'object' == 'object' && module && !module.nodeType && module;
+
+/** Detect the popular CommonJS extension `module.exports`. */
+var moduleExports = freeModule && freeModule.exports === freeExports;
+
+/** Detect free variable `process` from Node.js. */
+var freeProcess = moduleExports && _freeGlobal.process;
+
+/** Used to access faster Node.js helpers. */
+var nodeUtil = (function() {
+  try {
+    // Use `util.types` for Node.js 10+.
+    var types = freeModule && freeModule.require && freeModule.require('util').types;
+
+    if (types) {
+      return types;
+    }
+
+    // Legacy `process.binding('util')` for Node.js < 10.
+    return freeProcess && freeProcess.binding && freeProcess.binding('util');
+  } catch (e) {}
+}());
+
+module.exports = nodeUtil;
+});
+
+/* Node.js helper references. */
+var nodeIsTypedArray = _nodeUtil && _nodeUtil.isTypedArray;
+
+/**
+ * Checks if `value` is classified as a typed array.
+ *
+ * @static
+ * @memberOf _
+ * @since 3.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.
+ * @example
+ *
+ * _.isTypedArray(new Uint8Array);
+ * // => true
+ *
+ * _.isTypedArray([]);
+ * // => false
+ */
+var isTypedArray = nodeIsTypedArray ? _baseUnary(nodeIsTypedArray) : _baseIsTypedArray;
+
+var isTypedArray_1 = isTypedArray;
+
+/** Used for built-in method references. */
+var objectProto$1 = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty$2 = objectProto$1.hasOwnProperty;
+
+/**
+ * Creates an array of the enumerable property names of the array-like `value`.
+ *
+ * @private
+ * @param {*} value The value to query.
+ * @param {boolean} inherited Specify returning inherited property names.
+ * @returns {Array} Returns the array of property names.
+ */
+function arrayLikeKeys(value, inherited) {
+  var isArr = isArray_1(value),
+      isArg = !isArr && isArguments_1(value),
+      isBuff = !isArr && !isArg && isBuffer_1(value),
+      isType = !isArr && !isArg && !isBuff && isTypedArray_1(value),
+      skipIndexes = isArr || isArg || isBuff || isType,
+      result = skipIndexes ? _baseTimes(value.length, String) : [],
+      length = result.length;
+
+  for (var key in value) {
+    if ((inherited || hasOwnProperty$2.call(value, key)) &&
+        !(skipIndexes && (
+           // Safari 9 has enumerable `arguments.length` in strict mode.
+           key == 'length' ||
+           // Node.js 0.10 has enumerable non-index properties on buffers.
+           (isBuff && (key == 'offset' || key == 'parent')) ||
+           // PhantomJS 2 has enumerable non-index properties on typed arrays.
+           (isType && (key == 'buffer' || key == 'byteLength' || key == 'byteOffset')) ||
+           // Skip index properties.
+           _isIndex(key, length)
+        ))) {
+      result.push(key);
+    }
+  }
+  return result;
+}
+
+var _arrayLikeKeys = arrayLikeKeys;
+
+/** Used for built-in method references. */
+var objectProto$2 = Object.prototype;
+
+/**
+ * Checks if `value` is likely a prototype object.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a prototype, else `false`.
+ */
+function isPrototype(value) {
+  var Ctor = value && value.constructor,
+      proto = (typeof Ctor == 'function' && Ctor.prototype) || objectProto$2;
+
+  return value === proto;
+}
+
+var _isPrototype = isPrototype;
+
+/**
+ * Creates a unary function that invokes `func` with its argument transformed.
+ *
+ * @private
+ * @param {Function} func The function to wrap.
+ * @param {Function} transform The argument transform.
+ * @returns {Function} Returns the new function.
+ */
+function overArg(func, transform) {
+  return function(arg) {
+    return func(transform(arg));
+  };
+}
+
+var _overArg = overArg;
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeKeys = _overArg(Object.keys, Object);
+
+var _nativeKeys = nativeKeys;
+
+/** Used for built-in method references. */
+var objectProto$3 = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty$3 = objectProto$3.hasOwnProperty;
+
+/**
+ * The base implementation of `_.keys` which doesn't treat sparse arrays as dense.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the array of property names.
+ */
+function baseKeys(object) {
+  if (!_isPrototype(object)) {
+    return _nativeKeys(object);
+  }
+  var result = [];
+  for (var key in Object(object)) {
+    if (hasOwnProperty$3.call(object, key) && key != 'constructor') {
+      result.push(key);
+    }
+  }
+  return result;
+}
+
+var _baseKeys = baseKeys;
+
+/**
+ * Creates an array of the own enumerable property names of `object`.
+ *
+ * **Note:** Non-object values are coerced to objects. See the
+ * [ES spec](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)
+ * for more details.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Object
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the array of property names.
+ * @example
+ *
+ * function Foo() {
+ *   this.a = 1;
+ *   this.b = 2;
+ * }
+ *
+ * Foo.prototype.c = 3;
+ *
+ * _.keys(new Foo);
+ * // => ['a', 'b'] (iteration order is not guaranteed)
+ *
+ * _.keys('hi');
+ * // => ['0', '1']
+ */
+function keys$2(object) {
+  return isArrayLike_1(object) ? _arrayLikeKeys(object) : _baseKeys(object);
+}
+
+var keys_1 = keys$2;
+
+/**
+ * Creates an array of the own enumerable string keyed property values of `object`.
+ *
+ * **Note:** Non-object values are coerced to objects.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Object
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the array of property values.
+ * @example
+ *
+ * function Foo() {
+ *   this.a = 1;
+ *   this.b = 2;
+ * }
+ *
+ * Foo.prototype.c = 3;
+ *
+ * _.values(new Foo);
+ * // => [1, 2] (iteration order is not guaranteed)
+ *
+ * _.values('hi');
+ * // => ['h', 'i']
+ */
+function values(object) {
+  return object == null ? [] : _baseValues(object, keys_1(object));
+}
+
+var values_1 = values;
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeMax = Math.max;
+
+/**
+ * Checks if `value` is in `collection`. If `collection` is a string, it's
+ * checked for a substring of `value`, otherwise
+ * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+ * is used for equality comparisons. If `fromIndex` is negative, it's used as
+ * the offset from the end of `collection`.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Collection
+ * @param {Array|Object|string} collection The collection to inspect.
+ * @param {*} value The value to search for.
+ * @param {number} [fromIndex=0] The index to search from.
+ * @param- {Object} [guard] Enables use as an iteratee for methods like `_.reduce`.
+ * @returns {boolean} Returns `true` if `value` is found, else `false`.
+ * @example
+ *
+ * _.includes([1, 2, 3], 1);
+ * // => true
+ *
+ * _.includes([1, 2, 3], 1, 2);
+ * // => false
+ *
+ * _.includes({ 'a': 1, 'b': 2 }, 1);
+ * // => true
+ *
+ * _.includes('abcd', 'bc');
+ * // => true
+ */
+function includes(collection, value, fromIndex, guard) {
+  collection = isArrayLike_1(collection) ? collection : values_1(collection);
+  fromIndex = (fromIndex && !guard) ? toInteger_1(fromIndex) : 0;
+
+  var length = collection.length;
+  if (fromIndex < 0) {
+    fromIndex = nativeMax(length + fromIndex, 0);
+  }
+  return isString_1(collection)
+    ? (fromIndex <= length && collection.indexOf(value, fromIndex) > -1)
+    : (!!length && _baseIndexOf(collection, value, fromIndex) > -1);
+}
+
+var includes_1 = includes;
+
+var InscreenSensor = function (_React$Component) {
+  _inherits$1(InscreenSensor, _React$Component);
+
+  function InscreenSensor(props) {
+    _classCallCheck$1(this, InscreenSensor);
+
+    var _this = _possibleConstructorReturn$1(this, (InscreenSensor.__proto__ || _Object$getPrototypeOf(InscreenSensor)).call(this, props));
+
+    _this.scrollHandler = function () {
+      // this.checkInside()
+
+      var visible = _this.checkInside();
+      if (visible !== _this.visible) {
+        _this.visible = visible;
+        _this.props.onChange(visible);
+      }
+    };
+
+    _this.checkInside = function () {
+      var rect = _this.wraperRef.current.getBoundingClientRect();
+      var _this$props$offSetTop = _this.props.offSetTop,
+          offSetTop = _this$props$offSetTop === undefined ? 0 : _this$props$offSetTop;
+      var top = rect.top,
+          height = rect.height;
+
+      var bottom = top + height;
+      var viewHeight = window.innerHeight;
+      if (bottom < offSetTop) {
+        return false;
+      } else if (top > offSetTop && bottom <= viewHeight) {
+        return true;
+      } else if (top > offSetTop && top <= viewHeight && bottom > viewHeight) {
+        return 'top';
+      } else if (bottom <= viewHeight) {
+        return 'bottom';
+      } else {
+        return false;
+      }
+    };
+
+    _this.wraperRef = React__default.createRef();
+    _this.visible = false;
+    return _this;
+  }
+
+  _createClass$1(InscreenSensor, [{
+    key: 'componentDidMount',
+    value: function componentDidMount() {
+      this.visible = this.checkInside();
+      this.props.onChange(this.visible);
+      window.addEventListener('scroll', this.scrollHandler);
+    }
+  }, {
+    key: 'componentWillUnmount',
+    value: function componentWillUnmount() {
+      window.removeEventListener('scroll', this.scrollHandler);
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      var _props = this.props,
+          _props$className = _props.className,
+          className = _props$className === undefined ? '' : _props$className,
+          _props$style = _props.style,
+          style = _props$style === undefined ? {} : _props$style;
+
+      return React__default.createElement(
+        'div',
+        { ref: this.wraperRef, className: className, style: style },
+        this.props.children
+      );
+    }
+  }]);
+
+  return InscreenSensor;
 }(React__default.Component);
 
 var renderAuthor = function renderAuthor(authorName, authorURL, index, length) {
@@ -15251,11 +16024,38 @@ var Article = function Article(props) {
   } : _props$article$url;
   var url = _props$article$url.current,
       issue = _props$article.issue,
+      regionalPages = props.regionalPages,
+      nationalPage = props.nationalPage,
+      ISIContent = props.ISIContent,
       changeUrl = props.changeUrl,
-      isCutomPage = props.isCutomPage,
-      shareOptions = props.shareOptions,
-      renderIsiContent = props.renderIsiContent,
-      urlFor = props.urlFor;
+      shareOptions = props.shareOptions;
+
+
+  var urlFor = function urlFor(source) {
+    return imageUrlBuilder(client).image(source);
+  };
+
+  var isCutomPage = function isCutomPage(article) {
+    var url = article.url.current;
+
+    if (regionalPages || nationalPage) {
+      return regionalPages.includes(url) || nationalPage === url;
+    } else {
+      return false;
+    }
+  };
+
+  var renderIsiContent = function renderIsiContent(article) {
+    var url = article.url.current;
+
+    if (regionalPages.includes(url)) {
+      return React__default.createElement(ISIContent, null);
+    } else if (nationalPage === url) {
+      return React__default.createElement(ISIContent, { national: true });
+    }
+    return null;
+  };
+
   var shareVia = shareOptions.shareVia,
       shareSubject = shareOptions.shareSubject,
       twitterSiteName = shareOptions.twitterSiteName,
@@ -15389,166 +16189,65 @@ var Article = function Article(props) {
     React__default.createElement('hr', { className: 'article-seperater' })
   );
 };
+var ArticleQueue = function ArticleQueue(props) {
+  var website = props.website,
+      Ads = props.Ads,
+      mainNavCache = props.mainNavCache,
+      subNavCache = props.subNavCache,
+      isLiveSite = props.isLiveSite,
+      _props$sponsoredTaxon = props.sponsoredTaxonomies,
+      sponsoredTaxonomies = _props$sponsoredTaxon === undefined ? [] : _props$sponsoredTaxon;
 
-var ArticleQueue = function (_React$Component) {
-  _inherits$1(ArticleQueue, _React$Component);
-
-  function ArticleQueue(props) {
-    _classCallCheck$1(this, ArticleQueue);
-
-    var _this = _possibleConstructorReturn$1(this, (ArticleQueue.__proto__ || _Object$getPrototypeOf(ArticleQueue)).call(this, props));
-
-    _initialiseProps.call(_this);
-
-    var _this$props$article = _this.props.article,
-        summary = _this$props$article.summary,
-        _this$props$article$s = _this$props$article.seo;
-    _this$props$article$s = _this$props$article$s === undefined ? {
-      meta_description: null
-    } : _this$props$article$s;
-    var description = _this$props$article$s.meta_description;
-
-    var targeting = _this.getTargeting(_this.props.article);
-    var metaDescription = description ? description : summary ? summary : _this.getFirstLine(_this.props.article);
-    var article = _this.props.article;
-    article.Ads = _this.props.Ads.getRightItems(targeting);
-
-    _this.state = {
-      config: {
-        navComponent: _this.props.website.navigation,
-        navItems: _this.props.mainNavCache,
-        columns: '3',
-        leftItems: _this.props.subNavCache,
-        rightItems: _this.props.Ads.getRightItems(targeting),
-        horizontalAD: _this.props.Ads.getHorizontal(targeting),
-        isLiveSite: _this.props.isLiveSite
-      },
-      title: _this.props.article.title,
-      summary: metaDescription,
-      queueData: [article],
-      keywords: [],
-      maxListLength: 10,
-      loading: false
-    }, _this.preVscroll = 0;
-    _this.isScrollDown = true;
-
-    return _this;
-  }
-
-  _createClass$1(ArticleQueue, [{
-    key: 'componentDidMount',
-    value: function componentDidMount() {
-      window.addEventListener('scroll', this.scrollDirectionDetect);
-    }
-  }, {
-    key: 'componentWillUnmount',
-    value: function componentWillUnmount() {
-      window.removeEventListener('scroll', this.scrollDirectionDetect);
-    }
-    // To return the 1st Line of text in the article body
-
-  }, {
-    key: 'render',
-    value: function render() {
-      var _this2 = this;
-
-      var _state = this.state,
-          config = _state.config,
-          queueData = _state.queueData,
-          title = _state.title,
-          summary = _state.summary,
-          _state$keywords = _state.keywords,
-          keywords = _state$keywords === undefined ? [] : _state$keywords;
-      var _props = this.props,
-          website = _props.website,
-          shareOptions = _props.shareOptions;
-
-
-      return React__default.createElement(
-        TemplateNormal,
-        { config: config, website: website, keywords: keywords, description: summary, title: title, showRightAd: !main_36 },
-        React__default.createElement(
-          InfiniteScroll,
-          { dataLength: queueData.length, next: this.loadmore, scrollThreshold: '200px', hasMore: true },
-          queueData.map(function (article, index) {
-            return React__default.createElement(Article, _extends$2({
-              key: index,
-              urlFor: _this2.urlFor,
-              isCutomPage: _this2.isCutomPage,
-              renderIsiContent: _this2.renderIsiContent
-            }, _this2.props, {
-              shareOptions: shareOptions,
-              changeUrl: _this2.changeUrl,
-              article: article
-            }));
-          })
-        )
-      );
-    }
-  }]);
+  var _useState = useState(''),
+      _useState2 = _slicedToArray(_useState, 2),
+      prevUrl = _useState2[0],
+      setPrevUrl = _useState2[1];
 
-  return ArticleQueue;
-}(React__default.Component);
+  var _useState3 = useState([props.article]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      queueData = _useState4[0],
+      setQueueData = _useState4[1];
 
-var _initialiseProps = function _initialiseProps() {
-  var _this3 = this;
+  var _useState5 = useState({}),
+      _useState6 = _slicedToArray(_useState5, 2),
+      activeArticle = _useState6[0],
+      setActiveArticle = _useState6[1];
 
-  this.scrollDirectionDetect = function (e) {
-    var window = e.currentTarget;
-    var isScrollDown = _this3.isScrollDown;
+  var maxListLength = 10;
+  var preVscroll = 0;
+  var isScrollDown = true;
 
+  var _activeArticle$title = activeArticle.title,
+      title = _activeArticle$title === undefined ? '' : _activeArticle$title,
+      _activeArticle$summar = activeArticle.summary,
+      summary = _activeArticle$summar === undefined ? '' : _activeArticle$summar;
 
-    if (_this3.preVscroll > window.scrollY) {
-      if (!isScrollDown) {
-        _this3.isScrollDown = true;
-      }
-    } else if (_this3.preVscroll < window.scrollY) {
-      if (isScrollDown) {
-        _this3.isScrollDown = false;
-      }
-    }
-    _this3.preVscroll = window.scrollY;
-  };
 
-  this.loadmore = function () {
+  var getFirstLine = function getFirstLine(article) {
+    var _article$body = article.body,
+        body = _article$body === undefined ? [] : _article$body;
 
-    var maxListLength = _this3.props.maxListLength ? _this3.props.maxListLength : _this3.state.maxListLength;
-    var queueData = [].concat(_toConsumableArray(_this3.state.queueData));
-    var query = _this3.props.relatedArticleQuery;
-    var params = _this3.props.params;
-    if (queueData.length < maxListLength) {
-      params.index = queueData.length - 1;
-      var that = _this3;
-      _this3.props.client.fetch(query, params).then(function (article) {
-        if (article && article._id) {
-          var targeting = that.getTargeting(article);
-          article.Ads = that.props.Ads.getRightItems(targeting);
-          queueData.push(article);
-          that.setState({ queueData: queueData });
+    var desc = '';
+    body.some(function (children) {
+      children.children && children.children.some(function (item) {
+        if (item.text && String(item.text).trim().length > 0 && desc == '') {
+          console.log(String(item.text));
+          desc = String(item.text);
+          return true;
         }
       });
-    }
-  };
-
-  this.isCutomPage = function (article) {
-    var url = article.url.current;
-    var _props2 = _this3.props,
-        regionalPages = _props2.regionalPages,
-        nationalPage = _props2.nationalPage;
-
-    if (regionalPages || nationalPage) {
-
-      return regionalPages.includes(url) || nationalPage === url;
-    } else {
-      return false;
-    }
+      if (desc !== '') {
+        return true;
+      }
+    });
+    return desc;
   };
 
-  this.urlFor = function (source) {
-    return imageUrlBuilder(_this3.props.client).image(source);
-  };
+  if (summary.length === 0) {
+    summary = getFirstLine(activeArticle);
+  }
 
-  this.getTargeting = function (article) {
+  var getTargeting = function getTargeting(article) {
     var _article$internalTag = article.internalTag,
         internalTag = _article$internalTag === undefined ? [] : _article$internalTag,
         _article$userDefinedT = article.userDefinedTag,
@@ -15570,34 +16269,33 @@ var _initialiseProps = function _initialiseProps() {
         content_placement = article.content_placement;
 
     var context = url;
-    var localHistory = _this3.props.historyCookie ? JSON.parse(_this3.props.historyCookie) : [];
+    var localHistory = props.historyCookie ? JSON.parse(props.historyCookie) : [];
     if (!context && localHistory) {
       context = localHistory[localHistory.length - 1];
     }
     context = context && context.split('?')[0];
     context = context && context.split('&')[0];
     var content_placement_urls = [];
+    if (content_placement && prevUrl && prevUrl.length) {
+      content_placement.forEach(function (item) {
+        if (includes_1(prevUrl, item.path)) {
+          content_placement_urls.push(item.path);
+        }
+      });
+    }
+
     if (content_placement) {
-      if (content_placement.some(function (item) {
-        return context === item.path;
-      })) {
-        content_placement_urls = [context];
-      } else if (content_placement.some(function (item) {
-        return context === '/' + item.path;
-      })) {
-        content_placement_urls = [context.slice(1)];
-      } else {
+      if (content_placement_urls.length === 0) {
         content_placement_urls = content_placement.map(function (item) {
           return item.path;
         });
       }
+    } else {
+      content_placement_urls = ['/'];
     }
-    if (document_group.length > 0) {
-      content_placement_urls = [];
-    }
-    var keywords = [].concat(_toConsumableArray(internalTag), _toConsumableArray(userDefinedTag), _toConsumableArray(SponsorshipTag), _toConsumableArray(seoTag));
+    var articleKeywords = [].concat(_toConsumableArray(internalTag), _toConsumableArray(userDefinedTag), _toConsumableArray(SponsorshipTag), _toConsumableArray(seoTag));
     var targeting = {
-      tags: keywords,
+      tags: articleKeywords,
       document_group: [document_group],
       document_url: [url],
       content_placement: content_placement_urls
@@ -15605,122 +16303,174 @@ var _initialiseProps = function _initialiseProps() {
     return targeting;
   };
 
-  this.checkSponseredArticle = function (article) {
+  var _useState7 = useState(getTargeting(activeArticle)),
+      _useState8 = _slicedToArray(_useState7, 2),
+      targeting = _useState8[0],
+      setTargeting = _useState8[1];
+
+  var keywords = targeting && targeting.keywords ? targeting.keywords : [];
+
+  var config = {
+    navComponent: website.navigation,
+    navItems: mainNavCache,
+    columns: '3',
+    leftItems: subNavCache,
+    rightItems: [],
+    horizontalAD: {},
+    isLiveSite: isLiveSite
+  };
+  props.article.Ads = [];
+
+  var _useState9 = useState(config),
+      _useState10 = _slicedToArray(_useState9, 2),
+      pageConfig = _useState10[0],
+      setPageConfig = _useState10[1];
+
+  var checkSponseredArticle = function checkSponseredArticle(article) {
     var _article$taxonomyMapp = article.taxonomyMapping,
         taxonomyMapping = _article$taxonomyMapp === undefined ? [] : _article$taxonomyMapp;
 
-    if (_this3.props.checkSponsered) {
-
+    if (props.checkSponsered) {
       return taxonomyMapping.some(function (item) {
-        return item._ref === 'ict_taxonomy_735_sponsoredresources';
+        return includes_1(sponsoredTaxonomies, item._ref);
       });
     } else {
       return false;
     }
   };
 
-  this.renderIsiContent = function (article) {
-    var url = article.url.current;
-    var _props3 = _this3.props,
-        ISIContent = _props3.iSIContent,
-        regionalPages = _props3.regionalPages,
-        nationalPage = _props3.nationalPage;
-
-    if (regionalPages.includes(url)) {
-      return React__default.createElement(ISIContent, null);
-    } else if (nationalPage === url) {
-      return React__default.createElement(ISIContent, { national: true });
+  var updateConfig = function updateConfig(article) {
+    if (prevUrl && prevUrl.length) {
+      var _targeting = getTargeting(article);
+      var _config = {
+        navComponent: website.navigation,
+        navItems: mainNavCache,
+        columns: '3',
+        leftItems: subNavCache,
+        rightItems: checkSponseredArticle(article) ? [] : Ads.getRightItems(_targeting),
+        horizontalAD: checkSponseredArticle(article) ? {} : Ads.getHorizontal(_targeting),
+        isLiveSite: isLiveSite
+      };
+      setPageConfig(_config);
+      if (!main_36) {
+        lib_3.getGoogletag().then(function (googletag) {
+          if (window.googletag && googletag.pubadsReady) {
+            var slots = googletag.pubads().getSlots();
+            slots.forEach(function (slot) {
+              slot.clearTargeting();
+              _Object$keys(_targeting).forEach(function (key) {
+                slot.setTargeting(key, _targeting[key]);
+              });
+            });
+            googletag.cmd.push(function () {
+              googletag.pubads().refresh();
+            });
+          }
+        });
+      }
     }
-    return null;
   };
 
-  this.getFirstLine = function (article) {
-    var _article$body = article.body,
-        body = _article$body === undefined ? [] : _article$body;
+  useEffect(function () {
+    setPrevUrl(document && document.referrer ? document.referrer : '/');
+    props.article.Ads = Ads.getRightItems(targeting);
+    setActiveArticle(props.article);
+  }, [setPrevUrl]);
 
-    var desc = '';
-    body.some(function (children) {
-      children.children && children.children.some(function (item) {
-        if (item.text && String(item.text).trim().length > 0 && desc == '') {
-          console.log(String(item.text));
-          desc = String(item.text);
-          return true;
-        }
-      });
-      if (desc !== '') {
-        return true;
+  useEffect(function () {
+    setActiveArticle(props.article);
+  }, [prevUrl]);
+
+  useEffect(function () {
+    updateConfig(activeArticle);
+  }, [activeArticle]);
+
+  var scrollDirectionDetect = function scrollDirectionDetect(e) {
+    var window = e.currentTarget;
+    if (preVscroll > window.scrollY) {
+      if (!isScrollDown) {
+        isScrollDown = true;
       }
-    });
-    return desc;
+    } else if (preVscroll < window.scrollY) {
+      if (isScrollDown) {
+        isScrollDown = false;
+      }
+    }
+    preVscroll = window.scrollY;
   };
 
-  this.refreshAdd = function (path) {
-    var article = _this3.state.queueData.find(function (item) {
-      return item.url.current == path;
+  useEffect(function () {
+    window.addEventListener('scroll', scrollDirectionDetect);
+  });
+
+  var loadmore = function loadmore() {
+    var query = props.relatedArticleQuery;
+    var params = props.params;
+    var data = queueData.map(function (item) {
+      return item;
     });
-    var title = article.title,
-        summary = article.summary,
-        _article$internalTag2 = article.internalTag,
-        internalTag = _article$internalTag2 === undefined ? [] : _article$internalTag2,
-        _article$userDefinedT2 = article.userDefinedTag,
-        userDefinedTag = _article$userDefinedT2 === undefined ? [] : _article$userDefinedT2,
-        _article$SponsorshipT2 = article.SponsorshipTag,
-        SponsorshipTag = _article$SponsorshipT2 === undefined ? [] : _article$SponsorshipT2,
-        _article$seoTag2 = article.seoTag,
-        seoTag = _article$seoTag2 === undefined ? [] : _article$seoTag2,
-        _article$seo = article.seo;
-    _article$seo = _article$seo === undefined ? {
-      meta_description: null
-    } : _article$seo;
-    var description = _article$seo.meta_description;
-
-    var keywords = [].concat(_toConsumableArray(internalTag), _toConsumableArray(userDefinedTag), _toConsumableArray(SponsorshipTag), _toConsumableArray(seoTag));
-    var config = _extends$2({}, _this3.state.config);
-    var targeting = _this3.getTargeting(article);
-    var rightItems = [];
-
-    if (_this3.checkSponseredArticle(article)) {
-      rightItems = [];
-    } else {
-      rightItems = _this3.props.Ads.getRightItems(targeting);
+    if (data && data.length < maxListLength) {
+      params.index = data.length - 1;
+      props.client.fetch(query, params).then(function (article) {
+        if (article && article._id) {
+          var _targeting2 = getTargeting(article);
+          article.Ads = props.Ads.getRightItems(_targeting2);
+          data.push(article);
+          setQueueData(data);
+        }
+      });
     }
-    var horizontalAD = _this3.props.Ads.getHorizontal(targeting);
-    config.rightItems = rightItems;
-    config.horizontalAD = horizontalAD;
-    var metaDescription = description ? description : summary ? summary : _this3.getFirstLine(article);
-    _this3.setState({ config: config, title: title, summary: metaDescription }, function () {
-      if (!main_36) {
-        lib_3.refresh();
-      }
-    });
   };
 
-  this.changeUrl = function (path, visibility) {
-    var isScrollDown = _this3.isScrollDown;
+  var refreshAdd = function refreshAdd(path) {
+    var article = queueData.find(function (item) {
+      return item.url.current === path;
+    });
+    var targeting = getTargeting(article);
+    console.log('Forced Ad refresh', targeting);
+    article.Ads = Ads.getRightItems(targeting);
+    setActiveArticle(article);
+  };
 
+  var changeUrl = function changeUrl(path, visibility) {
     var newPath = '/view/' + path;
     if (!isScrollDown) {
-      if (visibility == 'top') {
-        // Router.push('/view/[url]', newPath, {shallow:true})
+      if (visibility === 'top') {
+        // Router.push('/view/[url]', newPath, { shallow: true })
         window.history.pushState({ page: path }, path, newPath);
-        if (_this3.props.pageview) {
-          _this3.props.pageview(newPath);
+        if (props.pageview) {
+          props.pageview(newPath);
         }
-
-        _this3.refreshAdd(path);
+        refreshAdd(path);
       }
     } else {
-      if (visibility == 'bottom') {
-        // Router.push('/view/[url]', newPath, {shallow:true})
+      if (visibility === 'bottom') {
+        // Router.push('/view/[url]', newPath, { shallow: true })
         window.history.pushState({ page: path }, path, newPath);
-        if (_this3.props.pageview) {
-          _this3.props.pageview(newPath);
+        if (props.pageview) {
+          props.pageview(newPath);
         }
 
-        _this3.refreshAdd(path);
+        refreshAdd(path);
       }
     }
   };
+
+  if (prevUrl && prevUrl.length) {
+    return React__default.createElement(
+      TemplateNormal,
+      { config: pageConfig, website: website, keywords: keywords, description: summary, title: title, showRightAd: !main_36 },
+      React__default.createElement(
+        InfiniteScroll,
+        { dataLength: queueData.length, next: loadmore, scrollThreshold: 0.8, hasMore: true },
+        queueData.map(function (article, index) {
+          return React__default.createElement(Article, _extends$2({ key: index }, props, { changeUrl: changeUrl, article: article }));
+        })
+      )
+    );
+  } else {
+    return null;
+  }
 };
 
 var KMTracker = function KMTracker(props) {