Simplify the use of Greensock and React

useGreensock.js

function useGreensock(callback, deps, optionalScope) {
  const defaultScope = useRef() 
  const scope = optionalScope || defaultScope
  
  useLayoutEffect(() => {
    const context = gsap.context(callback, scope)
    
    return () => context.revert()
  }, deps)
  
  return scope
}

/**

function Component({ isVisible }) {
  const scope = useGreensock(container, () => {
    gsap.to(".box", { opacity: isVisible ? 1 : 0 })
  }, [isVisible])
  
  return (
    <div ref={scope}>
      <div className="box" />
    </div>
  )
}

 */