/
dedaMazai
/
aboutMe
Обзор
Документация
Войти
/
dedaMazai
/
aboutMe
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
src/shared/lib/components/AnimationProvider/AnimationProvider.tsx
61 строка
1 KB
Andrey Chipizubov
fix
05 сен 2023, 09:22
05 сен 2023, 09:22
8214691
Код
Авторство
О чём код?
import { createContext, ReactNode, useContext, useEffect, useMemo, useRef, useState, } from 'react'; type SpringType = typeof import('@react-spring/web'); type GestureType = typeof import('@use-gesture/react'); interface AnimationContextPayload { Gesture?: GestureType; Spring?: SpringType; isLoaded?: boolean; } const AnimationContext = createContext<AnimationContextPayload>({}); // Обе либы зависят друг от друга const getAsyncAnimationModules = async () => { return Promise.all([ import('@react-spring/web'), import('@use-gesture/react'), ]); }; export const useAnimationLibs = () => { return useContext(AnimationContext) as Required<AnimationContextPayload>; }; export const AnimationProvider = ({ children }: { children: ReactNode }) => { const SpringRef = useRef<SpringType>(); const GestureRef = useRef<GestureType>(); const [isLoaded, setIsLoaded] = useState(false); useEffect(() => { getAsyncAnimationModules().then(([Spring, Gesture]) => { SpringRef.current = Spring; GestureRef.current = Gesture; setIsLoaded(true); }); }, []); const value = useMemo( () => ({ Gesture: GestureRef.current, Spring: SpringRef.current, isLoaded, }), [isLoaded], ); return ( <AnimationContext.Provider value={value}> {children} </AnimationContext.Provider> ); };