@azrico/reactgrid 1.1.0 → 1.1.2

package/dist/src/example.js

@@ -45,7 +45,7 @@ const filterValue = [{
 const contextMenuItems = ['test'];
 function getData() {
   const fd = [];
-  for (let index = 0; index < 400; index++) {
+  for (let index = 0; index < 200; index++) {
     fd.push({
       __table_id: String(index),
       name: 'user-' + index,

package/dist/src/index.js

@@ -19,6 +19,6 @@ Object.keys(_DataGrid).forEach(function (key) {
 });
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-var _default = _DataGrid.default; //const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);
+var _default = _DataGrid.default; //const root = ReactDOM.createRoot(document.getElementById('testroot') as HTMLElement);
 //root.render(<ExampleGrid />);
 exports.default = _default;

package/dist/src/views/DataGrid.js

@@ -15,6 +15,7 @@ var _helpers = require("../func/helpers");
 var _controls = require("@azrico/controls");
 var _reactdatagridEnterprise = _interopRequireDefault(require("@inovua/reactdatagrid-enterprise"));
 var _clsx = _interopRequireDefault(require("clsx"));
+var _object = require("@azrico/object");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /* -------------------------------------------------------------------------- */
 // const defaultfilterTypes: FilterTypes = {
@@ -61,22 +62,30 @@ function AzGrid(props) {
   /*                                 Row changes                                */
   /* -------------------------------------------------------------------------- */
   const cached_data = _react.default.useRef();
-  const last_ds = _react.default.useRef();
+  const last_cache_info = _react.default.useRef();
   const dataSource = _react.default.useCallback(async dt => {
     let result_data = undefined;
     let isUsingCache = false;
+    //console.log(dt);
+    const cacheInfo = {
+      ds: props.dataSource,
+      skip: dt.skip,
+      limit: dt.limit
+    };
     //check if we can used cached data
     //if the datasource is changed since last render, we should invalidate cache
-    if (last_ds.current != props.dataSource) {
-      //console.log('invalid cache', last_ds.current, props.dataSource);
+    if (!(0, _object.object_equals)(last_cache_info.current, cacheInfo)) {
+      //console.log('invalid cache', cacheInfo);
       cached_data.current = undefined;
-      last_ds.current = props.dataSource;
+      last_cache_info.current = cacheInfo;
     }
     if (cached_data.current) {
       //cache is valid, use the cache
+      //console.log('use cache', cached_data.current);
       isUsingCache = true;
       result_data = cached_data.current;
     } else {
+      //console.log('use ds');
       //cache is invalid, use the datasource again
       isUsingCache = false;
       if (typeof props.dataSource === 'function') {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@azrico/reactgrid",
-	"version": "1.1.0",
+	"version": "1.1.2",
 	"main": "dist/index.js",
 	"description": "React Datagrid",
 	"author": "Azrideus <MehrdadTavangar@gmail.com>",
@@ -30,6 +30,7 @@
 	},
 	"dependencies": {
 		"@azrico/controls": "1.3.0",
+		"@azrico/object": "^1.3.1",
 		"@emotion/react": "^11.9.3",
 		"@emotion/styled": "^11.9.3",
 		"@inovua/reactdatagrid-enterprise": "^5.8.0",

package/public/index.html

@@ -14,7 +14,7 @@
 	<noscript>
 		You need to enable JavaScript to run this app.
 	</noscript>
-	<div id="root" class="azgrid-filler azgrid-testborder azgrid-borderbox azgrid-nopad azgrid-nomargin"></div>
+	<div id="testroot" class="azgrid-filler azgrid-testborder azgrid-borderbox azgrid-nopad azgrid-nomargin"></div>
 </body>
 
 </html>

package/src/example.tsx

@@ -33,7 +33,7 @@ const filterValue = [
 const contextMenuItems = ['test'];
 function getData() {
 	const fd: any[] = [];
-	for (let index = 0; index < 400; index++) {
+	for (let index = 0; index < 200; index++) {
 		fd.push({ __table_id: String(index), name: 'user-' + index, age: 20 });
 		if (index % 5 == 0) {
 			const sub_selfid = 's' + index;

package/src/index.tsx

@@ -7,5 +7,5 @@ import React from 'react';
 import ReactDOM from 'react-dom/client';
 export default AzGrid;
 
-//const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);
+//const root = ReactDOM.createRoot(document.getElementById('testroot') as HTMLElement);
 //root.render(<ExampleGrid />);

package/src/views/DataGrid.tsx

@@ -20,6 +20,7 @@ import { ContextMenu } from '@azrico/controls';
 import ReactDataGrid from '@inovua/reactdatagrid-enterprise';
 import { TypeOnSelectionChangeArg } from '@inovua/reactdatagrid-community/types/TypeDataGridProps';
 import clsx from 'clsx';
+import { object_equals } from '@azrico/object';
 import { useResizeDetector } from 'react-resize-detector';
 
 /* -------------------------------------------------------------------------- */
@@ -154,25 +155,32 @@ export function AzGrid(props: AzGridProps) {
 	/* -------------------------------------------------------------------------- */
 
 	const cached_data = React.useRef<any>();
-	const last_ds = React.useRef<any>();
+	const last_cache_info = React.useRef<any>();
+
 	const dataSource = React.useCallback(
 		async (dt) => {
 			let result_data: any = undefined;
 
 			let isUsingCache = false;
+			//console.log(dt);
+			const cacheInfo = { ds: props.dataSource, skip: dt.skip, limit: dt.limit };
 			//check if we can used cached data
 			//if the datasource is changed since last render, we should invalidate cache
-			if (last_ds.current != props.dataSource) {
-				//console.log('invalid cache', last_ds.current, props.dataSource);
+			if (!object_equals(last_cache_info.current, cacheInfo)) {
+				//console.log('invalid cache', cacheInfo);
 				cached_data.current = undefined;
-				last_ds.current = props.dataSource;
+				last_cache_info.current = cacheInfo;
 			}
 
 			if (cached_data.current) {
 				//cache is valid, use the cache
+				//console.log('use cache', cached_data.current);
+
 				isUsingCache = true;
 				result_data = cached_data.current;
 			} else {
+				//console.log('use ds');
+
 				//cache is invalid, use the datasource again
 				isUsingCache = false;