Viewpager 2 conflict with SwipeRefreshLayout

Question

Im trying to use SwipeRefreshLayout to load data whenever user swipe down. It works correctly in Viewpager but when I user Viewpager2 it causes :

2022-03-08 09:12:39.733 6489-6489/com.example.myapplication E/AndroidRuntime: FATAL EXCEPTION: main
    Process: com.example.myapplication, PID: 6489
    java.lang.IndexOutOfBoundsException: Index: 0, Size: 0
        at java.util.ArrayList.get(ArrayList.java:437)
        at androidx.recyclerview.widget.StaggeredGridLayoutManager$Span.calculateCachedStart(StaggeredGridLayoutManager.java:2531)
        at androidx.recyclerview.widget.StaggeredGridLayoutManager$Span.getStartLine(StaggeredGridLayoutManager.java:2548)
        at androidx.recyclerview.widget.StaggeredGridLayoutManager.checkSpanForGap(StaggeredGridLayoutManager.java:410)
        at androidx.recyclerview.widget.StaggeredGridLayoutManager.hasGapsToFix(StaggeredGridLayoutManager.java:359)
        at androidx.recyclerview.widget.StaggeredGridLayoutManager.checkForGaps(StaggeredGridLayoutManager.java:282)
        at androidx.recyclerview.widget.StaggeredGridLayoutManager.onScrollStateChanged(StaggeredGridLayoutManager.java:317)
        at androidx.recyclerview.widget.RecyclerView.dispatchOnScrollStateChanged(RecyclerView.java:5197)
        at androidx.recyclerview.widget.RecyclerView.setScrollState(RecyclerView.java:1550)
        at androidx.recyclerview.widget.RecyclerView$ViewFlinger.run(RecyclerView.java:5397)
        at android.view.Choreographer$CallbackRecord.run(Choreographer.java:972)
        at android.view.Choreographer.doCallbacks(Choreographer.java:796)
        at android.view.Choreographer.doFrame(Choreographer.java:727)
        at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:957)
        at android.os.Handler.handleCallback(Handler.java:938)
        at android.os.Handler.dispatchMessage(Handler.java:99)
        at android.os.Looper.loop(Looper.java:223)
        at android.app.ActivityThread.main(ActivityThread.java:7656)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:592)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:947)>

It happen when I change to the second page and return to the first page and swipe down to refresh. Below is my layout of the first page.

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <data>
       <variable
           name="viewModel"
           type="com.example.myapplication.viewmodel.FirstViewModel"/>
    </data>
        <androidx.swiperefreshlayout.widget.SwipeRefreshLayout
            app:onRefreshListener="@{() -> viewModel.onRefresh()}"
            app:refreshing="@{viewModel.spinner}"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <androidx.constraintlayout.widget.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginStart="15dp"
                android:layout_marginEnd="15dp"
                >
                <TextView
                    android:id="@+id/tvContent"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:text="News"
                    android:textAllCaps="true"
                    android:textSize="30sp"
                    android:textStyle="bold"
                    android:gravity="center"
                    android:onClick="@{() -> viewModel.nextFragment()}"
                    android:textColor="@color/red"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    />
                <androidx.constraintlayout.widget.ConstraintLayout
                    android:id="@+id/csArticles"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    app:layout_constraintTop_toBottomOf="@+id/tvContent"
                    >
                    <androidx.recyclerview.widget.RecyclerView
                        android:id="@+id/rvNews"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:paddingBottom="50dp"
                        app:layoutManager="androidx.recyclerview.widget.StaggeredGridLayoutManager"
                        app:layout_constraintTop_toTopOf="parent"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintHorizontal_bias="1.0"
                        app:layout_constraintStart_toStartOf="parent"
                        tools:listitem="@layout/item_news" />

                    <ProgressBar
                        android:id="@+id/spinner"
                        android:layout_width="0dp"
                        android:visibility="gone"
                        android:layout_height="wrap_content"
                        app:layout_constraintBottom_toBottomOf="parent"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toTopOf="parent" />
                </androidx.constraintlayout.widget.ConstraintLayout>

                <androidx.constraintlayout.widget.ConstraintLayout
                    android:id="@+id/csNoArticles"
                    android:layout_width="match_parent"
                    android:layout_height="0dp"
                    app:layout_constraintTop_toBottomOf="@+id/tvContent"
                    app:layout_constraintBottom_toBottomOf="parent"
                    >
                   <TextView
                       android:layout_width="wrap_content"
                       android:layout_height="wrap_content"
                       android:text="No articles"
                       android:textSize="25sp"
                       android:textColor="@color/navy"
                       app:layout_constraintTop_toTopOf="parent"
                       app:layout_constraintStart_toStartOf="parent"
                       app:layout_constraintEnd_toEndOf="parent"
                       app:layout_constraintBottom_toBottomOf="parent"
                       />
                </androidx.constraintlayout.widget.ConstraintLayout>
            </androidx.constraintlayout.widget.ConstraintLayout>
        </androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
</layout>

And the last is the function which I use to init Viewpager2Adapter.

   fun ViewPager2.initFragment(
        fragment: Fragment,
        fragments: MutableList<Fragment>
    ): ViewPager2 {
        adapter = object : FragmentStateAdapter(fragment) {
            override fun createFragment(position: Int) = fragments[position]
            override fun getItemCount() = fragments.size
        }
        return this
    }

Thank for reading.