@etsoo/materialui 1.4.36 → 1.4.37

package/lib/DataGridEx.js

@@ -91,7 +91,7 @@ export function DataGridEx(props) {
                     });
                 }
                 else if (sortable && field != null) {
-                    const active = orderBy != null && orderBy[field] != null;
+                    const active = orderBy?.has(field);
                     sortLabel = (_jsx(TableSortLabel, { active: active, direction: sortAsc ? "asc" : "desc", onClick: (_event) => {
                             if (active)
                                 column.sortAsc = !sortAsc;
@@ -165,7 +165,7 @@ export function DataGridEx(props) {
     });
     // New sort
     const handleSort = (field, asc) => {
-        reset({ queryPaging: { orderBy: { [field]: asc ?? true } } });
+        reset({ queryPaging: { orderBy: new Map([[field, !(asc ?? true)]]) } });
     };
     // Reset
     const reset = (add) => {

package/lib/GridUtils.d.ts

@@ -1,6 +1,7 @@
 import { GridLoadDataProps, GridLoaderStates } from "@etsoo/react";
 import { DataTypes } from "@etsoo/shared";
 import { GridDataCacheType } from "./GridDataCacheType";
+import { QueryPagingData } from "@etsoo/appscript";
 /**
  * Grid utilities
  */
@@ -13,7 +14,7 @@ export declare namespace GridUtils {
      * @returns Request data
      */
     function createLoader<F extends DataTypes.BasicTemplate>(props: GridLoadDataProps, template?: F, cacheKey?: string): DataTypes.BasicTemplateType<F> & {
-        queryPaging: import("@etsoo/appscript").QueryPagingData;
+        queryPaging: QueryPagingData;
     };
     /**
      * Get cache data
@@ -40,4 +41,11 @@ export declare namespace GridUtils {
      * @param searchData Search data
      */
     function mergeSearchData<T, F extends DataTypes.BasicTemplate>(state: GridLoaderStates<T>, searchData?: DataTypes.BasicTemplateType<F>): void;
+    /**
+     * Setup paging keysets
+     * @param data Paging data
+     * @param lastItem Last item of the query
+     * @param idField Id field
+     */
+    function setupPagingKeysets<T>(data: QueryPagingData, lastItem: T | undefined, idField: keyof T & string): void;
 }

package/lib/GridUtils.js

@@ -83,4 +83,26 @@ export var GridUtils;
         Object.assign(state.data, searchData);
     }
     GridUtils.mergeSearchData = mergeSearchData;
+    /**
+     * Setup paging keysets
+     * @param data Paging data
+     * @param lastItem Last item of the query
+     * @param idField Id field
+     */
+    function setupPagingKeysets(data, lastItem, idField) {
+        // If the id field is not set for ordering, add it with descending
+        if (data.orderBy == null) {
+            data.orderBy = new Map([[idField, true]]);
+        }
+        else if (!data.orderBy.has(idField)) {
+            data.orderBy.set(idField, true);
+        }
+        // Set the paging keysets
+        if (lastItem) {
+            const keysets = [];
+            data.orderBy.forEach((_value, key) => keysets.push(Reflect.get(lastItem, key)));
+            data.keysets = keysets;
+        }
+    }
+    GridUtils.setupPagingKeysets = setupPagingKeysets;
 })(GridUtils || (GridUtils = {}));

package/lib/ResponsibleContainer.d.ts

@@ -61,7 +61,7 @@ export type ResponsibleContainerProps<T extends object, F extends DataTypes.Basi
     /**
      * Load data callback
      */
-    loadData: (data: GridJsonData & DataTypes.BasicTemplateType<F>) => PromiseLike<T[] | null | undefined>;
+    loadData: (data: GridJsonData & DataTypes.BasicTemplateType<F>, lastItem?: T) => PromiseLike<T[] | null | undefined>;
     /**
      * Methods
      */

package/lib/ResponsibleContainer.js

@@ -44,9 +44,9 @@ export function ResponsibleContainer(props) {
     // Has fields
     const hasFields = fields != null && fields.length > 0;
     // Load data
-    const localLoadData = (props) => {
+    const localLoadData = (props, lastItem) => {
         state.mounted = true;
-        return loadData(GridUtils.createLoader(props, fieldTemplate, cacheKey));
+        return loadData(GridUtils.createLoader(props, fieldTemplate, cacheKey), lastItem);
     };
     // Search data
     const searchData = GridUtils.getSearchData(cacheKey);

package/lib/TableEx.js

@@ -171,7 +171,7 @@ export function TableEx(props) {
     };
     // New sort
     const handleSort = (field, asc) => {
-        reset({ queryPaging: { orderBy: { [field]: asc ?? true } } });
+        reset({ queryPaging: { orderBy: new Map([[field, !(asc ?? true)]]) } });
     };
     // Set items for rerenderer
     const setItems = (callback) => {
@@ -218,8 +218,7 @@ export function TableEx(props) {
                                         // Sortable
                                         let sortLabel;
                                         if (sortable && field != null) {
-                                            const active = queryPaging.orderBy != null &&
-                                                queryPaging.orderBy[field] != null;
+                                            const active = queryPaging.orderBy?.has(field);
                                             sortLabel = (_jsx(TableSortLabel, { active: active, direction: sortAsc ? "asc" : "desc", onClick: (_event) => {
                                                     if (active)
                                                         column.sortAsc = !sortAsc;

package/lib/pages/DataGridPage.js

@@ -33,8 +33,8 @@ export function DataGridPage(props) {
     const onSubmit = (data, _reset) => {
         setStates({ data });
     };
-    const localLoadData = (props) => {
-        return loadData(GridUtils.createLoader(props, fieldTemplate, cacheKey));
+    const localLoadData = (props, lastItem) => {
+        return loadData(GridUtils.createLoader(props, fieldTemplate, cacheKey), lastItem);
     };
     // Search data
     const searchData = GridUtils.getSearchData(cacheKey);

package/lib/pages/SearchPageProps.d.ts

@@ -24,7 +24,7 @@ export type SearchPageProps<T extends object, F extends DataTypes.BasicTemplate>
     /**
      * Load data callback
      */
-    loadData: (data: GridJsonData & DataTypes.BasicTemplateType<F>) => PromiseLike<T[] | null | undefined>;
+    loadData: (data: GridJsonData & DataTypes.BasicTemplateType<F>, lastItem?: T) => PromiseLike<T[] | null | undefined>;
     /**
      * Page props
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.4.36",
+  "version": "1.4.37",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/index.js",
   "type": "module",
@@ -35,9 +35,9 @@
     "@emotion/css": "^11.13.5",
     "@emotion/react": "^11.13.5",
     "@emotion/styled": "^11.13.5",
-    "@etsoo/appscript": "^1.5.76",
+    "@etsoo/appscript": "^1.5.77",
     "@etsoo/notificationbase": "^1.1.54",
-    "@etsoo/react": "^1.8.3",
+    "@etsoo/react": "^1.8.6",
     "@etsoo/shared": "^1.2.55",
     "@mui/icons-material": "^6.1.9",
     "@mui/material": "^6.1.9",

package/src/DataGridEx.tsx

@@ -258,7 +258,7 @@ export function DataGridEx<T extends object>(props: DataGridExProps<T>) {
               states
             });
           } else if (sortable && field != null) {
-            const active = orderBy != null && orderBy[field] != null;
+            const active = orderBy?.has(field);
 
             sortLabel = (
               <TableSortLabel
@@ -438,7 +438,7 @@ export function DataGridEx<T extends object>(props: DataGridExProps<T>) {
 
   // New sort
   const handleSort = (field: string, asc?: boolean) => {
-    reset({ queryPaging: { orderBy: { [field]: asc ?? true } } });
+    reset({ queryPaging: { orderBy: new Map([[field, !(asc ?? true)]]) } });
   };
 
   // Reset

package/src/GridUtils.ts

@@ -5,6 +5,7 @@ import {
 } from "@etsoo/react";
 import { DataTypes } from "@etsoo/shared";
 import { GridDataCacheType } from "./GridDataCacheType";
+import { QueryPagingData } from "@etsoo/appscript";
 
 /**
  * Grid utilities
@@ -98,4 +99,32 @@ export namespace GridUtils {
     state.data ??= {};
     Object.assign(state.data, searchData);
   }
+
+  /**
+   * Setup paging keysets
+   * @param data Paging data
+   * @param lastItem Last item of the query
+   * @param idField Id field
+   */
+  export function setupPagingKeysets<T>(
+    data: QueryPagingData,
+    lastItem: T | undefined,
+    idField: keyof T & string
+  ) {
+    // If the id field is not set for ordering, add it with descending
+    if (data.orderBy == null) {
+      data.orderBy = new Map<string, boolean>([[idField, true]]);
+    } else if (!data.orderBy.has(idField)) {
+      data.orderBy.set(idField, true);
+    }
+
+    // Set the paging keysets
+    if (lastItem) {
+      const keysets: unknown[] = [];
+      data.orderBy.forEach((_value, key) =>
+        keysets.push(Reflect.get(lastItem, key))
+      );
+      data.keysets = keysets;
+    }
+  }
 }

package/src/ResponsibleContainer.tsx

@@ -123,7 +123,8 @@ export type ResponsibleContainerProps<
    * Load data callback
    */
   loadData: (
-    data: GridJsonData & DataTypes.BasicTemplateType<F>
+    data: GridJsonData & DataTypes.BasicTemplateType<F>,
+    lastItem?: T
   ) => PromiseLike<T[] | null | undefined>;
 
   /**
@@ -238,9 +239,12 @@ export function ResponsibleContainer<
   const hasFields = fields != null && fields.length > 0;
 
   // Load data
-  const localLoadData = (props: GridLoadDataProps) => {
+  const localLoadData = (props: GridLoadDataProps, lastItem?: T) => {
     state.mounted = true;
-    return loadData(GridUtils.createLoader<F>(props, fieldTemplate, cacheKey));
+    return loadData(
+      GridUtils.createLoader<F>(props, fieldTemplate, cacheKey),
+      lastItem
+    );
   };
 
   // Search data

package/src/TableEx.tsx

@@ -306,7 +306,7 @@ export function TableEx<
 
   // New sort
   const handleSort = (field: string, asc?: boolean) => {
-    reset({ queryPaging: { orderBy: { [field]: asc ?? true } } });
+    reset({ queryPaging: { orderBy: new Map([[field, !(asc ?? true)]]) } });
   };
 
   // Set items for rerenderer
@@ -400,9 +400,7 @@ export function TableEx<
                 // Sortable
                 let sortLabel: React.ReactNode;
                 if (sortable && field != null) {
-                  const active =
-                    queryPaging.orderBy != null &&
-                    queryPaging.orderBy[field] != null;
+                  const active = queryPaging.orderBy?.has(field);
 
                   sortLabel = (
                     <TableSortLabel

package/src/pages/DataGridPage.tsx

@@ -76,8 +76,11 @@ export function DataGridPage<
     setStates({ data });
   };
 
-  const localLoadData = (props: GridLoadDataProps) => {
-    return loadData(GridUtils.createLoader<F>(props, fieldTemplate, cacheKey));
+  const localLoadData = (props: GridLoadDataProps, lastItem?: T) => {
+    return loadData(
+      GridUtils.createLoader<F>(props, fieldTemplate, cacheKey),
+      lastItem
+    );
   };
 
   // Search data

package/src/pages/SearchPageProps.ts

@@ -35,7 +35,8 @@ export type SearchPageProps<
    * Load data callback
    */
   loadData: (
-    data: GridJsonData & DataTypes.BasicTemplateType<F>
+    data: GridJsonData & DataTypes.BasicTemplateType<F>,
+    lastItem?: T
   ) => PromiseLike<T[] | null | undefined>;
 
   /**