From 8fb9db174dc9c88e56867327f0a1ff1507e1bfa7 Mon Sep 17 00:00:00 2001
From: Xudong Huang <me@xudong.dev>
Date: Wed, 18 Mar 2020 11:20:21 +0800
Subject: [PATCH] fix: Table column filter value type could be any (#22277)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: Table column filter value type could be any

* Update components/table/interface.tsx

Co-Authored-By: 偏右 <afc163@gmail.com>

* fix: Solve modification type failed CI check

Co-authored-by: 偏右 <afc163@gmail.com>
---
 .../table/hooks/useFilter/FilterDropdown.tsx      | 15 +++++++++++----
 components/table/hooks/useFilter/index.tsx        |  2 +-
 components/table/interface.tsx                    |  4 ++--
 3 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/components/table/hooks/useFilter/FilterDropdown.tsx b/components/table/hooks/useFilter/FilterDropdown.tsx
index e457e37772..28ae3dd9d7 100644
--- a/components/table/hooks/useFilter/FilterDropdown.tsx
+++ b/components/table/hooks/useFilter/FilterDropdown.tsx
@@ -23,10 +23,12 @@ function renderFilterItems(
   multiple: boolean,
 ) {
   return filters.map((filter, index) => {
+    const key = String(filter.value);
+
     if (filter.children) {
       return (
         <SubMenu
-          key={filter.value || index}
+          key={key || index}
           title={filter.text}
           popupClassName={`${prefixCls}-dropdown-submenu`}
         >
@@ -38,8 +40,8 @@ function renderFilterItems(
     const Component = multiple ? Checkbox : Radio;
 
     return (
-      <MenuItem key={filter.value !== undefined ? filter.value : index}>
-        <Component checked={filteredKeys.includes(String(filter.value))} />
+      <MenuItem key={filter.value !== undefined ? key : index}>
+        <Component checked={filteredKeys.includes(key)} />
         <span>{filter.text}</span>
       </MenuItem>
     );
@@ -187,7 +189,12 @@ function FilterDropdown<RecordType>(props: FilterDropdownProps<RecordType>) {
           openKeys={openKeys}
           onOpenChange={onOpenChange}
         >
-          {renderFilterItems(column.filters || [], prefixCls, getFilteredKeysSync(), filterMultiple)}
+          {renderFilterItems(
+            column.filters || [],
+            prefixCls,
+            getFilteredKeysSync(),
+            filterMultiple,
+          )}
         </Menu>
         <div className={`${prefixCls}-dropdown-btns`}>
           <a className={`${prefixCls}-dropdown-link confirm`} onClick={onConfirm}>
diff --git a/components/table/hooks/useFilter/index.tsx b/components/table/hooks/useFilter/index.tsx
index b6b7b912e7..7ff606a3a4 100644
--- a/components/table/hooks/useFilter/index.tsx
+++ b/components/table/hooks/useFilter/index.tsx
@@ -125,7 +125,7 @@ function generateFilterInfo<RecordType>(filterStates: FilterState<RecordType>[])
 }
 
 function flattenKeys(filters?: ColumnFilterItem[]) {
-  let keys: Key[] = [];
+  let keys: (string | number | boolean)[] = [];
   (filters || []).forEach(({ value, children }) => {
     keys.push(value);
     if (children) {
diff --git a/components/table/interface.tsx b/components/table/interface.tsx
index 640b63d602..0365fc1861 100644
--- a/components/table/interface.tsx
+++ b/components/table/interface.tsx
@@ -31,7 +31,7 @@ export type CompareFn<T> = (a: T, b: T, sortOrder?: SortOrder) => number;
 
 export interface ColumnFilterItem {
   text: React.ReactNode;
-  value: string;
+  value: string | number | boolean;
   children?: ColumnFilterItem[];
 }
 
@@ -83,7 +83,7 @@ export interface ColumnType<RecordType> extends RcColumnType<RecordType> {
   filteredValue?: Key[] | null;
   defaultFilteredValue?: Key[] | null;
   filterIcon?: React.ReactNode | ((filtered: boolean) => React.ReactNode);
-  onFilter?: (value: any, record: RecordType) => boolean;
+  onFilter?: (value: string | number | boolean, record: RecordType) => boolean;
   filterDropdownVisible?: boolean;
   onFilterDropdownVisibleChange?: (visible: boolean) => void;
 }