From 3c8e414aef4c873c6551e8390dc5fe67192745f4 Mon Sep 17 00:00:00 2001
From: Donkie <daniel.cf.hultgren@gmail.com>
Date: Thu, 6 Jul 2023 19:32:48 +0200
Subject: [PATCH] Client: Make table use the refine sorters/filters

That way, Refine is in charge of the sorters/filters state, instead of Refine and AntD each having their own state for it.
---
 client/src/pages/filaments/list.tsx | 47 ++++++++++-------------------
 client/src/pages/spools/list.tsx    | 27 ++++++-----------
 client/src/pages/vendors/list.tsx   |  8 ++---
 3 files changed, 29 insertions(+), 53 deletions(-)

diff --git a/client/src/pages/filaments/list.tsx b/client/src/pages/filaments/list.tsx
index ff21443..42a6b15 100644
--- a/client/src/pages/filaments/list.tsx
+++ b/client/src/pages/filaments/list.tsx
@@ -108,49 +108,43 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
           dataIndex="id"
           title="Id"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "id")}
+          sortOrder={getSortOrderForField(sorters, "id")}
         />
         <Table.Column
           dataIndex="vendor_name"
           title="Vendor"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(
-            sorters_initial,
-            "vendor_name"
-          )}
+          sortOrder={getSortOrderForField(sorters, "vendor_name")}
           filters={filterPopulator(dataSource, "vendor_name")}
-          defaultFilteredValue={getFiltersForField(
-            filters_initial,
-            "vendor_name"
-          )}
+          filteredValue={getFiltersForField(filters, "vendor_name")}
         />
         <Table.Column
           dataIndex="name"
           title="Name"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "name")}
+          sortOrder={getSortOrderForField(sorters, "name")}
           filters={filterPopulator(dataSource, "name")}
-          defaultFilteredValue={getFiltersForField(filters_initial, "name")}
+          filteredValue={getFiltersForField(filters, "name")}
         />
         <Table.Column
           dataIndex="material"
           title="Material"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "material")}
+          sortOrder={getSortOrderForField(sorters, "material")}
           filters={filterPopulator(dataSource, "material")}
-          defaultFilteredValue={getFiltersForField(filters_initial, "material")}
+          filteredValue={getFiltersForField(filters, "material")}
         />
         <Table.Column
           dataIndex="price"
           title="Price"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "price")}
+          sortOrder={getSortOrderForField(sorters, "price")}
         />
         <Table.Column
           dataIndex="density"
           title="Density"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "density")}
+          sortOrder={getSortOrderForField(sorters, "density")}
           render={(value) => (
             <NumberFieldUnit
               value={value}
@@ -165,7 +159,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
           dataIndex="diameter"
           title="Diameter"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "diameter")}
+          sortOrder={getSortOrderForField(sorters, "diameter")}
           render={(value) => (
             <NumberFieldUnit
               value={value}
@@ -180,7 +174,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
           dataIndex="weight"
           title="Weight"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "weight")}
+          sortOrder={getSortOrderForField(sorters, "weight")}
           render={(value) => {
             if (value === null || value === undefined) {
               return <></>;
@@ -200,10 +194,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
           dataIndex="spool_weight"
           title="Spool Weight"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(
-            sorters_initial,
-            "spool_weight"
-          )}
+          sortOrder={getSortOrderForField(sorters, "spool_weight")}
           render={(value) => {
             if (value === null || value === undefined) {
               return <></>;
@@ -223,21 +214,15 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
           dataIndex="article_number"
           title="Article Number"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(
-            sorters_initial,
-            "article_number"
-          )}
+          sortOrder={getSortOrderForField(sorters, "article_number")}
           filters={filterPopulator(dataSource, "article_number")}
-          defaultFilteredValue={getFiltersForField(
-            filters_initial,
-            "article_number"
-          )}
+          filteredValue={getFiltersForField(filters, "article_number")}
         />
         <Table.Column
           dataIndex={["registered"]}
           title="Registered"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "registered")}
+          sortOrder={getSortOrderForField(sorters, "registered")}
           render={(value) => (
             <DateField
               value={dayjs.utc(value).local()}
@@ -250,7 +235,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
           dataIndex={["comment"]}
           title="Comment"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "comment")}
+          sortOrder={getSortOrderForField(sorters, "comment")}
         />
         <Table.Column
           title="Actions"
diff --git a/client/src/pages/spools/list.tsx b/client/src/pages/spools/list.tsx
index bb0f801..b610f9e 100644
--- a/client/src/pages/spools/list.tsx
+++ b/client/src/pages/spools/list.tsx
@@ -81,25 +81,19 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
           dataIndex="id"
           title="Id"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "id")}
