/
dedaMazai
/
reactGoodPattern
Обзор
Документация
Войти
/
dedaMazai
/
reactGoodPattern
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
moduleFederation/container/src/shared/lib/hooks/useModal/useModal.tsx
64 строки
1 KB
Andrey Chipizubov
add microFronts
25 май 2023, 01:05
25 май 2023, 01:05
ec973d2
Код
Авторство
О чём код?
import { MutableRefObject, useCallback, useEffect, useRef, useState, } from "react"; interface UseModalProps { onClose?: () => void; isOpen?: boolean; animationDelay?: number; } export function useModal(props: UseModalProps) { const { onClose, isOpen, animationDelay, } = props; const [isClosing, setIsClosing] = useState(false); const [isMounted, setIsMounted] = useState(false); const timerRef = useRef() as MutableRefObject<ReturnType<typeof setTimeout>>; useEffect(() => { if (isOpen) { setIsMounted(true); } }, [isOpen]); const close = useCallback(() => { if (onClose) { setIsClosing(true); timerRef.current = setTimeout(() => { onClose(); setIsClosing(false); }, animationDelay); } }, [animationDelay, onClose]); const onKeyDown = useCallback((e: KeyboardEvent) => { if (e.key === "Escape") { close(); } }, [close]); useEffect(() => { if (isOpen) { window.addEventListener("keydown", onKeyDown); } return () => { clearTimeout(timerRef.current); window.removeEventListener("keydown", onKeyDown); }; }, [isOpen, onKeyDown]); return { isClosing, isMounted, close, }; }