From ff27068675cb158a7e44299f81359614e9677f1f Mon Sep 17 00:00:00 2001 From: linardsblk Date: Mon, 17 Oct 2022 16:01:51 +0300 Subject: [PATCH 1/5] [@mantine/hooks] use-timout: Add parameters for callback function --- .../src/use-timeout/use-timeout.test.ts | 15 +++++++++++++++ src/mantine-hooks/src/use-timeout/use-timeout.ts | 6 +++--- 2 files changed, 18 insertions(+), 3 deletions(-) diff --git a/src/mantine-hooks/src/use-timeout/use-timeout.test.ts b/src/mantine-hooks/src/use-timeout/use-timeout.test.ts index 2acc7a87869..85189bb6c61 100644 --- a/src/mantine-hooks/src/use-timeout/use-timeout.test.ts +++ b/src/mantine-hooks/src/use-timeout/use-timeout.test.ts @@ -88,4 +88,19 @@ describe('@mantine/hooks/use-timeout', () => { expect(setTimeout).toHaveBeenCalled(); expect(clearTimeout).toHaveBeenCalled(); }); + + it('start function passes parameters to callback', () => { + const { timeout, advanceTimerToNextTick } = setupTimer(10); + const hook = renderHook(() => useTimeout(callback, timeout)); + + const MOCK_CALLBACK_VALUE = 'MOCK_CALLBACK_VALUE'; + act(() => { + hook.result.current.start(MOCK_CALLBACK_VALUE); + }); + + advanceTimerToNextTick(); + + expect(setTimeout).toHaveBeenCalled(); + expect(callback).toBeCalledWith(MOCK_CALLBACK_VALUE); + }); }); diff --git a/src/mantine-hooks/src/use-timeout/use-timeout.ts b/src/mantine-hooks/src/use-timeout/use-timeout.ts index c5266c09ad7..c42802a0332 100644 --- a/src/mantine-hooks/src/use-timeout/use-timeout.ts +++ b/src/mantine-hooks/src/use-timeout/use-timeout.ts @@ -1,16 +1,16 @@ import { useRef, useEffect } from 'react'; export function useTimeout( - fn: () => void, + callback: (callbackParams?: any) => void, delay: number, options: { autoInvoke: boolean } = { autoInvoke: false } ) { const timeoutRef = useRef(null); - const start = () => { + const start = (callbackParams?: any) => { if (!timeoutRef.current) { timeoutRef.current = window.setTimeout(() => { - fn(); + callback(callbackParams); timeoutRef.current = null; }, delay); } From f401982a71cdf73a23580f5f156d5c9a0c662a99 Mon Sep 17 00:00:00 2001 From: linardsblk Date: Mon, 17 Oct 2022 16:02:17 +0300 Subject: [PATCH 2/5] [docs] use-timeout: Update docs with callback function parameters --- docs/src/docs/hooks/use-timeout.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/src/docs/hooks/use-timeout.mdx b/docs/src/docs/hooks/use-timeout.mdx index 3d9bfd43c04..8de96cd414f 100644 --- a/docs/src/docs/hooks/use-timeout.mdx +++ b/docs/src/docs/hooks/use-timeout.mdx @@ -38,13 +38,13 @@ Return object: ```tsx function useTimeout( - callback: () => void, + callback: (callbackParams?: any) => void, delay: number, options?: { autoInvoke: boolean; } ): { - start: () => void; + start: (callbackParams?: any) => void; clear: () => void; }; ``` From 916f54cccc486641d3bc49c6d66aaf5b7df708e9 Mon Sep 17 00:00:00 2001 From: linardsblk Date: Mon, 17 Oct 2022 18:36:26 +0300 Subject: [PATCH 3/5] [@mantine/hooks] use-timeout: Callback parameter changed to multiple parameters --- src/mantine-hooks/src/use-timeout/use-timeout.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/mantine-hooks/src/use-timeout/use-timeout.ts b/src/mantine-hooks/src/use-timeout/use-timeout.ts index c42802a0332..79578520a69 100644 --- a/src/mantine-hooks/src/use-timeout/use-timeout.ts +++ b/src/mantine-hooks/src/use-timeout/use-timeout.ts @@ -1,13 +1,13 @@ import { useRef, useEffect } from 'react'; export function useTimeout( - callback: (callbackParams?: any) => void, + callback: (...callbackParams: any[]) => void, delay: number, options: { autoInvoke: boolean } = { autoInvoke: false } ) { const timeoutRef = useRef(null); - const start = (callbackParams?: any) => { + const start = (...callbackParams: any[]) => { if (!timeoutRef.current) { timeoutRef.current = window.setTimeout(() => { callback(callbackParams); From 727746a9d4fa01eaa1478673246883bfe71b6eb3 Mon Sep 17 00:00:00 2001 From: linardsblk Date: Mon, 17 Oct 2022 18:37:27 +0300 Subject: [PATCH 4/5] [docs] use-timeout: Callback function with multiple parameters --- docs/src/docs/hooks/use-timeout.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/src/docs/hooks/use-timeout.mdx b/docs/src/docs/hooks/use-timeout.mdx index 8de96cd414f..82cecf1c26e 100644 --- a/docs/src/docs/hooks/use-timeout.mdx +++ b/docs/src/docs/hooks/use-timeout.mdx @@ -38,13 +38,13 @@ Return object: ```tsx function useTimeout( - callback: (callbackParams?: any) => void, + callback: (...callbackParams: any[]) => void, delay: number, options?: { autoInvoke: boolean; } ): { - start: (callbackParams?: any) => void; + start: (...callbackParams: any[]) => void; clear: () => void; }; ``` From 300a8b9167b8df2e09e0ef102fd3d072f7d93766 Mon Sep 17 00:00:00 2001 From: linardsblk Date: Mon, 17 Oct 2022 19:24:00 +0300 Subject: [PATCH 5/5] [@mantine/hooks] use-timeout: Fix tests --- src/mantine-hooks/src/use-timeout/use-timeout.test.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/mantine-hooks/src/use-timeout/use-timeout.test.ts b/src/mantine-hooks/src/use-timeout/use-timeout.test.ts index 85189bb6c61..2e6d76c091b 100644 --- a/src/mantine-hooks/src/use-timeout/use-timeout.test.ts +++ b/src/mantine-hooks/src/use-timeout/use-timeout.test.ts @@ -101,6 +101,6 @@ describe('@mantine/hooks/use-timeout', () => { advanceTimerToNextTick(); expect(setTimeout).toHaveBeenCalled(); - expect(callback).toBeCalledWith(MOCK_CALLBACK_VALUE); + expect(callback).toBeCalledWith([MOCK_CALLBACK_VALUE]); }); });