@mjhls/mjh-framework 1.0.850-beta.1 → 1.0.850-beta.3

package/dist/cjs/QueueDeckExpanded.js

@@ -1109,107 +1109,9 @@ var renderCardImage = function renderCardImage(row, client) {
   var imageMaxHeight = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
   var imageFit = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : null;
 
-  var url = urlFor({ client: client, source: row.thumbnail, imageHeight: imageHeight, imageWidth: imageWidth, imageMaxHeight: imageMaxHeight, imageFit: imageFit });
-
-  return url;
+  return urlFor({ client: client, source: row.thumbnail, imageHeight: imageHeight, imageWidth: imageWidth, imageMaxHeight: imageMaxHeight, imageFit: imageFit });
 };
 
-// const loadMore = (values, setValues, itemsPerPage) => {
-//   console.log('Values:::', values)
-//   setValues({
-//     page: values.page + 1,
-//     from: values.from + itemsPerPage,
-//     to: values.to + itemsPerPage
-//   })
-// }
-
-// const loadData = (values, query, client, params, setData, setScrolling, setLastDataSize, pointer, pointerArray) => {
-//   params = {
-//     ...params,
-//     from: values.from,
-//     to: values.to
-//   }
-//   client.fetch(query, params).then((dataArr) => {
-//     if (pointer && pointerArray) {
-//       dataArr = dataArr[pointerArray][pointer]
-//     }
-
-//     if (!dataArr) {
-//       dataArr = []
-//     }
-
-//     dataArr = dataArr.map((item) => ({
-//       ...item,
-//       pageNumber: values.page
-//     }))
-
-//     if (dataArr.length > 0) {
-//       setData((prevData) => [...prevData, ...dataArr])
-//       setLastDataSize(dataArr.length)
-//       setScrolling(true)
-//     } else {
-//       setLastDataSize(0)
-//       setScrolling(false)
-//     }
-//   })
-// }
-
-// const changePageNumber = (pageNumber, seoPaginate, pageview, router, currentPage, setCurrentPage, itemsPerPage, itemIndex) => {
-//   if (seoPaginate) {
-//     let path = router.asPath
-//     let qrIndex = path.indexOf('?')
-//     let pathname = router.pathname
-//     let queryString = ''
-
-//     if (qrIndex > 0) {
-//       path = path.substring(1, qrIndex)
-
-//       let partialQS = router.asPath.substring(qrIndex + 1)
-//       let partialQSArr = partialQS.split('&')
-
-//       // exclude page=xxx from query string
-//       partialQSArr.map((item) => {
-//         let itemArr = item.split('=')
-//         let key = itemArr[0]
-//         let val = itemArr[1]
-
-//         if (key !== 'page') {
-//           queryString += (queryString.length === 0 ? '' : '&') + key + '=' + val
-//         }
-//       })
-//     }
-
-//     if (queryString.length > 0) {
-//       path += '?' + queryString
-//     }
-
-//     pageNumber = parseInt(pageNumber)
-//     // const index = Number(itemIndex)
-//     // const perPage = Number(itemsPerPage)
-
-//     // pageNumber = Math.ceil((index + 1) / perPage)
-
-//     if (currentPage !== pageNumber) {
-//       DFPManager.refresh()
-
-//       setCurrentPage(pageNumber)
-//       if (path[0] !== '/') {
-//         path = '/' + path
-//       }
-
-//       let newPath = pageNumber === 1 ? `${path}` : `${path}${queryString.length > 0 ? '&' : '?'}page=${pageNumber}`
-
-//       // if (pageview) {
-//       //   pageview(newPath)
-//       // }
-
-//       router.push(pathname, newPath, {
-//         shallow: true
-//       })
-//     }
-//   }
-// }
-
 var checkExternalUrl = function checkExternalUrl(url) {
   return new RegExp(['http', 'https'].join('|')).test(url);
 };
@@ -1318,24 +1220,6 @@ var CardLoader = function CardLoader(_ref) {
     }
   }
 
