Client: Moved defaultSortOrder func to utils
This commit is contained in:
@@ -17,8 +17,10 @@ import { NumberFieldUnit } from "../../components/numberField";
|
|||||||
import dayjs from "dayjs";
|
import dayjs from "dayjs";
|
||||||
import utc from "dayjs/plugin/utc";
|
import utc from "dayjs/plugin/utc";
|
||||||
import { IFilament } from "./model";
|
import { IFilament } from "./model";
|
||||||
import { genericSorter } from "../../utils/sorting";
|
import {
|
||||||
import { SortOrder } from "antd/es/table/interface";
|
genericSorter,
|
||||||
|
getSortOrderForField,
|
||||||
|
} from "../../utils/sorting";
|
||||||
|
|
||||||
dayjs.extend(utc);
|
dayjs.extend(utc);
|
||||||
|
|
||||||
@@ -69,14 +71,6 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
// Sort dataSource by the sorters
|
// Sort dataSource by the sorters
|
||||||
dataSource.sort(genericSorter(sorters));
|
dataSource.sort(genericSorter(sorters));
|
||||||
|
|
||||||
// Utility function to get the default sort order of a field based on the sorters_initial
|
|
||||||
const defaultSortOrder = (field: string): SortOrder | undefined => {
|
|
||||||
const sorter = sorters_initial.find((s) => s.field === field);
|
|
||||||
if (sorter) {
|
|
||||||
return sorter.order === "asc" ? "ascend" : "descend";
|
|
||||||
}
|
|
||||||
return undefined;
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<List>
|
<List>
|
||||||
@@ -90,37 +84,40 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex="id"
|
dataIndex="id"
|
||||||
title="Id"
|
title="Id"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("id")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "id")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex="vendor_name"
|
dataIndex="vendor_name"
|
||||||
title="Vendor"
|
title="Vendor"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("vendor_name")}
|
defaultSortOrder={getSortOrderForField(
|
||||||
|
sorters_initial,
|
||||||
|
"vendor_name"
|
||||||
|
)}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex="name"
|
dataIndex="name"
|
||||||
title="Name"
|
title="Name"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("name")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "name")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex="material"
|
dataIndex="material"
|
||||||
title="Material"
|
title="Material"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("material")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "material")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex="price"
|
dataIndex="price"
|
||||||
title="Price"
|
title="Price"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("price")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "price")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex="density"
|
dataIndex="density"
|
||||||
title="Density"
|
title="Density"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("density")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "density")}
|
||||||
render={(value) => (
|
render={(value) => (
|
||||||
<NumberFieldUnit
|
<NumberFieldUnit
|
||||||
value={value}
|
value={value}
|
||||||
@@ -135,7 +132,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex="diameter"
|
dataIndex="diameter"
|
||||||
title="Diameter"
|
title="Diameter"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("diameter")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "diameter")}
|
||||||
render={(value) => (
|
render={(value) => (
|
||||||
<NumberFieldUnit
|
<NumberFieldUnit
|
||||||
value={value}
|
value={value}
|
||||||
@@ -150,7 +147,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex="weight"
|
dataIndex="weight"
|
||||||
title="Weight"
|
title="Weight"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("weight")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "weight")}
|
||||||
render={(value) => {
|
render={(value) => {
|
||||||
if (value === null || value === undefined) {
|
if (value === null || value === undefined) {
|
||||||
return <></>;
|
return <></>;
|
||||||
@@ -170,7 +167,10 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex="spool_weight"
|
dataIndex="spool_weight"
|
||||||
title="Spool Weight"
|
title="Spool Weight"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("spool_weight")}
|
defaultSortOrder={getSortOrderForField(
|
||||||
|
sorters_initial,
|
||||||
|
"spool_weight"
|
||||||
|
)}
|
||||||
render={(value) => {
|
render={(value) => {
|
||||||
if (value === null || value === undefined) {
|
if (value === null || value === undefined) {
|
||||||
return <></>;
|
return <></>;
|
||||||
@@ -190,13 +190,16 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex="article_number"
|
dataIndex="article_number"
|
||||||
title="Article Number"
|
title="Article Number"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("article_number")}
|
defaultSortOrder={getSortOrderForField(
|
||||||
|
sorters_initial,
|
||||||
|
"article_number"
|
||||||
|
)}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex={["registered"]}
|
dataIndex={["registered"]}
|
||||||
title="Registered"
|
title="Registered"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("registered")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "registered")}
|
||||||
render={(value) => (
|
render={(value) => (
|
||||||
<DateField
|
<DateField
|
||||||
value={dayjs.utc(value).local()}
|
value={dayjs.utc(value).local()}
|
||||||
@@ -209,7 +212,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex={["comment"]}
|
dataIndex={["comment"]}
|
||||||
title="Comment"
|
title="Comment"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("comment")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "comment")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
title="Actions"
|
title="Actions"
|
||||||
|
|||||||
@@ -17,8 +17,7 @@ import { Table, Space } from "antd";
|
|||||||
import { NumberFieldUnit } from "../../components/numberField";
|
import { NumberFieldUnit } from "../../components/numberField";
|
||||||
import dayjs from "dayjs";
|
import dayjs from "dayjs";
|
||||||
import utc from "dayjs/plugin/utc";
|
import utc from "dayjs/plugin/utc";
|
||||||
import { genericSorter } from "../../utils/sorting";
|
import { genericSorter, getSortOrderForField } from "../../utils/sorting";
|
||||||
import { SortOrder } from "antd/es/table/interface";
|
|
||||||
import { ISpool } from "./model";
|
import { ISpool } from "./model";
|
||||||
|
|
||||||
dayjs.extend(utc);
|
dayjs.extend(utc);
|
||||||
@@ -70,15 +69,6 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// Utility function to get the default sort order of a field based on the sorters_initial
|
|
||||||
const defaultSortOrder = (field: string): SortOrder | undefined => {
|
|
||||||
const sorter = sorters_initial.find((s) => s.field === field);
|
|
||||||
if (sorter) {
|
|
||||||
return sorter.order === "asc" ? "ascend" : "descend";
|
|
||||||
}
|
|
||||||
return undefined;
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<List>
|
<List>
|
||||||
<Table
|
<Table
|
||||||
@@ -91,19 +81,25 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex="id"
|
dataIndex="id"
|
||||||
title="Id"
|
title="Id"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("id")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "id")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex="filament_name"
|
dataIndex="filament_name"
|
||||||
title="Filament"
|
title="Filament"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("filament_name")}
|
defaultSortOrder={getSortOrderForField(
|
||||||
|
sorters_initial,
|
||||||
|
"filament_name"
|
||||||
|
)}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex="used_weight"
|
dataIndex="used_weight"
|
||||||
title="Used Weight"
|
title="Used Weight"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("used_weight")}
|
defaultSortOrder={getSortOrderForField(
|
||||||
|
sorters_initial,
|
||||||
|
"used_weight"
|
||||||
|
)}
|
||||||
render={(value) => {
|
render={(value) => {
|
||||||
return (
|
return (
|
||||||
<NumberFieldUnit
|
<NumberFieldUnit
|
||||||
@@ -120,7 +116,10 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex="remaining_weight"
|
dataIndex="remaining_weight"
|
||||||
title="Estimated Remaining Weight"
|
title="Estimated Remaining Weight"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("remaining_weight")}
|
defaultSortOrder={getSortOrderForField(
|
||||||
|
sorters_initial,
|
||||||
|
"remaining_weight"
|
||||||
|
)}
|
||||||
render={(value) => {
|
render={(value) => {
|
||||||
if (value === null || value === undefined) {
|
if (value === null || value === undefined) {
|
||||||
return <TextField value="Unknown" />;
|
return <TextField value="Unknown" />;
|
||||||
@@ -140,19 +139,19 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex="location"
|
dataIndex="location"
|
||||||
title="Location"
|
title="Location"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("location")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "location")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex="lot_nr"
|
dataIndex="lot_nr"
|
||||||
title="Lot Nr"
|
title="Lot Nr"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("lot_nr")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "lot_nr")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex={["first_used"]}
|
dataIndex={["first_used"]}
|
||||||
title="First Used"
|
title="First Used"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("first_used")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "first_used")}
|
||||||
render={(value) => (
|
render={(value) => (
|
||||||
<DateField
|
<DateField
|
||||||
hidden={!value}
|
hidden={!value}
|
||||||
@@ -166,7 +165,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex={["last_used"]}
|
dataIndex={["last_used"]}
|
||||||
title="Last Used"
|
title="Last Used"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("last_used")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "last_used")}
|
||||||
render={(value) => (
|
render={(value) => (
|
||||||
<DateField
|
<DateField
|
||||||
hidden={!value}
|
hidden={!value}
|
||||||
@@ -180,7 +179,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex={["comment"]}
|
dataIndex={["comment"]}
|
||||||
title="Comment"
|
title="Comment"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("comment")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "comment")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
title="Actions"
|
title="Actions"
|
||||||
|
|||||||
20
client/src/pages/vendors/list.tsx
vendored
20
client/src/pages/vendors/list.tsx
vendored
@@ -15,8 +15,7 @@ import {
|
|||||||
import { Table, Space } from "antd";
|
import { Table, Space } from "antd";
|
||||||
import dayjs from "dayjs";
|
import dayjs from "dayjs";
|
||||||
import utc from "dayjs/plugin/utc";
|
import utc from "dayjs/plugin/utc";
|
||||||
import { genericSorter } from "../../utils/sorting";
|
import { genericSorter, getSortOrderForField } from "../../utils/sorting";
|
||||||
import { SortOrder } from "antd/es/table/interface";
|
|
||||||
import { IVendor } from "./model";
|
import { IVendor } from "./model";
|
||||||
|
|
||||||
dayjs.extend(utc);
|
dayjs.extend(utc);
|
||||||
@@ -59,15 +58,6 @@ export const VendorList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
// Sort dataSource by the sorters
|
// Sort dataSource by the sorters
|
||||||
dataSource.sort(genericSorter(sorters));
|
dataSource.sort(genericSorter(sorters));
|
||||||
|
|
||||||
// Utility function to get the default sort order of a field based on the sorters_initial
|
|
||||||
const defaultSortOrder = (field: string): SortOrder | undefined => {
|
|
||||||
const sorter = sorters_initial.find((s) => s.field === field);
|
|
||||||
if (sorter) {
|
|
||||||
return sorter.order === "asc" ? "ascend" : "descend";
|
|
||||||
}
|
|
||||||
return undefined;
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<List>
|
<List>
|
||||||
<Table
|
<Table
|
||||||
@@ -80,19 +70,19 @@ export const VendorList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex="id"
|
dataIndex="id"
|
||||||
title="Id"
|
title="Id"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("id")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "id")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex="name"
|
dataIndex="name"
|
||||||
title="Name"
|
title="Name"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("name")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "name")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
dataIndex={["registered"]}
|
dataIndex={["registered"]}
|
||||||
title="Registered"
|
title="Registered"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("registered")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "registered")}
|
||||||
render={(value) => (
|
render={(value) => (
|
||||||
<DateField
|
<DateField
|
||||||
value={dayjs.utc(value).local()}
|
value={dayjs.utc(value).local()}
|
||||||
@@ -105,7 +95,7 @@ export const VendorList: React.FC<IResourceComponentsProps> = () => {
|
|||||||
dataIndex={["comment"]}
|
dataIndex={["comment"]}
|
||||||
title="Comment"
|
title="Comment"
|
||||||
sorter={true}
|
sorter={true}
|
||||||
defaultSortOrder={defaultSortOrder("comment")}
|
defaultSortOrder={getSortOrderForField(sorters_initial, "comment")}
|
||||||
/>
|
/>
|
||||||
<Table.Column
|
<Table.Column
|
||||||
title="Actions"
|
title="Actions"
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import { CrudSort } from "@refinedev/core";
|
import { CrudSort } from "@refinedev/core";
|
||||||
|
import { SortOrder } from "antd/es/table/interface";
|
||||||
|
|
||||||
interface IObj {
|
interface IObj {
|
||||||
[key: string]: unknown;
|
[key: string]: unknown;
|
||||||
@@ -59,3 +60,17 @@ export function genericSorter(sorters: CrudSort[]) {
|
|||||||
return 0;
|
return 0;
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns the sort order for a given field based on the provided sorters.
|
||||||
|
* @param sorters An array of `CrudSort` objects that define the sorting criteria.
|
||||||
|
* @param field The field to get the sort order for.
|
||||||
|
* @returns The sort order for the given field, or undefined if the field is not being sorted.
|
||||||
|
*/
|
||||||
|
export function getSortOrderForField(sorters: CrudSort[], field: string): SortOrder | undefined {
|
||||||
|
const sorter = sorters.find((s) => s.field === field);
|
||||||
|
if (sorter) {
|
||||||
|
return sorter.order === "asc" ? "ascend" : "descend";
|
||||||
|
}
|
||||||
|
return undefined;
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user