@addsign/moje-agenda-shared-lib 2.0.60 → 2.0.62

package/dist/components/datatable/DataTableServer.js

@@ -21733,22 +21733,24 @@ function DataTableServer({
   const bottomScrollbarRef = useRef(null);
   const tableRef = useRef(null);
   const syncWidthRef = useRef(null);
-  const [itemsPerPageLocal, setItemsPerPageLocal] = useState();
+  const [itemsPerPageLocal, setItemsPerPageLocal] = useState(10);
   const federationContext = useFederationContext();
   const [data, setData] = useState();
   const [isLoading, setIsLoading] = useState(false);
   const [isLocalStorageLoaded, setIsLocalStorageLoaded] = useState(false);
   const [tableKey, setTableKey] = useState(0);
   const [hasMounted, setHasMounted] = useState(false);
-  const [currentPage, setCurrentPage] = useState();
+  const [currentPage, setCurrentPage] = useState(0);
   const [selectedItems, setSelectedItems] = useState([]);
   const [fulltextSearch, setFulltextSearch] = useState("");
   const [filterOptions, setFilterOptions] = useState({});
   const [columnFilters, setColumnFilters] = useState(
     {}
   );
-  const [showColFilters, setShowColFilters] = useState();
+  const [showColFilters, setShowColFilters] = useState(false);
   const [sortConfig, setSortConfig] = useState(null);
+  const prevDepsRef = useRef([]);
+  const prevFilterDepsRef = useRef([]);
   const createDataPageable = (response, itemsPerPage) => {
     var _a2, _b2, _c, _d;
     const isPageable = !!((_a2 = response.data) == null ? void 0 : _a2.content);
@@ -21770,21 +21772,47 @@ function DataTableServer({
     return showColFilters ? { ...columnFilters, ...filters } : filters || {};
   }, [columnFilters, filters, showColFilters]);
   useEffect(() => {
-    setReloadData(true);
+    const currentDeps = [
+      url,
+      showColFilters,
+      columnFilters,
+      itemsPerPageLocal,
+      currentPage,
+      sortConfig,
+      filters,
+      tableKey
+    ];
+    const hasChanged = currentDeps.some((dep, index) => {
+      return JSON.stringify(dep) !== JSON.stringify(prevDepsRef.current[index]);
+    });
+    if (hasChanged) {
+      console.log(
+        "setting reloadData - actual change detected",
+        url,
+        showColFilters,
+        columnFilters,
+        itemsPerPageLocal,
+        currentPage,
+        sortConfig,
+        filters,
+        tableKey,
+        reloadData
+      );
+      setReloadData(true);
+    }
+    prevDepsRef.current = currentDeps;
   }, [
     url,
     showColFilters,
-    // id,
     columnFilters,
     itemsPerPageLocal,
     currentPage,
     sortConfig,
-    federationContext.apiClient,
-    federationContext.emitter,
     filters,
     tableKey
   ]);
   useEffect(() => {
+    console.log("reloadData", reloadData);
     if (reloadData) {
       if (abortControllerRef.current) {
         abortControllerRef.current.abort();
@@ -21877,51 +21905,68 @@ function DataTableServer({
     }
   }, [id]);
   useEffect(() => {
-    const fetchFilterOptions = async (column) => {
-      if (column.filterOptions) {
-        return column.filterOptions;
-      } else if (column.filterSource) {
-        try {
-          const response = await federationContext.apiClient.get(
-            column.filterSource
-          );
-          const options = response.data.map((item) => {
-            var _a2, _b2;
-            return {
-              value: (_a2 = item[column.filterValueKey]) == null ? void 0 : _a2.toString(),
-              label: (_b2 = item[column.filterLabelKey]) == null ? void 0 : _b2.toString()
-            };
-          });
-          return options;
-        } catch (error) {
-          console.error("Error fetching filter options:", error);
-          return [];
-        }
+    const currentFilterDeps = [columns, federationContext.apiClient];
+    const hasFilterChanged = currentFilterDeps.some((dep, index) => {
+      const prev = prevFilterDepsRef.current[index];
+      if (index === 1) {
+        return dep !== prev;
       } else {
-        return [];
+        return JSON.stringify(dep) !== JSON.stringify(prev);
       }
-    };
-    const updateFilterOptions = async () => {
-      const newFilterOptions = {};
-      for (const column of columns) {
-        if ((column.filterType === "select" || column.filterType === "multi-select") && (column.filterSource || column.filterOptions) && column.filterValueKey && column.filterLabelKey && column.filterParam) {
-          const options = await fetchFilterOptions(column);
-          if (options && column.filterType === "select") {
-            const filteredOptions = options.filter(
-              (option) => option.value !== null && option.value !== void 0 && option.value !== ""
+    });
+    if (hasFilterChanged) {
+      const fetchFilterOptions = async (column) => {
+        if (column.filterOptions) {
+          return column.filterOptions;
+        } else if (column.filterSource) {
+          try {
+            const response = await federationContext.apiClient.get(
+              column.filterSource
             );
-            newFilterOptions[column.filterParam] = [
-              { value: "__clear__", label: "Všechny" },
-              ...filteredOptions
-            ];
-          } else if (options && column.filterType === "multi-select") {
-            newFilterOptions[column.filterParam] = options;
+            const options = response.data.map((item) => {
+              var _a2, _b2;
+              return {
+                value: (_a2 = item[column.filterValueKey]) == null ? void 0 : _a2.toString(),
+                label: (_b2 = item[column.filterLabelKey]) == null ? void 0 : _b2.toString()
+              };
+            });
+            return options;
+          } catch (error) {
+            console.error("Error fetching filter options:", error);
+            return [];
           }
+        } else {
+          return [];
         }
-      }
-      setFilterOptions(newFilterOptions);
-    };
-    updateFilterOptions();
+      };
+      const updateFilterOptions = async () => {
+        const newFilterOptions = {};
+        for (const column of columns) {
+          if ((column.filterType === "select" || column.filterType === "multi-select") && (column.filterSource || column.filterOptions) && column.filterValueKey && column.filterLabelKey && column.filterParam) {
+            const options = await fetchFilterOptions(column);
+            if (options && column.filterType === "select") {
+              const filteredOptions = options.filter(
+                (option) => option.value !== null && option.value !== void 0 && option.value !== ""
+              );
+              newFilterOptions[column.filterParam] = [
+                { value: "__clear__", label: "Všechny" },
+                ...filteredOptions
+              ];
+            } else if (options && column.filterType === "multi-select") {
+              newFilterOptions[column.filterParam] = options;
+            }
+          }
+        }
+        setFilterOptions(newFilterOptions);
+      };
+      console.log(
+        "updateFilterOptions - actual change detected",
+        columns,
+        federationContext.apiClient
+      );
+      updateFilterOptions();
+    }
+    prevFilterDepsRef.current = currentFilterDeps;
   }, [columns, federationContext.apiClient]);
   const hasSomeColFilters = useMemo(() => {
     return columns.some((column) => !!column.filterParam);
@@ -22297,13 +22342,7 @@ function DataTableServer({
                                         filters || {}
                                       ).includes(String(filterParam)),
                                       children: [
-                                        /* @__PURE__ */ jsx(
-                                          SelectTrigger,
-                                          {
-                                            className: "flex-1 w-full px-2 font-normal placeholder-muted-foreground",
-                                            children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Zadejte filtr" })
-                                          }
-                                        ),
+                                        /* @__PURE__ */ jsx(SelectTrigger, { className: "flex-1 w-full px-2 font-normal placeholder-muted-foreground", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Zadejte filtr" }) }),
                                         /* @__PURE__ */ jsx(SelectContent, { children: (_c = (_b2 = filterOptions[String(filterParam)]) == null ? void 0 : _b2.filter(
                                           (option) => option.value !== null && option.value !== void 0 && option.value !== ""
                                         )) == null ? void 0 : _c.map((option) => {