+          sortOrder={getSortOrderForField(sorters, "id")}
         />
         <Table.Column
           dataIndex="filament_name"
           title="Filament"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(
-            sorters_initial,
-            "filament_name"
-          )}
+          sortOrder={getSortOrderForField(sorters, "filament_name")}
         />
         <Table.Column
           dataIndex="used_weight"
           title="Used Weight"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(
-            sorters_initial,
-            "used_weight"
-          )}
+          sortOrder={getSortOrderForField(sorters, "used_weight")}
           render={(value) => {
             return (
               <NumberFieldUnit
@@ -116,10 +110,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
           dataIndex="remaining_weight"
           title="Estimated Remaining Weight"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(
-            sorters_initial,
-            "remaining_weight"
-          )}
+          sortOrder={getSortOrderForField(sorters, "remaining_weight")}
           render={(value) => {
             if (value === null || value === undefined) {
               return <TextField value="Unknown" />;
@@ -139,19 +130,19 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
           dataIndex="location"
           title="Location"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "location")}
+          sortOrder={getSortOrderForField(sorters, "location")}
         />
         <Table.Column
           dataIndex="lot_nr"
           title="Lot Nr"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "lot_nr")}
+          sortOrder={getSortOrderForField(sorters, "lot_nr")}
         />
         <Table.Column
           dataIndex={["first_used"]}
           title="First Used"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "first_used")}
+          sortOrder={getSortOrderForField(sorters, "first_used")}
           render={(value) => (
             <DateField
               hidden={!value}
@@ -165,7 +156,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
           dataIndex={["last_used"]}
           title="Last Used"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "last_used")}
+          sortOrder={getSortOrderForField(sorters, "last_used")}
           render={(value) => (
             <DateField
               hidden={!value}
@@ -179,7 +170,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
           dataIndex={["comment"]}
           title="Comment"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "comment")}
+          sortOrder={getSortOrderForField(sorters, "comment")}
         />
         <Table.Column
           title="Actions"
diff --git a/client/src/pages/vendors/list.tsx b/client/src/pages/vendors/list.tsx
index 1126e7e..a475789 100644
--- a/client/src/pages/vendors/list.tsx
+++ b/client/src/pages/vendors/list.tsx
@@ -70,19 +70,19 @@ export const VendorList: React.FC<IResourceComponentsProps> = () => {
           dataIndex="id"
           title="Id"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "id")}
+          sortOrder={getSortOrderForField(sorters, "id")}
         />
         <Table.Column
           dataIndex="name"
           title="Name"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "name")}
+          sortOrder={getSortOrderForField(sorters, "name")}
         />
         <Table.Column
           dataIndex={["registered"]}
           title="Registered"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "registered")}
+          sortOrder={getSortOrderForField(sorters, "registered")}
           render={(value) => (
             <DateField
               value={dayjs.utc(value).local()}
@@ -95,7 +95,7 @@ export const VendorList: React.FC<IResourceComponentsProps> = () => {
           dataIndex={["comment"]}
           title="Comment"
           sorter={true}
-          defaultSortOrder={getSortOrderForField(sorters_initial, "comment")}
+          sortOrder={getSortOrderForField(sorters, "comment")}
         />
         <Table.Column
           title="Actions"