diff --git a/client/src/pages/filaments/list.tsx b/client/src/pages/filaments/list.tsx index da59043..ff21443 100644 --- a/client/src/pages/filaments/list.tsx +++ b/client/src/pages/filaments/list.tsx @@ -3,6 +3,7 @@ import { IResourceComponentsProps, BaseRecord, CrudSort, + CrudFilter, } from "@refinedev/core"; import { useTable, @@ -21,6 +22,7 @@ import { filterPopulator, genericFilterer, genericSorter, + getFiltersForField, getSortOrderForField, } from "../../utils/sorting"; @@ -41,6 +43,15 @@ export const FilamentList: React.FC = () => { ]; }); + // Load filter state from local storage + const [filters_initial] = React.useState(() => { + const storedFilters = localStorage.getItem("filamentListFilters"); + if (storedFilters) { + return JSON.parse(storedFilters); + } + return []; + }); + // Fetch data from the API const { tableProps, sorters, filters } = useTable({ syncWithLocation: false, @@ -53,6 +64,7 @@ export const FilamentList: React.FC = () => { }, filters: { mode: "off", // Disable server-side filtering + initial: filters_initial, }, }); @@ -61,6 +73,11 @@ export const FilamentList: React.FC = () => { localStorage.setItem("filamentListSorters", JSON.stringify(sorters)); }, [sorters]); + // Store filter state in local storage + React.useEffect(() => { + localStorage.setItem("filamentListFilters", JSON.stringify(filters)); + }, [filters]); + // Copy dataSource to avoid mutating the original const dataSource = [...(tableProps.dataSource || [])]; @@ -102,6 +119,10 @@ export const FilamentList: React.FC = () => { "vendor_name" )} filters={filterPopulator(dataSource, "vendor_name")} + defaultFilteredValue={getFiltersForField( + filters_initial, + "vendor_name" + )} /> = () => { sorter={true} defaultSortOrder={getSortOrderForField(sorters_initial, "name")} filters={filterPopulator(dataSource, "name")} + defaultFilteredValue={getFiltersForField(filters_initial, "name")} /> = () => { sorter={true} defaultSortOrder={getSortOrderForField(sorters_initial, "material")} filters={filterPopulator(dataSource, "material")} + defaultFilteredValue={getFiltersForField(filters_initial, "material")} /> = () => { "article_number" )} filters={filterPopulator(dataSource, "article_number")} + defaultFilteredValue={getFiltersForField( + filters_initial, + "article_number" + )} /> { + if ("field" in filter && filter.field === field) { + filterValues.push(...filter.value as string[]); + } + }); + return filterValues; +}