@azrico/reactgrid 1.3.13 → 1.3.15

package/CHANGELOG.md

@@ -2,6 +2,36 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [1.3.15](https://github.com/Azrideus/azrico-reactgrid/compare/v1.2.10...v1.3.15) (2023-08-19)
+
+
+### Features
+
+* DataGridSearchWrapper ([ebf3acf](https://github.com/Azrideus/azrico-reactgrid/commit/ebf3acff5f90c45090fad86be8e83e28744dd9dd))
+* editable can be a function ([6ea857e](https://github.com/Azrideus/azrico-reactgrid/commit/6ea857e4f403d2a334dc5e74065f6b8033277ca4))
+
+
+### Bug Fixes
+
+* DataGridDelayedSizeWrapper actual delayed ([2ddfd2f](https://github.com/Azrideus/azrico-reactgrid/commit/2ddfd2fb58c90bd906e1330f22f0ef7468d34afb))
+* onCellSelectionChange ([95c8f54](https://github.com/Azrideus/azrico-reactgrid/commit/95c8f540e94dde0c7e245fb29fb6afc7172957ec))
+* styling ([9018f75](https://github.com/Azrideus/azrico-reactgrid/commit/9018f7593e253720f751f52855a2d956dfc578ed))
+
+### [1.3.14](https://github.com/Azrideus/azrico-reactgrid/compare/v1.2.10...v1.3.14) (2023-08-19)
+
+
+### Features
+
+* DataGridSearchWrapper ([ebf3acf](https://github.com/Azrideus/azrico-reactgrid/commit/ebf3acff5f90c45090fad86be8e83e28744dd9dd))
+* editable can be a function ([6ea857e](https://github.com/Azrideus/azrico-reactgrid/commit/6ea857e4f403d2a334dc5e74065f6b8033277ca4))
+
+
+### Bug Fixes
+
+* DataGridDelayedSizeWrapper actual delayed ([2ddfd2f](https://github.com/Azrideus/azrico-reactgrid/commit/2ddfd2fb58c90bd906e1330f22f0ef7468d34afb))
+* onCellSelectionChange ([95c8f54](https://github.com/Azrideus/azrico-reactgrid/commit/95c8f540e94dde0c7e245fb29fb6afc7172957ec))
+* styling ([9018f75](https://github.com/Azrideus/azrico-reactgrid/commit/9018f7593e253720f751f52855a2d956dfc578ed))
+
 ### [1.3.13](https://github.com/Azrideus/azrico-reactgrid/compare/v1.2.10...v1.3.13) (2023-08-19)
 
 

package/dist/src/views/DataGrid.js

@@ -279,38 +279,47 @@ function DataGridDelayedSizeWrapper(props) {
 }
 function DataGridSearchWrapper(props) {
   const [search, set_search] = _react.default.useState('');
-  const [evaluatedDataSource, set_evaluatedDataSource] = _react.default.useState([]);
   const [filteredData, set_filteredData] = _react.default.useState([]);
-  const try_search = _react.default.useCallback((0, _lodash.default)((ds, v) => {
-    if (!search || !Array.isArray(ds)) {
-      set_filteredData(props.dataSource);
+  const currentSearch = _react.default.useRef('');
+  const currentDS = _react.default.useRef([]);
+  const try_search = _react.default.useCallback((0, _lodash.default)(() => {
+    if (!Array.isArray(currentDS.current)) {
       return;
     }
-    const visibleColumns = props.gridRef.current.visibleColumns;
-    const columns_to_search = (0, _object.array_intersection)(props.advancedFilterFields || [], visibleColumns.map(r => r.id));
-    const lowerSearchText = v && v.toLowerCase();
     let newData = [];
-    if (!lowerSearchText) newData = ds;else newData = ds.filter(p => {
-      for (let index = 0; index < columns_to_search.length; index++) {
-        const col = columns_to_search[index];
-        const v = (p[col] + '').toLowerCase(); // get string value
-        if (v && v.indexOf(lowerSearchText) == -1) return false;
-      }
-      return true;
-    });
+    if (currentSearch.current) {
+      const visibleColumns = props.gridRef.current.visibleColumns;
+      const columns_to_search = (0, _object.array_intersection)(props.advancedFilterFields || [], visibleColumns.map(r => r.id));
+      const lowerSearchText = currentSearch.current.toLowerCase();
+      if (!lowerSearchText) newData = currentDS.current;else newData = currentDS.current.filter(p => {
+        for (let index = 0; index < columns_to_search.length; index++) {
+          const col = columns_to_search[index];
+          const v = (p[col] + '').toLowerCase(); // get string value
+          if (v && v.indexOf(lowerSearchText) == -1) return false;
+        }
+        return true;
+      });
+    } else newData = currentDS.current;
     set_filteredData(newData);
   }, 1000), []);
   _react.default.useEffect(() => {
     set_search('');
     (0, _object.fn_eval)(props.dataSource).then(({
       data
-    }) => set_evaluatedDataSource(data));
+    }) => {
+      currentDS.current = data;
+      searchIfNeeded();
+    });
   }, [props.dataSource]);
   _react.default.useEffect(() => {
+    currentSearch.current = search;
+    searchIfNeeded();
+  }, [search]);
+  function searchIfNeeded() {
     if (!search) {
       set_filteredData(props.dataSource);
-    } else try_search(evaluatedDataSource, search);
-  }, [search, evaluatedDataSource]);
+    } else try_search();
+  }
   return _react.default.createElement("div", {
     className: 'azgrid-flexed azgrid-flexlayout azgrid-nooverflow'
   }, _react.default.createElement("form", {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@azrico/reactgrid",
-	"version": "1.3.13",
+	"version": "1.3.15",
 	"main": "dist/index.js",
 	"description": "React Datagrid",
 	"author": "Azrideus <MehrdadTavangar@gmail.com>",

package/src/views/DataGrid.tsx

@@ -438,47 +438,58 @@ function DataGridDelayedSizeWrapper(props: DataGridWrapperProps) {
 }
 function DataGridSearchWrapper(props: DataGridWrapperProps) {
 	const [search, set_search] = React.useState('');
-	const [evaluatedDataSource, set_evaluatedDataSource] = React.useState<any[]>([]);
 	const [filteredData, set_filteredData] = React.useState<any>([]);
+	const currentSearch = React.useRef('');
+	const currentDS = React.useRef<any[]>([]);
 
 	const try_search = React.useCallback(
-		debounce((ds, v) => {
-			if (!search || !Array.isArray(ds)) {
-				set_filteredData(props.dataSource);
+		debounce(() => {
+			if (!Array.isArray(currentDS.current)) {
 				return;
 			}
-			const visibleColumns = props.gridRef.current.visibleColumns;
-			const columns_to_search: string[] = array_intersection(
-				props.advancedFilterFields || [],
-				visibleColumns.map((r) => r.id)
-			);
-			const lowerSearchText = v && v.toLowerCase();
 			let newData: any[] = [];
+			if (currentSearch.current) {
+				const visibleColumns = props.gridRef.current.visibleColumns;
+				const columns_to_search: string[] = array_intersection(
+					props.advancedFilterFields || [],
+					visibleColumns.map((r) => r.id)
+				);
+				const lowerSearchText = currentSearch.current.toLowerCase();
+				if (!lowerSearchText) newData = currentDS.current;
+				else
+					newData = currentDS.current.filter((p) => {
+						for (let index = 0; index < columns_to_search.length; index++) {
+							const col = columns_to_search[index];
+							const v = (p[col] + '').toLowerCase(); // get string value
+
+							if (v && v.indexOf(lowerSearchText) == -1) return false;
+						}
+						return true;
+					});
+			} else newData = currentDS.current;
 
-			if (!lowerSearchText) newData = ds;
-			else
-				newData = ds.filter((p) => {
-					for (let index = 0; index < columns_to_search.length; index++) {
-						const col = columns_to_search[index];
-						const v = (p[col] + '').toLowerCase(); // get string value
-
-						if (v && v.indexOf(lowerSearchText) == -1) return false;
-					}
-					return true;
-				});
 			set_filteredData(newData);
 		}, 1000),
 		[]
 	);
 	React.useEffect(() => {
 		set_search('');
-		fn_eval(props.dataSource).then(({ data }) => set_evaluatedDataSource(data));
+		fn_eval(props.dataSource).then(({ data }) => {
+			currentDS.current = data;
+			searchIfNeeded();
+		});
 	}, [props.dataSource]);
+
 	React.useEffect(() => {
+		currentSearch.current = search;
+		searchIfNeeded();
+	}, [search]);
+	
+	function searchIfNeeded() {
 		if (!search) {
 			set_filteredData(props.dataSource);
-		} else try_search(evaluatedDataSource, search);
-	}, [search, evaluatedDataSource]);
+		} else try_search();
+	}
 
 	return (
 		<div className={'azgrid-flexed azgrid-flexlayout azgrid-nooverflow'}>