diff --git a/package.json b/package.json index 3d8077f..b12b4e8 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "@fabiulous/routing", "description": "Generates a typed routing mechanist based on a config", "private": false, - "version": "0.1.7", + "version": "0.1.8", "type": "module", "files": [ "dist" diff --git a/src/hooks/useDebouncedQueryState.test.tsx b/src/hooks/useDebouncedQueryState.test.tsx index 7e22b8b..0c21f74 100644 --- a/src/hooks/useDebouncedQueryState.test.tsx +++ b/src/hooks/useDebouncedQueryState.test.tsx @@ -50,7 +50,7 @@ describe('useDebouncedQueryState', () => { vi.runAllTimers(); - expect(customFunction).toHaveBeenLastCalledWith('blank', { name: 'UpdatedTest' }, undefined); + expect(customFunction).toHaveBeenLastCalledWith('blank', { name: 'UpdatedTest' }, false); expect(result.current[0]).toBe('UpdatedTest'); expect(result.current[1]).toBe('Test'); diff --git a/src/hooks/useDebouncedQueryState.ts b/src/hooks/useDebouncedQueryState.ts index 4ffed2a..cbab613 100644 --- a/src/hooks/useDebouncedQueryState.ts +++ b/src/hooks/useDebouncedQueryState.ts @@ -8,7 +8,7 @@ import { Maybe, Routing } from '../types'; export const generateUseDebouncedQueryState = (context: React.Context>>) => { - return (name: string, defaultValue?: T, delay: number = 500): [Maybe, Maybe, React.Dispatch>] => { + return (name: string, defaultValue?: T, delay: number = 500, replace: boolean = false): [Maybe, Maybe, React.Dispatch>] => { const { go, location } = React.useContext(context); const timeout = React.useRef(); @@ -21,8 +21,8 @@ export const generateUseDebouncedQueryState = (context const [value, setValue] = React.useState(query); const updateHistory = React.useCallback(() => { - go({ [name]: value }); - }, [go, name, value]); + go({ [name]: value }, replace); + }, [go, name, value, replace]); React.useEffect( () => { diff --git a/src/hooks/useQueryState.test.tsx b/src/hooks/useQueryState.test.tsx index fa50d2b..3d79a21 100644 --- a/src/hooks/useQueryState.test.tsx +++ b/src/hooks/useQueryState.test.tsx @@ -44,6 +44,30 @@ describe('useQueryState', () => { result.current[1]('UpdatedTest'); }); - expect(customFunction).toHaveBeenLastCalledWith('blank', { name: 'UpdatedTest' }, undefined ); + expect(customFunction).toHaveBeenLastCalledWith('blank', { name: 'UpdatedTest' }, false ); + }) + + test('Should send replace false to go function', () => { + const { result } = renderHook(() => useQueryState('name'), { wrapper }); + + expect(result.current[0]).toBe('Test'); + + act(() => { + result.current[1]('UpdatedTest', false); + }); + + expect(customFunction).toHaveBeenLastCalledWith('blank', { name: 'UpdatedTest' }, false ); + }) + + test('Should send replace true to go function', () => { + const { result } = renderHook(() => useQueryState('name'), { wrapper }); + + expect(result.current[0]).toBe('Test'); + + act(() => { + result.current[1]('UpdatedTest', true); + }); + + expect(customFunction).toHaveBeenLastCalledWith('blank', { name: 'UpdatedTest' }, true ); }) }); diff --git a/src/hooks/useQueryState.ts b/src/hooks/useQueryState.ts index 399de95..3e2647c 100644 --- a/src/hooks/useQueryState.ts +++ b/src/hooks/useQueryState.ts @@ -6,13 +6,13 @@ import { Maybe, MaybeNull, Routing } from '../types'; export const generateUseQueryState = (context: React.Context>>) => { - return (name: string, defaultValue?: T): [Maybe, (value?: MaybeNull) => void] => { + return (name: string, defaultValue?: T): [Maybe, (value?: MaybeNull, replace?: boolean) => void] => { const { go, location } = React.useContext(context); const value = React.useMemo(() => location ? parseQuery(location.search)[name] as Maybe : undefined, [location, name]); - const setValue = React.useCallback((value?: MaybeNull) => { - go({ [name]: value }); + const setValue = React.useCallback((value?: MaybeNull, replace: boolean = false) => { + go({ [name]: value }, replace); }, [go, name]); diff --git a/src/hooks/useRouter.test.tsx b/src/hooks/useRouter.test.tsx index e431802..d31955d 100644 --- a/src/hooks/useRouter.test.tsx +++ b/src/hooks/useRouter.test.tsx @@ -35,5 +35,6 @@ describe('useRouter', () => { expect(result.current.home.path).toBe(router.home.path); expect(result.current.auth.login.path).toBe(router.auth.login.path); + expect(result.current.users.editTab(1, 'test').path).toBe(router.users.editTab(1, 'test').path); }) }); diff --git a/src/routing.test.ts b/src/routing.test.ts index cb1237f..a046086 100644 --- a/src/routing.test.ts +++ b/src/routing.test.ts @@ -17,6 +17,8 @@ describe('generateRouter testing', () => { expect(editResult.path).toBe('/users/edit/:userId'); const editResultWithId = result.users.edit(1); expect(editResultWithId.path).toBe('/users/edit/1'); + const editResultWithIdAndTab = result.users.editTab(1, 'test'); + expect(editResultWithIdAndTab.path).toBe('/users/edit/1/test'); }) test('Route go', () => { diff --git a/src/routing.ts b/src/routing.ts index 6376c35..58b4d26 100644 --- a/src/routing.ts +++ b/src/routing.ts @@ -11,8 +11,8 @@ const generateRoute = (fn: (path: string, params: May } if (typeof route === 'function') { - return args => { - const routeResult = route(args); + return (...args) => { + const routeResult = route(...args); if (typeof routeResult === 'string') { const path = `${basePath}${routeResult}`; diff --git a/src/tests/mocks.ts b/src/tests/mocks.ts index 91c99c8..9bcae29 100644 --- a/src/tests/mocks.ts +++ b/src/tests/mocks.ts @@ -11,6 +11,7 @@ export const routes = { routes: { create: '/create', edit: (userId: string | number = ':userId') => `/edit/${userId}`, + editTab: (userId: string | number = ':userId', tab: string) => `/edit/${userId}/${tab}`, view: (userId: string | number = ':userId') => ({ path: `/${userId}`, routes: {