GSAP context simple implementation in React

gsapReact.tsx

  const elementRef = useRef(null);
  const tl1Ref = useRef(null);
  const tl2Ref = useRef(null);
  
    useLayoutEffect(() => {
    tl1Ref.current = gsap.timeline();
    gsap.set(elementRef.current, { y: "100%", opacity: 1 });
    
     const ctx = gsap.context(() => {
      tl1Ref.current
        .to(elementRef.current, { 
          onStart: () => {
           console.log('Start!');
          },
          y: "0%", 
          duration: 0.8
        }, 0)
        .to(elementRef.current, { 
          delay: 2.3,
          y: "-150%", 
          ease: "power2.out",
        }, ">-0.2");

    }, parentRef.current);

    return () => {
      ctx.revert();
    };
}, []);