Filter boolean field with antd table
How do I filter boolean value with filterDropdown in antd list view? What am i doing wrong here?
<Table.Column<Template>
dataIndex="base"
title="Base"
defaultFilteredValue={getDefaultFilter('base', filters)}
filterIcon={<FilterFilled />}
filterMultiple={false}
filterDropdown={(props) => (
<FilterDropdown
{...props}
mapValue={(selectedKeys) => {
console.log(selectedKeys);
return selectedKeys;
}}
>
<Select
style={{ width: 200 }}
options={[
{ label: 'Yes', value: true },
{ label: 'No', value: false },
]}
/>
</FilterDropdown>
)}
onFilter={(value, record) => {
console.log(value, record);
const base = record.base ? true : false;
return base === value;
}}
render={(value, record) => (
<BooleanField
value={record.base}
trueIcon={<CheckCircleTwoTone twoToneColor="#007965" />}
falseIcon={<CloseCircleTwoTone twoToneColor="#ad001d" />}
valueLabelTrue="Yes"
valueLabelFalse="No"
/>
)}
/><Table.Column<Template>
dataIndex="base"
title="Base"
defaultFilteredValue={getDefaultFilter('base', filters)}
filterIcon={<FilterFilled />}
filterMultiple={false}
filterDropdown={(props) => (
<FilterDropdown
{...props}
mapValue={(selectedKeys) => {
console.log(selectedKeys);
return selectedKeys;
}}
>
<Select
style={{ width: 200 }}
options={[
{ label: 'Yes', value: true },
{ label: 'No', value: false },
]}
/>
</FilterDropdown>
)}
onFilter={(value, record) => {
console.log(value, record);
const base = record.base ? true : false;
return base === value;
}}
render={(value, record) => (
<BooleanField
value={record.base}
trueIcon={<CheckCircleTwoTone twoToneColor="#007965" />}
falseIcon={<CloseCircleTwoTone twoToneColor="#ad001d" />}
valueLabelTrue="Yes"
valueLabelFalse="No"
/>
)}
/>