Problem in doing paginations between 2 composables

export const usePaginations = () => {
  const perPage = ref<number>(8)
  const totalItems = ref<number>(0)

  const currentPage = ref(0)
  const cursorNextPage = ref<string | null>(null)
  const cursorPrevPage = ref<string | null>(null)
  const cursor = ref<string | null>(null)
  const hasNextPage = ref<boolean>(false)
  const hasPreviousPage = ref<boolean>(false)
  const isForward = ref(true)
  const totalCount = ref(0)

  const updateFromPaginator = (e: any) => {
    e.page > currentPage.value ? nextPage() : prevPage()
  }

  // Go to the next page using the new cursor
  const nextPage = (): void => {
    isForward.value = true
    if (hasNextPage.value && cursorNextPage.value) {
      cursor.value = cursorNextPage.value
      currentPage.value++
    }
  }

  // Go to the previous page by removing the last cursor and updating the current one
  const prevPage = (): void => {
    isForward.value = false
    if (hasPreviousPage.value && cursorPrevPage.value) {
      nextTick(() => {
        cursor.value = cursorPrevPage.value
        currentPage.value--
      })
    }
  }

  // Reset pagination (clear cursor history)
  const resetPagination = (): void => {
    cursor.value = null
  }

  return {
    perPage,
    totalItems,
    cursor,
    cursorNextPage,
    cursorPrevPage,
    hasNextPage,
    hasPreviousPage,
    resetPagination,
    updateFromPaginator,
    isForward,
    totalCount
  }
}