Confused about usePagination's count

[quangnmwork]

I am currently implementing async action for Pagination

Here is my current code.

export const Pagination: FC<PaginationProps> = ({
  className,
  queryKey,
  ...props
}) => {
  return (
    <ArkPagination.Root {...props} className={root({ className })}>
      <ArkPagination.Context>
        {(pagination) =>
          pagination.pages.map((page, index) =>
            page.type === 'page' ? (
              <PaginationItem key={index} queryKey={queryKey} {...page}>
                {page.value}
              </PaginationItem>
            ) : (
              <ArkPagination.Ellipsis key={index} index={index}>
                &#8230;
              </ArkPagination.Ellipsis>
            ),
          )
        }
      </ArkPagination.Context>
    </ArkPagination.Root>
  )
}

Story :

export const WithUseEffectForCount: Story = {
  render: () => {
    const pagination = usePagination({
      count: 100,
    })

    return (
      <>
        <button onClick={() => pagination.setCount(1000)}>Set count to 1000</button>
        <Pagination
          queryKey='page'
          onPageChange={({ page }) => {
            pagination.setPage(page)
          }}
          {...pagination}
        />
      </>
    )
  },
}

The problem is even when I want to update the count it seems like it can't be updated. Am I doing something wrong?

Screen.Recording.2025-04-11.at.14.23.02.mov

[segunadebayo]

This must be an older version of Ark UI. The count prop is readonly and .setPage(...) was removed in v5.

To programmatically control the count, create a local state and pass that to the usePagination hook.