From 7e02bad71ed62cc23055b7890880d4926ad23d39 Mon Sep 17 00:00:00 2001 From: Marco Schumacher Date: Fri, 2 Sep 2022 22:05:15 +0200 Subject: [PATCH] fix: don't reset controlled values --- docs/stories/ExternalFilters.stories.tsx | 17 ++++++++++++----- src/hooks/useFilter.ts | 4 +++- src/internalState/useTableState.ts | 22 ++++++++++++++++++---- src/types.ts | 1 + 4 files changed, 34 insertions(+), 10 deletions(-) diff --git a/docs/stories/ExternalFilters.stories.tsx b/docs/stories/ExternalFilters.stories.tsx index 459624d..46b392d 100644 --- a/docs/stories/ExternalFilters.stories.tsx +++ b/docs/stories/ExternalFilters.stories.tsx @@ -13,11 +13,11 @@ export default { } as ComponentMeta; export const Primary = () => { - const [sort, setSort] = useState(); - const [firstName, setFirstName] = useState(); - const [lastName, setLastName] = useState(); - const [jobTitle, setJobTitle] = useState>(); - const [birthday, setBirthday] = useState(); + const [sort, setSort] = useState(new Array()); + const [firstName, setFirstName] = useState(''); + const [lastName, setLastName] = useState(''); + const [jobTitle, setJobTitle] = useState(new Set()); + const [birthday, setBirthday] = useState(null); return ( @@ -39,6 +39,13 @@ export const Primary = () => { sort={sort} onSortChange={setSort} externalSort + onReset={() => { + setSort([]); + setFirstName(''); + setLastName(''); + setJobTitle(new Set()); + setBirthday(null); + }} columns={(col) => [ // col((x) => x.avatar, { diff --git a/src/hooks/useFilter.ts b/src/hooks/useFilter.ts index 29d7e82..5db8564 100644 --- a/src/hooks/useFilter.ts +++ b/src/hooks/useFilter.ts @@ -14,7 +14,9 @@ export function useFilter(impl: FilterImpl // On mount and reset: Fire onChange useEffect(() => { - impl.onChange?.(impl.defaultValue); + if (impl.value === undefined) { + impl.onChange?.(impl.defaultValue); + } }, [table]); // Update implementation diff --git a/src/internalState/useTableState.ts b/src/internalState/useTableState.ts index b9f315c..57dbfb5 100644 --- a/src/internalState/useTableState.ts +++ b/src/internalState/useTableState.ts @@ -15,10 +15,24 @@ export function useTableState(_props: TableProps): [Store extends PartialTableTheme { }; debug?: (...output: any) => void; debugRender?: (...output: any) => void; + onReset?: () => void; } export type InternalTableProps = MemoizedFunctions<