import { useEffect, useState } from 'react'
import { AccessibilityInfo } from 'react-native'
import { useReducedMotion } from 'react-native-reanimated'

export const useReduceMotion = () => {
  const [reduceMotion, setReduceMotion] = useState(useReducedMotion())

  useEffect(() => {
    AccessibilityInfo.isReduceMotionEnabled().then(setReduceMotion)

    const subscription = AccessibilityInfo.addEventListener('reduceMotionChanged', setReduceMotion)

    return () => {
      subscription.remove()
    }
  }, [])

  return reduceMotion
}