React + InertiaJS InfiniteScroll Issue

Hey so i've been facing this weird issue, using Inertia's InfiniteScroll component and Inertia::scroll() method. On every odd direct visit to the page it only loads first page and nothing else and on every even visit it works. To make sure that nothing on my page was causing it i set up a test route with very simple Test page and still same results. here's the code for my test page which is almost identical to InertiaJS doc examples

Route:

Route::get('/test', function(){
    return Inertia::render('Test',
        ['posts' => Inertia::scroll(PostResource::collection(Post::paginate(12)))]
    );
});

Test.jsx:

import { InfiniteScroll } from "@inertiajs/react";

export default function Test({ posts }) {
    return (
        <>
            <div className="container">
                <InfiniteScroll data="posts">
                    {posts.data.map((post) => (
                        <div key={post.id} className="my-24">
                            {post.title}
                        </div>
                    ))}
                </InfiniteScroll>
            </div>
            <div className="container">Temp Footer</div>
        </>
    );
}

even in this barebones version of code it acts exactly the same way. first visit no infinite scroll, second visit it mysteriously works, third - poof infinite scroll is gone.

i checked the github and couldn't find any issue similar to mine and wanted to double check before raising a new one.

I am running laravel herd for local dev, with following:

• php: 8.3
• laravel: 12.32.5
• react: 19.2
• inertiajs: 2.2.15 (updated to latest to see if it would fix the issue)