directual-web-components-v2 3.11.340 → 3.11.342

package/dist/index.modern.js

@@ -14959,6 +14959,19 @@ const SafeInnerHTML$1 = _ref => {
     html: html
   }));
 };
+const stripDataInfoContent = responseData => {
+  const dataInfo = _$1.get(responseData, "result.data", {}) || {};
+  if (dataInfo.content) {
+    delete dataInfo.content;
+  }
+  return dataInfo;
+};
+const normalizeObjectsList = result => {
+  if (!Array.isArray(result)) {
+    return [];
+  }
+  return result.filter(Boolean);
+};
 function FpsCards2(_ref2) {
   let {
     auth,
@@ -14984,8 +14997,6 @@ function FpsCards2(_ref2) {
   const card_border = _$1.get(data, "params.card_border", 1);
   const card_border_radius = _$1.get(data, "params.card_border_radius");
   const sl = _$1.get(data, "sl");
-  const cx = null;
-  const dqlService = debounce$1(performFiltering, 600);
   const comp_ID = _$1.get(data, "params.comp_ID");
   const [error, setError] = useState("");
   const getPageFromUrl = () => {
@@ -14994,6 +15005,8 @@ function FpsCards2(_ref2) {
     return savedPage ? Number(savedPage) : 0;
   };
   const [page, setPage] = useState(getPageFromUrl);
+  const [pageSizeOverride, setPageSizeOverride] = useState(null);
+  const pageSize = pageSizeOverride || data.pageSize || 10;
   const [dql, setDQL] = useState('');
   const [sort, setSort] = useState({});
   const [loading, setLoading] = useState(false);
@@ -15001,13 +15014,14 @@ function FpsCards2(_ref2) {
   const isFirstRender = useRef(true);
   const isRestoringFromUrl = useRef(false);
   const cardsContainerRef = useRef(null);
+  const refreshSeqRef = useRef(0);
+  const dqlService = useMemo(() => debounce$1(performFiltering, 600), []);
   const updatePageInUrl = newPage => {
     const urlParams = new URLSearchParams(window.location.search);
     urlParams.set("page_" + comp_ID, newPage);
     window.history.replaceState({}, '', window.location.pathname + "?" + urlParams.toString());
   };
   function performFiltering(dql, sort) {
-    clearTimeout(cx);
     console.log('=== F I L T E R I N G ! ===');
     console.log(dql);
     console.log('=== S O R T I N G ! ===');
@@ -15025,31 +15039,6 @@ function FpsCards2(_ref2) {
       setPage(0);
     }
   }
-  const nextPage = () => {
-    setPage(prevPage => {
-      const newPage = prevPage + 1;
-      updatePageInUrl(newPage);
-      return newPage;
-    });
-  };
-  const prevPage = () => {
-    setPage(prevPage => {
-      const newPage = Math.max(prevPage - 1, 0);
-      updatePageInUrl(newPage);
-      return newPage;
-    });
-  };
-  const firstPage = () => {
-    setPage(0);
-    updatePageInUrl(0);
-  };
-  const lastPage = () => {
-    const pageSize = _$1.get(dataInfo, 'pageable.pageSize', data.pageSize || 10);
-    const totalPages = Math.max(1, Math.ceil(_$1.get(dataInfo, 'total', 0) / pageSize));
-    const lastPageNumber = Math.max(0, totalPages - 1);
-    setPage(lastPageNumber);
-    updatePageInUrl(lastPageNumber);
-  };
   function checkHidden(element, debug, reverse, model) {
     let _conditions = _$1.get(element, "_conditions") || [];
     let _name = "";
@@ -15332,7 +15321,6 @@ function FpsCards2(_ref2) {
     if (isFlexLayout === void 0) {
       isFlexLayout = false;
     }
-    const pageSize = pageLoading ? _$1.get(dataInfo, 'pageable.pageSize', data.pageSize || 10) : data.pageSize || 10;
     const card_min_height = _$1.get(data, "params.card_min_height") || "120px";
     return Array(pageSize).fill(null).map((_, index) => /*#__PURE__*/React.createElement("div", {
       key: "skeleton-" + index,
@@ -15407,6 +15395,31 @@ function FpsCards2(_ref2) {
     "empty": false,
     "numberOfElements": 3
   });
+  const totalObjects = _$1.get(dataInfo, 'total', 0);
+  const totalPages = Math.max(1, Math.ceil(totalObjects / pageSize));
+  const nextPage = () => {
+    setPage(prevPage => {
+      const newPage = Math.min(prevPage + 1, totalPages - 1);
+      updatePageInUrl(newPage);
+      return newPage;
+    });
+  };
+  const prevPage = () => {
+    setPage(prevPage => {
+      const newPage = Math.max(prevPage - 1, 0);
+      updatePageInUrl(newPage);
+      return newPage;
+    });
+  };
+  const firstPage = () => {
+    setPage(0);
+    updatePageInUrl(0);
+  };
+  const lastPage = () => {
+    const lastPageNumber = Math.max(0, totalPages - 1);
+    setPage(lastPageNumber);
+    updatePageInUrl(lastPageNumber);
+  };
   useEffect(() => {
     setFavLoading(true);
     favoritesOn && favoritesEndpoint && callEndpointGET(favoritesEndpoint, {
@@ -15416,22 +15429,21 @@ function FpsCards2(_ref2) {
       setFavLoading(false);
     });
   }, []);
-  function refresh(dql, sort) {
+  function refresh(dql, sort, overridePage) {
     if (data && data.sl) {
       setPageLoading(true);
+      const seq = ++refreshSeqRef.current;
       const sortString = sort && sort.field ? sort.field + ":" + (sort.direction || 'asc') : '';
+      const requestPage = overridePage !== undefined ? overridePage : page;
       callEndpointGET(data.sl, {
-        pageSize: data.pageSize || 10,
-        page: page,
+        pageSize: pageSize,
+        page: requestPage,
         dql: dql,
         sort: sortString
-      }, (result, data) => {
-        const dataInfo = _$1.get(data, "result.data", {});
-        if (dataInfo && dataInfo.content) {
-          delete dataInfo.content;
-        }
-        setDataInfo(dataInfo);
-        setObjects(result);
+      }, (result, responseData) => {
+        if (seq !== refreshSeqRef.current) return;
+        setDataInfo(stripDataInfoContent(responseData));
+        setObjects(normalizeObjectsList(result));
         setPageLoading(false);
       });
     }
@@ -15445,9 +15457,9 @@ function FpsCards2(_ref2) {
       isFirstRender.current = false;
       return;
     }
-    console.log("page => " + page);
+    console.log("page => " + page + ", pageSize => " + pageSize);
     refresh(dql, sort);
-  }, [page, debug]);
+  }, [page, pageSize, debug]);
   useEffect(() => {
     if (debug) {
       console.log("Cards2 Debug mode: using data from props, skipping API calls");
@@ -15514,19 +15526,17 @@ function FpsCards2(_ref2) {
     if (data && data.sl) {
       console.log("Loading initial data from URL: page=" + urlPage + ", dql=" + urlDql);
       setPageLoading(true);
+      const seq = ++refreshSeqRef.current;
       const sortString = urlSort && urlSort.field ? urlSort.field + ":" + (urlSort.direction || 'asc') : '';
       callEndpointGET(data.sl, {
-        pageSize: data.pageSize || 10,
+        pageSize: pageSize,
         page: urlPage,
         dql: urlDql,
         sort: sortString
       }, (result, responseData) => {
-        const newDataInfo = _$1.get(responseData, "result.data", {});
-        if (newDataInfo && newDataInfo.content) {
-          delete newDataInfo.content;
-        }
-        setDataInfo(newDataInfo);
-        setObjects(result);
+        if (seq !== refreshSeqRef.current) return;
+        setDataInfo(stripDataInfoContent(responseData));
+        setObjects(normalizeObjectsList(result));
         setPageLoading(false);
         setInitialLoading(false);
       });
@@ -15542,20 +15552,18 @@ function FpsCards2(_ref2) {
     if (!socket) return;
     if (data && data.sl) {
       console.log("Socket changed, updating data in background...");
+      const seq = ++refreshSeqRef.current;
       const sortString = sort && sort.field ? sort.field + ":" + (sort.direction || 'asc') : '';
       callEndpointGET(data.sl, {
-        pageSize: data.pageSize || 10,
+        pageSize: pageSize,
         page: page,
         dql: dql,
         sort: sortString
       }, (result, responseData) => {
+        if (seq !== refreshSeqRef.current) return;
         console.log("Background update completed");
-        const dataInfo = _$1.get(responseData, "result.data", {});
-        if (dataInfo && dataInfo.content) {
-          delete dataInfo.content;
-        }
-        setDataInfo(dataInfo);
-        setObjects(result);
+        setDataInfo(stripDataInfoContent(responseData));
+        setObjects(normalizeObjectsList(result));
       });
     }
   }, [socket, debug]);
@@ -15594,7 +15602,10 @@ function FpsCards2(_ref2) {
     customHTMLfilters: _$1.get(data.params, 'filterParams.filteringSortingLayout') === 'custom',
     customHTMLfiltersContent: _$1.get(data.params, 'filterParams.filteringSortingLayoutHTML'),
     callEndpoint: (endpoint, params, finish, setOptions, setError) => {
-      const transformedArray = (inputArray, visibleNames) => _$1.map(inputArray, item => {
+      const transformedArray = (inputArray, visibleNames) => _$1.compact(_$1.map(inputArray || [], item => {
+        if (!item) {
+          return null;
+        }
         const parseJson = json => {
           if (!json) return {};
           let parsedJson = {};
@@ -15620,7 +15631,7 @@ function FpsCards2(_ref2) {
           image: _$1.get(rest, "userpic") || _$1.get(rest, "image") || _$1.get(rest, "picture") || _$1.get(rest, "photo"),
           description: description
         };
-      });
+      }));
       callEndpoint && callEndpoint(endpoint, "GET", undefined, params, (result, data, visibleNames) => {
         if (result == "ok") {
           finish && finish(transformedArray(data, visibleNames));
@@ -15652,7 +15663,7 @@ function FpsCards2(_ref2) {
       gap: grid_layout__gap,
       gridTemplateColumns: _$1.join(_$1.times(breakPoints[currentBP], _$1.constant('1fr')), ' ')
     }
-  }, initialLoading || pageLoading ? renderSkeletons() : objects.filter(object => !!_$1.get(object, field_quantity, 1)).map(object => /*#__PURE__*/React.createElement(CardWrapper, {
+  }, initialLoading || pageLoading ? renderSkeletons() : objects.filter(object => object && !!_$1.get(object, field_quantity, 1)).map(object => /*#__PURE__*/React.createElement(CardWrapper, {
     key: object.id,
     data: data,
     auth: auth,
@@ -15700,7 +15711,7 @@ function FpsCards2(_ref2) {
     style: {
       gap: flex_layout__gap
     }
-  }, initialLoading || pageLoading ? renderSkeletons(true) : objects.filter(object => !!_$1.get(object, field_quantity, 1)).map(object => /*#__PURE__*/React.createElement(CardWrapper, {
+  }, initialLoading || pageLoading ? renderSkeletons(true) : objects.filter(object => object && !!_$1.get(object, field_quantity, 1)).map(object => /*#__PURE__*/React.createElement(CardWrapper, {
     key: object.id,
     data: data,
     auth: auth,
@@ -15744,15 +15755,16 @@ function FpsCards2(_ref2) {
       }
     }
   }))), _$1.get(data, 'params.general.allowPagination') === true && /*#__PURE__*/React.createElement(NewPaging, {
-    totalObjects: _$1.get(dataInfo, 'total', 0),
-    objectsPerPage: _$1.get(dataInfo, 'pageable.pageSize', data.pageSize || 10),
+    totalObjects: totalObjects,
+    objectsPerPage: pageSize,
     showPageSizeDropdown: true,
     onPageSizeChange: newPageSize => {
-      console.log("onPageSizeChange");
-      console.log("newPageSize:", newPageSize);
+      setPageSizeOverride(newPageSize);
+      setPage(0);
+      updatePageInUrl(0);
     },
-    currentPage: _$1.get(dataInfo, 'pageable.page', 0),
-    totalPages: Math.max(1, Math.ceil(_$1.get(dataInfo, 'total', 0) / _$1.get(dataInfo, 'pageable.pageSize', data.pageSize || 10))),
+    currentPage: page,
+    totalPages: totalPages,
     nextPage: nextPage,
     dataInfo: dataInfo,
     prevPage: prevPage,