diff --git a/docs/useSet.md b/docs/useSet.md index 554072023b..66b9cc0d9f 100644 --- a/docs/useSet.md +++ b/docs/useSet.md @@ -4,16 +4,22 @@ React state hook that tracks a [Set](https://developer.mozilla.org/en-US/docs/We ## Usage +What is the difference between the "clear()" method and the "reset()" method? + +The "reset()" method returns the "Set" to the initial value passed during "useSet +The "clear()" method completely empties the "Set". + ```jsx import {useSet} from 'react-use'; const Demo = () => { - const [set, { add, has, remove, toggle, reset }] = useSet(new Set(['hello'])); + const [set, { add, has, remove, toggle, reset, clear }] = useSet(new Set(['hello'])); return (
+ diff --git a/src/useSet.ts b/src/useSet.ts index d45c27255d..9c88306cc9 100644 --- a/src/useSet.ts +++ b/src/useSet.ts @@ -5,6 +5,7 @@ export interface StableActions { remove: (key: K) => void; toggle: (key: K) => void; reset: () => void; + clear: () => void; } export interface Actions extends StableActions { @@ -25,7 +26,7 @@ const useSet = (initialSet = new Set()): [Set, Actions] => { : new Set([...Array.from(prevSet), item]) ); - return { add, remove, toggle, reset: () => setSet(initialSet) }; + return { add, remove, toggle, reset: () => setSet(initialSet), clear: () => setSet(new Set()) }; }, [setSet]); const utils = { diff --git a/stories/useSet.story.tsx b/stories/useSet.story.tsx index 82c298ad29..197d996af7 100644 --- a/stories/useSet.story.tsx +++ b/stories/useSet.story.tsx @@ -4,12 +4,13 @@ import { useSet } from '../src'; import ShowDocs from './util/ShowDocs'; const Demo = () => { - const [set, { add, has, remove, reset, toggle }] = useSet(new Set(['hello'])); + const [set, { add, has, remove, reset, clear, toggle }] = useSet(new Set(['hello'])); return (
+ diff --git a/tests/useSet.test.ts b/tests/useSet.test.ts index 787eb5e4b9..b4daa70d3e 100644 --- a/tests/useSet.test.ts +++ b/tests/useSet.test.ts @@ -14,6 +14,7 @@ it('should init set and utils', () => { remove: expect.any(Function), toggle: expect.any(Function), reset: expect.any(Function), + clear: expect.any(Function), }); }); @@ -145,10 +146,21 @@ it('should reset to initial set provided', () => { expect(result.current[0]).toEqual(new Set([1])); }); +it('should be empty', () => { + const { result } = setUp(new Set([1])); + const [, utils] = result.current; + + act(() => { + utils.clear(); + }); + + expect(result.current[0]).toEqual(new Set([])); +}); + it('should memoized its utils methods', () => { const { result } = setUp(new Set(['a', 'b'])); const [, utils] = result.current; - const { add, remove, reset, toggle } = utils; + const { add, remove, reset, clear, toggle } = utils; act(() => { add('foo'); @@ -158,4 +170,5 @@ it('should memoized its utils methods', () => { expect(result.current[1].remove).toBe(remove); expect(result.current[1].toggle).toBe(toggle); expect(result.current[1].reset).toBe(reset); + expect(result.current[1].clear).toBe(clear); });