chore: restore filter operator after clearing on filter dropdown (#3224)

Co-authored-by: leapful <leapful> Co-authored-by: Alican Erdurmaz <alicanerdurmaz@gmail.com> closes #1386
refinedev · Dec 14, 2022 · a47f179 · a47f179
1 parent b867497
commit a47f179
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 4 deletions.
diff --git a/.changeset/fifty-chefs-drive.md b/.changeset/fifty-chefs-drive.md
@@ -0,0 +1,5 @@
+---
+"@pankod/refine-core": patch
+---
+
+Restore filter operator after clear it by using filter dropdown
diff --git a/packages/antd/src/definitions/table/index.spec.ts b/packages/antd/src/definitions/table/index.spec.ts
@@ -274,4 +274,24 @@ describe("definitions/table", () => {
             ]
         `);
     });
+
+    it("mapAntdFilterToCrudFilter with map initial filter to restore operator in no data on previous filters", () => {
+        expect(
+            mapAntdFilterToCrudFilter(
+                {
+                    foo: "Test",
+                },
+                [],
+                [{ field: "foo", operator: "contains", value: "" }],
+            ),
+        ).toMatchInlineSnapshot(`
+            Array [
+              Object {
+                "field": "foo",
+                "operator": "contains",
+                "value": "Test",
+              },
+            ]
+        `);
+    });
 });
diff --git a/packages/antd/src/definitions/table/index.ts b/packages/antd/src/definitions/table/index.ts
@@ -5,6 +5,8 @@ import {
     CrudFilter,
     getDefaultFilter as getDefaultFilterCore,
     getDefaultSortOrder as getDefaultSortOrderCore,
+    ConditionalFilter,
+    LogicalFilter,
 } from "@pankod/refine-core";
 import { SortOrder, SorterResult } from "antd/lib/table/interface";
 
@@ -79,14 +81,24 @@ export const mapAntdFilterToCrudFilter = (
         (string | number | boolean) | (string | number | boolean)[] | null
     >,
     prevFilters: CrudFilters,
+    initialFilters?: CrudFilters,
 ): CrudFilters => {
     const crudFilters: CrudFilters = [];
+    const mapInitialFilter: Record<string, CrudFilter> = (
+        initialFilters ?? []
+    ).reduce((acc, item) => {
+        const field =
+            (item as ConditionalFilter).key || (item as LogicalFilter).field;
+        return { ...acc, [field]: item };
+    }, {});
 
     Object.keys(tableFilters).map((field) => {
         const value = tableFilters[field];
-        const operator = prevFilters
-            .filter((i) => i.operator !== "or")
-            .find((p: any) => p.field === field)?.operator;
+        const operator =
+            prevFilters
+                .filter((i) => i.operator !== "or")
+                .find((p: any) => p.field === field)?.operator ||
+            mapInitialFilter[field]?.operator;
 
         if (operator !== "or" && operator !== "and") {
             crudFilters.push({

diff --git a/packages/antd/src/hooks/table/useTable/useTable.ts b/packages/antd/src/hooks/table/useTable/useTable.ts
@@ -22,7 +22,7 @@ import {
 import {
     mapAntdSorterToCrudSorting,
     mapAntdFilterToCrudFilter,
-} from "../../../definitions/table";
+} from "@definitions/table";
 import { PaginationLink } from "./paginationLink";
 
 export type useTableProps<
@@ -144,6 +144,7 @@ export const useTable = <
             const crudFilters = mapAntdFilterToCrudFilter(
                 tableFilters,
                 filters,
+                initialFilter,
             );
             setFilters(crudFilters);
         }