-  // // 'articleCount' is New parameter to use instead of 'index' while passing to 'changePageNumber()'
-  // // 'index' was including the indexes for infeed ads along with article count making the page number change before it reaches last article.
-  // // 'articleCount' will be the indexes of only the articles in the deck.
-  // let articleCount = -1
-  // data = data.map((ele, i) => {
-  //   if (ele._type === 'lg-infeed') {
-  //     //  Setting pos as top2 for the first occurence of large infeed ad
-  //     // const pos = data.indexOf(data.find((d) => d._type === 'lg-infeed')) === i ? 'top2' : `lg-infeed_${i}`
-  //     return { ...ele, slotId: `lg-infeed_${i}`, targeting: { ...ele.targeting, pos: 'lg-infeed' } }
-  //   } else if (ele._type === 'article') {
-  //     // incrementing 'articleCount' for each article.
-  //     ++articleCount
-  //     return { ...ele, articleCount: articleCount }
-  //   } else {
-  //     return ele
-  //   }
-  // })
-
   var featureCount = 0;
   return React__default.createElement(
     'div',
@@ -2344,12 +2228,12 @@ var Pagination = function Pagination(_ref2) {
       itemsPerPage = _ref2.itemsPerPage,
       currentPage = _ref2.currentPage,
       handlePageChange = _ref2.handlePageChange,
-      dataLength = _ref2.dataLength;
+      data = _ref2.data;
 
   var pageCount = Math.ceil(totalPostsCount / itemsPerPage);
   return React__default.createElement(
     'div',
-    null,
+    { className: '' + (!data ? 'd-none' : 'd-block') },
     React__default.createElement(ReactPaginate, {
       pageCount: pageCount,
       marginPagesDisplayed: 1,
@@ -2436,23 +2320,22 @@ var QueueDeckExpanded = function QueueDeckExpanded(props) {
 
   var fetcher = function () {
     var _ref4 = asyncToGenerator._asyncToGenerator( /*#__PURE__*/asyncToGenerator.regenerator.mark(function _callee(currentPage) {
-      var start, params;
+      var start;
       return asyncToGenerator.regenerator.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
               start = (currentPage - 1) * itemsPerPage;
-              params = _extends._extends({}, params, {
+              _context.next = 3;
+              return client.fetch(query, _extends._extends({}, params, {
                 from: start,
                 to: start + itemsPerPage
-              });
-              _context.next = 4;
-              return client.fetch(query, params);
+              }));
 
-            case 4:
+            case 3:
               return _context.abrupt('return', _context.sent);
 
-            case 5:
+            case 4:
             case 'end':
               return _context.stop();
           }
@@ -2466,17 +2349,17 @@ var QueueDeckExpanded = function QueueDeckExpanded(props) {
   }();
 
   var onLoadDataSuccess = function onLoadDataSuccess() {
-    document.body.scrollTop = 0;
-    document.documentElement.scrollTop = 0;
     seoPaginate && seoPagination(currentPage);
     index.lib_3.refresh();
   };
 
-  var _useSWR = useSWR([currentPage], fetcher, { initialData: initialData, onSuccess: onLoadDataSuccess }),
+  var _useSWR = useSWR([currentPage], fetcher, { initialData: currentPage === initialCurrentPage ? initialData : undefined, onSuccess: onLoadDataSuccess }),
       data = _useSWR.data;
 
   var handlePageChange = function handlePageChange(selectedPage) {
     setCurrentPage(selectedPage);
+    document.body.scrollTop = 0;
+    document.documentElement.scrollTop = 0;
   };
 
   var seoPagination = function seoPagination(pageNumber) {
@@ -2508,7 +2391,19 @@ var QueueDeckExpanded = function QueueDeckExpanded(props) {
   return React__default.createElement(
     'div',
     null,
-    React__default.createElement(
+    !data ? React__default.createElement(
+      'div',
+      { className: 'd-flex justify-content-center', style: { marginTop: '100px' } },
+      React__default.createElement(
+        reactBootstrap.Spinner,
+        { animation: 'border', role: 'status' },
+        React__default.createElement(
+          'span',
+          { className: 'sr-only' },
+          'Loading...'
+        )
+      )
+    ) : React__default.createElement(
       reactBootstrap.Container,
       null,
       React__default.createElement(CardLoader, {
@@ -2533,15 +2428,15 @@ var QueueDeckExpanded = function QueueDeckExpanded(props) {
         showTimeDif: showTimeDiff,
         showTaxonomies: showTaxonomies,
         showIntro: showIntro
-      }),
-      React__default.createElement(Pagination, {
-        totalPostsCount: props.totalPostsCount,
-        itemsPerPage: props.params.itemsPerPage,
-        currentPage: props.currentPage,
-        handlePageChange: handlePageChange,
-        dataLength: data.length
       })
-    )
+    ),
+    React__default.createElement(Pagination, {
+      totalPostsCount: props.totalPostsCount,
+      itemsPerPage: props.params.itemsPerPage,
+      currentPage: props.currentPage,
+      handlePageChange: handlePageChange,
+      data: data
+    })
   );
 };
 

package/dist/esm/QueueDeckExpanded.js

@@ -35,7 +35,7 @@ import { l as lodash } from './lodash-17fdfebb.js';
 import { A as ADlgInfeed } from './ADlgInfeed-4473ee3b.js';
 import { g as getContentCategory } from './getContentCategory-15dcc413.js';
 import { A as AuthorComponent } from './AuthorComponent-34b16174.js';
-import { Container, Media } from 'react-bootstrap';
+import { Spinner, Container, Media } from 'react-bootstrap';
 import timeDifferenceCalc from './timeDifferenceCalc.js';
 
 var reactPaginate = createCommonjsModule(function (module, exports) {
@@ -1103,107 +1103,9 @@ var renderCardImage = function renderCardImage(row, client) {
   var imageMaxHeight = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
   var imageFit = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : null;
 
-  var url = urlFor({ client: client, source: row.thumbnail, imageHeight: imageHeight, imageWidth: imageWidth, imageMaxHeight: imageMaxHeight, imageFit: imageFit });
-
-  return url;
+  return urlFor({ client: client, source: row.thumbnail, imageHeight: imageHeight, imageWidth: imageWidth, imageMaxHeight: imageMaxHeight, imageFit: imageFit });
 };
 
-// const loadMore = (values, setValues, itemsPerPage) => {
-//   console.log('Values:::', values)
-//   setValues({
-//     page: values.page + 1,
-//     from: values.from + itemsPerPage,
-//     to: values.to + itemsPerPage
-//   })
-// }
-
-// const loadData = (values, query, client, params, setData, setScrolling, setLastDataSize, pointer, pointerArray) => {
-//   params = {
-//     ...params,
-//     from: values.from,
-//     to: values.to
-//   }
-//   client.fetch(query, params).then((dataArr) => {
-//     if (pointer && pointerArray) {
-//       dataArr = dataArr[pointerArray][pointer]
-//     }
-
-//     if (!dataArr) {
-//       dataArr = []
-//     }
-
-//     dataArr = dataArr.map((item) => ({
-//       ...item,
-//       pageNumber: values.page
-//     }))
-
-//     if (dataArr.length > 0) {
-//       setData((prevData) => [...prevData, ...dataArr])
-//       setLastDataSize(dataArr.length)
-//       setScrolling(true)
-//     } else {
-//       setLastDataSize(0)
-//       setScrolling(false)
-//     }
-//   })
-// }
-
-// const changePageNumber = (pageNumber, seoPaginate, pageview, router, currentPage, setCurrentPage, itemsPerPage, itemIndex) => {
-//   if (seoPaginate) {
-//     let path = router.asPath
-//     let qrIndex = path.indexOf('?')
-//     let pathname = router.pathname
-//     let queryString = ''
-
-//     if (qrIndex > 0) {
-//       path = path.substring(1, qrIndex)
-
-//       let partialQS = router.asPath.substring(qrIndex + 1)
-//       let partialQSArr = partialQS.split('&')
-
-//       // exclude page=xxx from query string
-//       partialQSArr.map((item) => {
-//         let itemArr = item.split('=')
-//         let key = itemArr[0]
-//         let val = itemArr[1]
-
-//         if (key !== 'page') {
-//           queryString += (queryString.length === 0 ? '' : '&') + key + '=' + val
-//         }
-//       })
-//     }
-
-//     if (queryString.length > 0) {
-//       path += '?' + queryString
-//     }
-
-//     pageNumber = parseInt(pageNumber)
-//     // const index = Number(itemIndex)
-//     // const perPage = Number(itemsPerPage)
-
-//     // pageNumber = Math.ceil((index + 1) / perPage)
-
-//     if (currentPage !== pageNumber) {
-//       DFPManager.refresh()
-
-//       setCurrentPage(pageNumber)
-//       if (path[0] !== '/') {
-//         path = '/' + path
-//       }
-
-//       let newPath = pageNumber === 1 ? `${path}` : `${path}${queryString.length > 0 ? '&' : '?'}page=${pageNumber}`
-
-//       // if (pageview) {
-//       //   pageview(newPath)
-//       // }
-
-//       router.push(pathname, newPath, {
-//         shallow: true
-//       })
-//     }
-//   }
-// }
-
 var checkExternalUrl = function checkExternalUrl(url) {
   return new RegExp(['http', 'https'].join('|')).test(url);
 };
@@ -1312,24 +1214,6 @@ var CardLoader = function CardLoader(_ref) {
     }
   }
 
-  // // 'articleCount' is New parameter to use instead of 'index' while passing to 'changePageNumber()'
-  // // 'index' was including the indexes for infeed ads along with article count making the page number change before it reaches last article.
-  // // 'articleCount' will be the indexes of only the articles in the deck.
-  // let articleCount = -1
-  // data = data.map((ele, i) => {
-  //   if (ele._type === 'lg-infeed') {
-  //     //  Setting pos as top2 for the first occurence of large infeed ad
-  //     // const pos = data.indexOf(data.find((d) => d._type === 'lg-infeed')) === i ? 'top2' : `lg-infeed_${i}`
-  //     return { ...ele, slotId: `lg-infeed_${i}`, targeting: { ...ele.targeting, pos: 'lg-infeed' } }
-  //   } else if (ele._type === 'article') {
-  //     // incrementing 'articleCount' for each article.
-  //     ++articleCount
-  //     return { ...ele, articleCount: articleCount }
-  //   } else {
-  //     return ele
-  //   }
-  // })
-
   var featureCount = 0;
   return React__default.createElement(
     'div',
@@ -2338,12 +2222,12 @@ var Pagination = function Pagination(_ref2) {
       itemsPerPage = _ref2.itemsPerPage,
       currentPage = _ref2.currentPage,
       handlePageChange = _ref2.handlePageChange,
-      dataLength = _ref2.dataLength;
+      data = _ref2.data;
 
   var pageCount = Math.ceil(totalPostsCount / itemsPerPage);
   return React__default.createElement(
     'div',
-    null,
+    { className: '' + (!data ? 'd-none' : 'd-block') },
     React__default.createElement(ReactPaginate, {
       pageCount: pageCount,
       marginPagesDisplayed: 1,
@@ -2430,23 +2314,22 @@ var QueueDeckExpanded = function QueueDeckExpanded(props) {
 
   var fetcher = function () {
     var _ref4 = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(currentPage) {
-      var start, params;
+      var start;
       return regenerator.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
               start = (currentPage - 1) * itemsPerPage;
-              params = _extends({}, params, {
+              _context.next = 3;
+              return client.fetch(query, _extends({}, params, {
                 from: start,
                 to: start + itemsPerPage
-              });
-              _context.next = 4;
-              return client.fetch(query, params);
+              }));
 
-            case 4:
+            case 3:
               return _context.abrupt('return', _context.sent);
 
-            case 5:
+            case 4:
             case 'end':
               return _context.stop();
           }
@@ -2460,17 +2343,17 @@ var QueueDeckExpanded = function QueueDeckExpanded(props) {
   }();
 
   var onLoadDataSuccess = function onLoadDataSuccess() {
-    document.body.scrollTop = 0;
-    document.documentElement.scrollTop = 0;
     seoPaginate && seoPagination(currentPage);
     lib_3.refresh();
   };
 
-  var _useSWR = useSWR([currentPage], fetcher, { initialData: initialData, onSuccess: onLoadDataSuccess }),
+  var _useSWR = useSWR([currentPage], fetcher, { initialData: currentPage === initialCurrentPage ? initialData : undefined, onSuccess: onLoadDataSuccess }),
       data = _useSWR.data;
 
   var handlePageChange = function handlePageChange(selectedPage) {
     setCurrentPage(selectedPage);
+    document.body.scrollTop = 0;
+    document.documentElement.scrollTop = 0;
   };
 
   var seoPagination = function seoPagination(pageNumber) {
@@ -2502,7 +2385,19 @@ var QueueDeckExpanded = function QueueDeckExpanded(props) {
   return React__default.createElement(
     'div',
     null,
-    React__default.createElement(
+    !data ? React__default.createElement(
+      'div',
+      { className: 'd-flex justify-content-center', style: { marginTop: '100px' } },
+      React__default.createElement(
+        Spinner,
+        { animation: 'border', role: 'status' },
+        React__default.createElement(
+          'span',
+          { className: 'sr-only' },
+          'Loading...'
+        )
+      )
+    ) : React__default.createElement(
       Container,
       null,
       React__default.createElement(CardLoader, {
@@ -2527,15 +2422,15 @@ var QueueDeckExpanded = function QueueDeckExpanded(props) {
         showTimeDif: showTimeDiff,
         showTaxonomies: showTaxonomies,
         showIntro: showIntro
-      }),
-      React__default.createElement(Pagination, {
-        totalPostsCount: props.totalPostsCount,
-        itemsPerPage: props.params.itemsPerPage,
-        currentPage: props.currentPage,
-        handlePageChange: handlePageChange,
-        dataLength: data.length
       })
-    )
+    ),
+    React__default.createElement(Pagination, {
+      totalPostsCount: props.totalPostsCount,
+      itemsPerPage: props.params.itemsPerPage,
+      currentPage: props.currentPage,
+      handlePageChange: handlePageChange,
+      data: data
+    })
   );
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mjhls/mjh-framework",
-  "version": "1.0.850-beta.1",
+  "version": "1.0.850-beta.3",
   "description": "Foundation Framework",
   "author": "mjh-framework",
   "license": "MIT",