@visns-studio/visns-components 3.8.12 → 3.9.0

package/components/cms/DataGrid.jsx

@@ -158,13 +158,6 @@ const DataGrid = ({
     const [gridColumns, setGridColumns] = useState([]);
     const [limit, setLimit] = useState(ajaxSetting.take || 10);
     const [search, setSearch] = useState('');
-    const sortInfo =
-        ajaxSetting.sortBy && ajaxSetting.sort
-            ? {
-                  name: ajaxSetting.sortBy,
-                  dir: ajaxSetting.sort === 'asc' ? 1 : -1,
-              }
-            : null;
 
     /** Table Functions */
     const handleChangeSearch = (e) => {

package/components/crm/DataGrid.jsx

@@ -18,6 +18,7 @@ import NumberFilter from '@inovua/reactdatagrid-community/NumberFilter';
 import SelectFilter from '@inovua/reactdatagrid-community/SelectFilter';
 import DateFilter from '@inovua/reactdatagrid-community/DateFilter';
 import ReactDataGrid from '@inovua/reactdatagrid-community';
+import PaginationToolbar from '@inovua/reactdatagrid-community/packages/PaginationToolbar';
 import { confirmAlert } from 'react-confirm-alert';
 import { toast } from 'react-toastify';
 import {
@@ -51,12 +52,13 @@ import Form from './Form';
 import _ from 'lodash';
 
 const loadData = async (
-    { skip, limit, sortInfo, currentData, filterValue, groupBy },
+    { skip, limit, sortInfo, filterValue },
     search,
-    ajaxSetting
+    ajaxSetting,
+    currentPage
 ) => {
     const url = ajaxSetting.url;
-    const page = Math.floor(skip / limit) + 1;
+    const page = currentPage;
     const params = { page, sortInfo, take: limit, search: search, where: [] };
 
     if (sortInfo) {
@@ -157,13 +159,33 @@ const DataGrid = forwardRef(
         useEffect(() => {
             setFormData(form);
         }, [form]);
-
         /** Table States */
+        const currentPageRef = useRef(1); // Initialize with default value
+        const previousDataReloadRef = useRef(0);
+
         const [dataReload, setDataReload] = useState(0);
         const [dSearch, setDSearch] = useState('');
         const data = useCallback(
             (params) => {
-                const sqlResult = loadData(params, dSearch, ajaxSetting);
+                let currentPage;
+                // Preserve the last currentPage value
+                const previousDataReload = previousDataReloadRef.current;
+
+                if (dataReload !== previousDataReload) {
+                    currentPage = currentPageRef.current;
+                    previousDataReloadRef.current = dataReload;
+                } else {
+                    // Update the currentPageRef with the new value
+                    currentPage = currentPageRef.current =
+                        Math.floor(params.skip / params.limit) + 1;
+                }
+
+                const sqlResult = loadData(
+                    params,
+                    dSearch,
+                    ajaxSetting,
+                    currentPage
+                );
                 if (setFilterData && params.filterValue) {
                     setFilterData(params.filterValue);
                 }
@@ -834,6 +856,18 @@ const DataGrid = forwardRef(
             [form]
         );
 
+        const renderPaginationToolbar = useCallback((paginationProps) => {
+            let pageProps = paginationProps;
+            let newSkip = (currentPageRef.current - 1) * pageProps.limit;
+            pageProps.skip = newSkip;
+
+            return (
+                <div style={{ height: 89 }}>
+                    <PaginationToolbar {...pageProps} bordered={false} />
+                </div>
+            );
+        }, []);
+
         const handleCoding = (c, data) => {
             const icons = [];
             const assetPath =
@@ -2509,6 +2543,7 @@ const DataGrid = forwardRef(
                             pagination
                             renderRowContextMenu={renderRowContextMenu}
                             renderColumnContextMenu={renderColumnContextMenu}
+                            renderPaginationToolbar={renderPaginationToolbar}
                             rowClassName="vs-datagrid--row"
                             rowHeight={null}
                             selected={selected}

package/components/crm/generic/GenericIndex.jsx

@@ -7,6 +7,7 @@ import Download from '../Download';
 import Field from '../Field';
 import Table from '../DataGrid';
 import TableFilter from '../TableFilter';
+import _ from 'lodash';
 
 function useWindowHeight() {
     const [windowHeight, setWindowHeight] = useState(window.innerHeight);

package/package.json

@@ -1,10 +1,10 @@
 {
     "dependencies": {
         "@inovua/reactdatagrid-community": "^5.10.2",
-        "@nivo/bar": "^0.85.1",
-        "@nivo/core": "^0.85.1",
-        "@nivo/line": "^0.85.1",
-        "@nivo/pie": "^0.85.1",
+        "@nivo/bar": "^0.86.0",
+        "@nivo/core": "^0.86.0",
+        "@nivo/line": "^0.86.0",
+        "@nivo/pie": "^0.86.0",
         "@tinymce/tinymce-react": "^5.0.1",
         "add": "^2.0.6",
         "akar-icons": "^1.9.31",
@@ -37,7 +37,7 @@
         "react-to-print": "^2.15.1",
         "react-toastify": "^10.0.5",
         "react-toggle": "^4.1.3",
-        "react-tooltip": "^5.26.3",
+        "react-tooltip": "^5.26.4",
         "react-window": "^1.8.10",
         "reactjs-popup": "^2.0.6",
         "truncate": "^3.0.0",
@@ -54,7 +54,7 @@
         "react-dom": "^17.0.1"
     },
     "name": "@visns-studio/visns-components",
-    "version": "3.8.12",
+    "version": "3.9.0",
     "description": "Various packages to assist in the development of our Custom Applications.",
     "main": "index.js",
     "scripts": {