Infinite scroll using IntersectionObserver in React

I made infinite scroll using IntersectionObserver.

Here is the link. https://codesandbox.io/s/brave-fog-qy1f7j?file=/src/App.tsx

I want to add arr.length !== 0 to line 43 like this.

if (now.current !== 0 && arr.length !== 0 && now.current < testData.length) {

But arr is always empty inside of IntersectionObserver callback.

You can check it through the console.

I want to know why arr is always empty.