@economic/taco 2.47.0-server-1 → 2.47.0-server-2

package/dist/taco.cjs.development.js

@@ -22098,6 +22098,249 @@ Navigation2.Link = Link$3;
 Navigation2.Section = Section;
 Navigation2.Content = Content$a;
 
+const DATASET_SIZE_MULTIPLIER = 15;
+function useTableDataLoader2(fetchPage, fetchAll, options = {
+  pageSize: DEFAULT_PAGE_SIZE
+}) {
+  const loadPage = function (pageIndex, sorting, filters, search, hiddenColumns, reset = false) {
+    try {
+      if (_hasFetchedAll.current) {
+        return Promise.resolve();
+      }
+      // if page is already loading, abort, otherwise mark it as loading
+      if (_pendingPageRequests.current[pageIndex]) {
+        return Promise.resolve();
+      } else {
+        _pendingPageRequests.current[pageIndex] = true;
+      }
+      // if the page is already loaded and has actual rows, abort
+      if (data.pages.includes(pageIndex)) {
+        const position = data.pages.indexOf(pageIndex);
+        if (data.rows[position * pageSize] !== undefined) {
+          return Promise.resolve();
+        }
+      }
+      // set the sorting so we can track if it changed between loads
+      _lastUsedSorting.current = sorting;
+      // set the filters so we can track if it changed between loads
+      _lastUsedFilters.current = filters;
+      const direction = getDirection2(pageIndex, _lastFetchedPage.current);
+      const _temp2 = _finallyRethrows(function () {
+        return _catch(function () {
+          return Promise.resolve(fetchPage(pageIndex, pageSize, sorting, filters, search, hiddenColumns)).then(function (response) {
+            length.current = response.length;
+            // update state, here we do some "magic" to support "load in place"
+            setData(currentData => {
+              const nextPages = getPages(pageIndex, _lastFetchedPage.current, reset ? [] : currentData.pages, direction);
+              let nextRows = currentData.rows;
+              if (reset || !direction) {
+                const index = nextPages.indexOf(pageIndex);
+                const startIndex = (index > -1 ? index : 0) * pageSize;
+                if (reset) {
+                  nextRows = [].concat(response.data);
+                } else if (startIndex > 0 || pageIndex === 0) {
+                  nextRows = Array(startIndex).fill(undefined).concat(response.data);
+                } else if (startIndex === 0) {
+                  nextRows = response.data.concat(currentData.rows.slice(pageSize));
+                }
+              } else if (direction === 'forward') {
+                // if the new data will exceed the dataset size, then chop off the start or end
+                // this keeps the stored dataset to our preferred size
+                if (currentData.rows.length >= DATASET_SIZE) {
+                  nextRows = currentData.rows.slice(DEFAULT_PAGE_SIZE).concat(response.data);
+                } else {
+                  nextRows = currentData.rows.concat(response.data);
+                }
+              } else if (direction === 'backward') {
+                if (currentData.rows.length >= DATASET_SIZE) {
+                  nextRows = response.data.concat(currentData.rows.slice(0, -1 * pageSize));
+                } else {
+                  nextRows = currentData.rows.concat(response.data);
+                }
+              }
+              return {
+                rows: nextRows,
+                pages: nextPages
+              };
+            });
+          });
+        }, function () {});
+      }, function (_wasThrown2, _result2) {
+        _hasFetchedAll.current = false;
+        // reset pending requests
+        delete _pendingPageRequests.current[pageIndex];
+        // update the last loaded page
+        _lastFetchedPage.current = {
+          index: pageIndex,
+          direction
+        };
+        if (_wasThrown2) throw _result2;
+        return _result2;
+      });
+      return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  const {
+    pageSize
+  } = options;
+  const DATASET_SIZE = DATASET_SIZE_MULTIPLIER * pageSize;
+  // track the data length, we don't know it until the first request
+  const length = React__default.useRef(0);
+  // data will be filled after the first request
+  const [data, setData] = React__default.useState({
+    rows: [],
+    pages: []
+  });
+  // track which pages have been loaded to dedupe requests
+  const _pendingPageRequests = React__default.useRef({});
+  const _lastUsedSorting = React__default.useRef([]);
+  const _lastUsedFilters = React__default.useRef([]);
+  const _lastUsedSearch = React__default.useRef();
+  const _lastUsedHiddenColumns = React__default.useRef([]);
+  const _lastFetchedPage = React__default.useRef({
+    index: undefined,
+    direction: undefined
+  });
+  const _hasFetchedAll = React__default.useRef(false);
+  const loadAll = function (sorting, filters, search, hiddenColumns) {
+    try {
+      _hasFetchedAll.current = true;
+      // set the sorting so we can track if it changed between loads
+      _lastUsedSorting.current = sorting;
+      // set the filters so we can track if it changed between loads
+      _lastUsedFilters.current = filters;
+      const _temp = _finallyRethrows(function () {
+        return _catch(function () {
+          return Promise.resolve(fetchAll(sorting, filters, search, hiddenColumns)).then(function (response) {
+            length.current = response.length;
+            setData({
+              rows: response.data,
+              pages: Array.from(Array(response.length / pageSize).keys())
+            });
+          });
+        }, function () {});
+      }, function (_wasThrown, _result) {
+        // reset pending requests
+        _pendingPageRequests.current = {};
+        if (_wasThrown) throw _result;
+        return _result;
+      });
+      return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  const invalidate = function () {
+    try {
+      // reset stuff
+      _pendingPageRequests.current = {};
+      _hasFetchedAll.current = false;
+      // load the last page that we scrolled to
+      return loadPage(getCurrentPage(data.pages, _lastFetchedPage.current), _lastUsedSorting.current, _lastUsedFilters.current, _lastUsedSearch.current, _lastUsedHiddenColumns.current, true);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  // search works client side - it fetches all then works client side - so these handlers are a little "weird"
+  // if a search is currently "active", we need to re load all because
+  const handleSort = function (sorting) {
+    try {
+      _lastUsedSorting.current = sorting;
+      // reset stuff
+      _pendingPageRequests.current = {};
+      _hasFetchedAll.current = false;
+      return loadPage(getCurrentPage(data.pages, _lastFetchedPage.current), sorting, _lastUsedFilters.current, _lastUsedSearch.current, _lastUsedHiddenColumns.current, true);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  const handleFilter = function (filters, hiddenColumns) {
+    try {
+      _lastUsedFilters.current = filters;
+      _lastUsedHiddenColumns.current = hiddenColumns;
+      // reset stuff
+      _pendingPageRequests.current = {};
+      _hasFetchedAll.current = false;
+      return loadPage(getCurrentPage(data.pages, _lastFetchedPage.current), _lastUsedSorting.current, filters, _lastUsedSearch.current, hiddenColumns, true);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  const handleSearch = function (search, hiddenColumns) {
+    try {
+      _lastUsedSearch.current = search;
+      _lastUsedHiddenColumns.current = hiddenColumns;
+      // reset stuff
+      _pendingPageRequests.current = {};
+      _hasFetchedAll.current = false;
+      return loadPage(getCurrentPage(data.pages, _lastFetchedPage.current), _lastUsedSorting.current, _lastUsedFilters.current, search, hiddenColumns, true);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  return [{
+    data: data.rows,
+    pages: data.pages,
+    length: length.current,
+    loadAll,
+    loadPage,
+    onChangeFilter: handleFilter,
+    onChangeSearch: handleSearch,
+    onChangeSort: handleSort,
+    pageSize,
+    _experimentalDataLoader2: true
+  }, invalidate];
+}
+function getCurrentPage(currentPages, lastFetchedPage) {
+  if (currentPages.length <= 2) {
+    var _currentPages$;
+    return (_currentPages$ = currentPages[0]) !== null && _currentPages$ !== void 0 ? _currentPages$ : 0;
+  }
+  const middle = Math.floor(DATASET_SIZE_MULTIPLIER / 2);
+  if (lastFetchedPage.index) {
+    if (!lastFetchedPage.direction) {
+      return lastFetchedPage.index;
+    }
+    return lastFetchedPage.direction === 'forward' ? lastFetchedPage.index + middle : lastFetchedPage.index - middle;
+  }
+  return 0;
+}
+function getDirection2(pageIndex, lastUsedPage) {
+  if (lastUsedPage.index === undefined) {
+    return undefined;
+  }
+  if (pageIndex > lastUsedPage.index) {
+    if (lastUsedPage.index + 1 === pageIndex || lastUsedPage.index + DATASET_SIZE_MULTIPLIER === pageIndex) {
+      return 'forward';
+    }
+  } else if (pageIndex < lastUsedPage.index) {
+    if (lastUsedPage.index - 1 === pageIndex || lastUsedPage.index - DATASET_SIZE_MULTIPLIER === pageIndex) {
+      return 'backward';
+    }
+  }
+  return undefined;
+}
+function getPages(pageIndex, lastUsedPage, currentPages, direction) {
+  if (currentPages.length && (pageIndex === lastUsedPage.index || currentPages.includes(pageIndex))) {
+    return currentPages;
+  }
+  if (direction === 'forward') {
+    const nextPages = currentPages.length === DATASET_SIZE_MULTIPLIER ? currentPages.slice(1) : currentPages;
+    return nextPages.concat(pageIndex);
+  }
+  if (direction === 'backward') {
+    const nextPages = currentPages.length === DATASET_SIZE_MULTIPLIER ? currentPages.slice(0, -1) : currentPages;
+    return [pageIndex].concat(nextPages);
+  }
+  if (pageIndex === 0) {
+    return [0];
+  }
+  // don't go forward, the current page will trigger load of the next page
+  return [pageIndex - 1, pageIndex];
+}
+
 const useBoundaryOverflowDetection = (ref, dependencies = []) => {
   const [boundaryIndex, setBoundaryIndex] = React__default.useState();
   const dimensions = useBoundingClientRectListener(ref, dependencies);
@@ -22237,6 +22480,7 @@ exports.useOnClickOutside = useOnClickOutside;
 exports.usePagination = usePagination;
 exports.useRadioGroup = useRadioGroup;
 exports.useTableDataLoader = useTableDataLoader;
+exports.useTableDataLoader2 = useTableDataLoader2;
 exports.useTableRowCreation = useTableRowCreation;
 exports.useToast = useToast;
 //# sourceMappingURL=taco.cjs.development.js.map