Browse Source
* fix: tour arrow color * test: updte * fix: duplicate class name * test: update snapshot * chore: speedup * fix: update current step props by onChange * chore: optimization * fix: props.current may change * chore: save * test: coverage * chore: optimization * chore: add useMergedType * chore: save * chore: optimization * chore: optimization * chore: optimization * chore: move file * refactor: useMergedType hook * chore: save * chore: optimization * test: ci * chore: remove useMemo * chore: use nullish coalescing operator * chore: rename setInnerCurrent to updateInnerCurrentpull/41892/head
iola1999
2 years ago
committed by
GitHub
GitHub
9 changed files with 308 additions and 30 deletions
@ -0,0 +1,60 @@ |
|||
import { act, renderHook } from '../../../tests/utils'; |
|||
import useMergedType from '../useMergedType'; |
|||
|
|||
describe('useMergedType', () => { |
|||
it('returns the merged type', () => { |
|||
const { result } = renderHook(() => |
|||
useMergedType({ |
|||
defaultType: 'default', |
|||
steps: [{ type: 'primary', title: 'Step 1' }], |
|||
current: 0, |
|||
}), |
|||
); |
|||
expect(result.current?.currentMergedType).toBe('primary'); |
|||
}); |
|||
|
|||
it('returns the default type', () => { |
|||
const { result } = renderHook(() => |
|||
useMergedType({ |
|||
defaultType: 'default', |
|||
steps: [], |
|||
current: 0, |
|||
}), |
|||
); |
|||
expect(result.current?.currentMergedType).toBe('default'); |
|||
}); |
|||
|
|||
it('returns the default type when index is invalid', () => { |
|||
const { result } = renderHook(() => |
|||
useMergedType({ |
|||
defaultType: 'default', |
|||
steps: [], |
|||
current: 0, |
|||
}), |
|||
); |
|||
expect(result.current?.currentMergedType).toBe('default'); |
|||
}); |
|||
|
|||
it('returns the default type when list is null', () => { |
|||
const { result } = renderHook(() => |
|||
useMergedType({ |
|||
defaultType: 'default', |
|||
}), |
|||
); |
|||
expect(result.current?.currentMergedType).toBe('default'); |
|||
}); |
|||
|
|||
it('returns type of new step after onChange from rc-tour', () => { |
|||
const { result } = renderHook(() => |
|||
useMergedType({ |
|||
defaultType: 'default', |
|||
steps: [{ title: 'Step 1' }, { type: 'primary', title: 'Step 1' }], |
|||
}), |
|||
); |
|||
act(() => { |
|||
result.current?.updateInnerCurrent?.(1); |
|||
}); |
|||
|
|||
expect(result.current?.currentMergedType).toBe('primary'); |
|||
}); |
|||
}); |
|||
@ -0,0 +1,31 @@ |
|||
import useMergedState from 'rc-util/lib/hooks/useMergedState'; |
|||
import { useLayoutEffect } from 'react'; |
|||
import type { TourProps } from './interface'; |
|||
|
|||
interface Props { |
|||
defaultType?: string; |
|||
steps?: TourProps['steps']; |
|||
current?: number; |
|||
defaultCurrent?: number; |
|||
} |
|||
|
|||
/** |
|||
* returns the merged type of a step or the default type. |
|||
*/ |
|||
const useMergedType = ({ defaultType, steps = [], current, defaultCurrent }: Props) => { |
|||
const [innerCurrent, updateInnerCurrent] = useMergedState<number | undefined>(defaultCurrent, { |
|||
value: current, |
|||
}); |
|||
|
|||
useLayoutEffect(() => { |
|||
if (current === undefined) return; |
|||
updateInnerCurrent(current); |
|||
}, [current]); |
|||
|
|||
const innerType = typeof innerCurrent === 'number' ? steps[innerCurrent]?.type : defaultType; |
|||
const currentMergedType = innerType ?? defaultType; |
|||
|
|||
return { currentMergedType, updateInnerCurrent }; |
|||
}; |
|||
|
|||
export default useMergedType; |
|||
Loading…
Reference in new issue