diff --git a/client/src/pages/filaments/list.tsx b/client/src/pages/filaments/list.tsx index 42a6b15..21d2ed5 100644 --- a/client/src/pages/filaments/list.tsx +++ b/client/src/pages/filaments/list.tsx @@ -13,7 +13,7 @@ import { DateField, CloneButton, } from "@refinedev/antd"; -import { Table, Space } from "antd"; +import { Table, Space, Button } from "antd"; import { NumberFieldUnit } from "../../components/numberField"; import dayjs from "dayjs"; import utc from "dayjs/plugin/utc"; @@ -25,6 +25,7 @@ import { getFiltersForField, getSortOrderForField, } from "../../utils/sorting"; +import { FilterOutlined } from "@ant-design/icons"; dayjs.extend(utc); @@ -53,20 +54,21 @@ export const FilamentList: React.FC = () => { }); // Fetch data from the API - const { tableProps, sorters, filters } = useTable({ - syncWithLocation: false, - pagination: { - mode: "off", // Perform pagination in antd's Table instead. Otherwise client-side sorting/filtering doesn't work. - }, - sorters: { - mode: "off", // Disable server-side sorting - initial: sorters_initial, - }, - filters: { - mode: "off", // Disable server-side filtering - initial: filters_initial, - }, - }); + const { tableProps, sorters, filters, setSorters, setFilters } = + useTable({ + syncWithLocation: false, + pagination: { + mode: "off", // Perform pagination in antd's Table instead. Otherwise client-side sorting/filtering doesn't work. + }, + sorters: { + mode: "off", // Disable server-side sorting + initial: sorters_initial, + }, + filters: { + mode: "off", // Disable server-side filtering + initial: filters_initial, + }, + }); // Store sorter state in local storage React.useEffect(() => { @@ -97,7 +99,23 @@ export const FilamentList: React.FC = () => { filteredDataSource.sort(genericSorter(sorters)); return ( - + ( + <> + + {defaultButtons} + + )} + >