@azrico/reactgrid 1.3.14 → 1.3.15

package/CHANGELOG.md

@@ -2,6 +2,21 @@
 
 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)
 
 

package/dist/src/views/DataGrid.js

@@ -279,18 +279,19 @@ 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 (!Array.isArray(ds)) {
+  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;
     }
     let newData = [];
-    if (v) {
+    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 = v && v.toLowerCase();
-      if (!lowerSearchText) newData = ds;else newData = ds.filter(p => {
+      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
@@ -298,20 +299,27 @@ function DataGridSearchWrapper(props) {
         }
         return true;
       });
-    } else newData = ds;
+    } 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.14",
+	"version": "1.3.15",
 	"main": "dist/index.js",
 	"description": "React Datagrid",
 	"author": "Azrideus <MehrdadTavangar@gmail.com>",

package/src/views/DataGrid.tsx

@@ -438,28 +438,26 @@ 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 (!Array.isArray(ds)) {
+		debounce(() => {
+			if (!Array.isArray(currentDS.current)) {
 				return;
 			}
-
 			let newData: any[] = [];
-
-			if (v) {
+			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 = v && v.toLowerCase();
-
-				if (!lowerSearchText) newData = ds;
+				const lowerSearchText = currentSearch.current.toLowerCase();
+				if (!lowerSearchText) newData = currentDS.current;
 				else
-					newData = ds.filter((p) => {
+					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
@@ -468,7 +466,7 @@ function DataGridSearchWrapper(props: DataGridWrapperProps) {
 						}
 						return true;
 					});
-			} else newData = ds;
+			} else newData = currentDS.current;
 
 			set_filteredData(newData);
 		}, 1000),
@@ -476,13 +474,22 @@ function DataGridSearchWrapper(props: DataGridWrapperProps) {
 	);
 	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'}>