add permanentSorter for useTable and useSimpleList

packages/core/src/definitions/table/index.ts

@@ -8,6 +8,7 @@ import {
  CrudOperators,
  CrudSorting,
  CrudFilter,
+ CrudSort,
 } from "../../interfaces";
 import {
  SortOrder,
@@ -188,6 +189,9 @@ export const mapAntdFilterToCrudFilter = (
 export const compareFilters = (left: CrudFilter, right: CrudFilter): boolean =>
  left.field == right.field && left.operator == right.operator;
 
+export const compareSorters = (left: CrudSort, right: CrudSort): boolean =>
+ left.field == right.field && left.order == right.order;
+
 // Keep only one CrudFilter per type according to compareFilters
 // Items in the array that is passed first to unionWith have higher priority
 // CrudFilter items with undefined values are necessary to signify no filter
@@ -205,6 +209,18 @@ export const unionFilters = (
  crudFilter.value !== undefined && crudFilter.value !== null,
  );
 
+export const unionSorters = (
+ permanentSorter: CrudSorting,
+ newSorters: CrudSorting,
+ prevSorters: CrudSorting,
+): CrudSorting =>
+ reverse(
+ unionWith(permanentSorter, newSorters, prevSorters, compareSorters),
+ ).filter(
+ (crudSorter) =>
+ crudSorter.order !== undefined && crudSorter.order !== null,
+ );
+
 // Prioritize filters in the permanentFilter and put it at the end of result array
 export const setInitialFilters = (
  permanentFilter: CrudFilters,
@@ -213,3 +229,11 @@ export const setInitialFilters = (
  ...differenceWith(defaultFilter, permanentFilter, compareFilters),
  ...permanentFilter,
 ];
+
+export const setInitialSorters = (
+ permanentSorter: CrudSorting,
+ defaultSorter: CrudSorting,
+): CrudSorting => [
+ ...differenceWith(defaultSorter, permanentSorter, compareSorters),
+ ...permanentSorter,
+];

packages/core/src/hooks/list/useSimpleList/useSimpleList.ts

@@ -28,15 +28,18 @@ import {
  stringifyTableParams,
  unionFilters,
  setInitialFilters,
+ setInitialSorters,
+ unionSorters,
 } from "@definitions/table";
 
 export type useSimpleListProps<TData, TError, TSearchVariables = unknown> =
  ListProps<TData> & {
- permanentFilter?: CrudFilters;
  syncWithLocation?: boolean;
  resource?: string;
  initialFilter?: CrudFilters;
+ permanentFilter?: CrudFilters;
  initialSorter?: CrudSorting;
+ permanentSorter?: CrudSorting;
  onSearch?: (
  data: TSearchVariables,
  ) => CrudFilters | Promise<CrudFilters>;
@@ -76,6 +79,7 @@ export const useSimpleList = <
  initialSorter,
  initialFilter,
  permanentFilter = [],
+ permanentSorter = [],
  onSearch,
  queryOptions,
  syncWithLocation: syncWithLocationProp,
@@ -140,7 +144,9 @@ export const useSimpleList = <
  const [filters, setFilters] = useState<CrudFilters>(
  setInitialFilters(permanentFilter, defaultFilter ?? []),
  );
- const [sorter, setSorter] = useState<CrudSorting>(defaultSorter ?? []);
+ const [sorter, setSorter] = useState<CrudSorting>(
+ setInitialSorters(permanentSorter, defaultSorter ?? []),
+ );
 
  useEffect(() => {
  if (syncWithLocation) {
@@ -165,7 +171,7 @@ export const useSimpleList = <
  pageSize,
  },
  filters: unionFilters(permanentFilter, [], filters),
- sort: sorter,
+ sort: unionSorters(permanentSorter, [], sorter),
  },
  queryOptions,
  successNotification,

packages/core/src/hooks/table/useTable/useTable.ts

@@ -23,6 +23,8 @@ import {
  mapAntdFilterToCrudFilter,
  unionFilters,
  setInitialFilters,
+ setInitialSorters,
+ unionSorters,
 } from "@definitions/table";
 
 import {
@@ -38,12 +40,13 @@ import {
 } from "../../../interfaces";
 
 export type useTableProps<TData, TError, TSearchVariables = unknown> = {
- permanentFilter?: CrudFilters;
  resource?: string;
  initialCurrent?: number;
  initialPageSize?: number;
  initialSorter?: CrudSorting;
+ permanentSorter?: CrudSorting;
  initialFilter?: CrudFilters;
+ permanentFilter?: CrudFilters;
  syncWithLocation?: boolean;
  onSearch?: (data: TSearchVariables) => CrudFilters | Promise<CrudFilters>;
  queryOptions?: UseQueryOptions<GetListResponse<TData>, TError>;
@@ -71,18 +74,20 @@ export type useTableReturnType<
  */
 
 const defaultPermanentFilter: CrudFilters = [];
+const defaultPermanentSorter: CrudSorting = [];
 
 export const useTable = <
  TData extends BaseRecord = BaseRecord,
  TError extends HttpError = HttpError,
  TSearchVariables = unknown,
 >({
  onSearch,
- permanentFilter = defaultPermanentFilter,
  initialCurrent = 1,
  initialPageSize = 10,
  initialSorter,
  initialFilter,
+ permanentSorter = defaultPermanentSorter,
+ permanentFilter = defaultPermanentFilter,
  syncWithLocation: syncWithLocationProp,
  resource: resourceFromProp,
  successNotification,
@@ -140,7 +145,9 @@ export const useTable = <
 
  const resource = resourceWithRoute(resourceFromProp ?? routeResourceName);
 
- const [sorter, setSorter] = useState<CrudSorting>(defaultSorter || []);
+ const [sorter, setSorter] = useState<CrudSorting>(
+ setInitialSorters(permanentSorter, defaultSorter ?? []),
+ );
  const [filters, setFilters] = useState<CrudFilters>(
  setInitialFilters(permanentFilter, defaultFilter ?? []),
  );
@@ -183,7 +190,7 @@ export const useTable = <
  pageSize: pageSizeSF,
  },
  filters: unionFilters(permanentFilter, [], filters),
- sort: sorter,
+ sort: unionSorters(permanentSorter, [], sorter),
  },
  queryOptions,
  successNotification,
@@ -212,7 +219,10 @@ export const useTable = <
 
  // Map Antd:Sorter -> refine:CrudSorting
  const crudSorting = mapAntdSorterToCrudSorting(sorter);
- setSorter(crudSorting);
+ console.log("crudSorting", crudSorting);
+ setSorter(() => unionSorters(permanentSorter, crudSorting, []));
+
+ console.log("sorter", { sorter });
 
  tablePropsSunflower.onChange(pagination, filters, sorter);
  };