I am having an issue I have seen described in other contexts but haven't found a solution for. My project is using the Next.js framework for react, Smooth Scrollbar, and ScrollTrigger. I have a .to() with a scrollTrigger object inside that is in a <Navigation /> component. The text at the top of the page is just supposed to pin itself and scroll with the window, but it only works in some cases. I think I'm not fully understanding some lifecycle thing here. All these methods of reproducing
I find that a useCallback is best for just telling when an element is available to the DOM, as I've had useEffect get funny/buggy when using refs to target elements and my linter wanting those passed in as a dependency of the useEffect, or not finding the refs on initial render, so this is why I generally use useCallback for setting up animations/scrolltriggers, because with that setup I can ensure that the node exists in the dom. If an animation is triggered/changed via state or change, or sim