import { useMemo , useState } from "react" ; import Animated , { Clock , Easing } from "react-native-reanimated" ; export const useSpinAnimated = ( enabled ) => { const [ spinClock ] = useState ( ( ) => new Clock ( ) ) ; const [ spinClockState ] = useState ( ( ) => { return { finished : new Animated . Value ( 0 ) , position : new Animated . Value ( 0 ) , time : new Animated . Value ( 0 ) , frameTime : new Animated . Value ( 0 ) , } ; } ) ; const [ animConfig ] = useState ( ( ) => { return { duration : 1200 , toValue : 360 , easing : Easing . linear , } ; } ) ; return useMemo ( ( ) => { const numEnabled = enabled ? 1 : 0 ; return Animated . block ( [ Animated . cond ( numEnabled , [ Animated . startClock ( spinClock ) , Animated . timing ( spinClock , spinClockState , animConfig ) , Animated . cond ( spinClockState . finished , [ Animated . stopClock ( spinClock ) , Animated . set ( spinClockState . finished , 0 ) , Animated . set ( spinClockState . position , 0 ) , Animated . set ( spinClockState . time , 0 ) , Animated . set ( spinClockState . frameTime , 0 ) , Animated . startClock ( spinClock ) , ] ) , ] , [ Animated . cond ( Animated . clockRunning ( spinClock ) , [ Animated . stopClock ( spinClock ) , Animated . set ( spinClockState . finished , 0 ) , Animated . set ( spinClockState . position , 0 ) , Animated . set ( spinClockState . time , 0 ) , Animated . set ( spinClockState . frameTime , 0 ) , ] ) , Animated . set ( spinClockState . position , 0 ) , ] ) , Animated . divide ( Animated . multiply ( spinClockState . position , Math . PI ) , 180 ) , ] ) ; } , [ animConfig , enabled , spinClock , spinClockState ] ) ; } ;