fix(ui): do not auto-hide next/prev image buttons

This commit is contained in:
psychedelicious 2024-05-04 10:05:42 +10:00 committed by Kent Keirsey
parent 26613f10c7
commit 6bdded85da

View File

@ -52,17 +52,20 @@ const CurrentImagePreview = () => {
// Show and hide the next/prev buttons on mouse move // Show and hide the next/prev buttons on mouse move
const [shouldShowNextPrevButtons, setShouldShowNextPrevButtons] = useState<boolean>(false); const [shouldShowNextPrevButtons, setShouldShowNextPrevButtons] = useState<boolean>(false);
const timeoutId = useRef(0); const timeoutId = useRef(0);
const onMouseMove = useCallback(() => { const onMouseOver = useCallback(() => {
setShouldShowNextPrevButtons(true); setShouldShowNextPrevButtons(true);
window.clearTimeout(timeoutId.current); window.clearTimeout(timeoutId.current);
}, []);
const onMouseOut = useCallback(() => {
timeoutId.current = window.setTimeout(() => { timeoutId.current = window.setTimeout(() => {
setShouldShowNextPrevButtons(false); setShouldShowNextPrevButtons(false);
}, 1000); }, 500);
}, []); }, []);
return ( return (
<Flex <Flex
onMouseMove={onMouseMove} onMouseOver={onMouseOver}
onMouseOut={onMouseOut}
width="full" width="full"
height="full" height="full"
alignItems="center" alignItems="center"