bknd-pagination_skill

Overview

This skill explains how to implement limit/offset pagination with Bknd for lists, tables, infinite scroll and APIs. It covers page calculation, response metadata (total, hasNext, hasPrev), helper functions, REST query patterns, and React integration examples. Practical snippets and patterns help avoid common pitfalls like off-by-one errors and unpaginated queries.

How this skill works

It inspects and uses Bknd's offset-based pagination parameters: limit and offset. The skill shows how to derive offset from a 1-indexed page, read meta.total from responses, and compute totalPages, hasNext, and hasPrev. It also demonstrates helper functions for consistent pagination results, REST query usage, and client-side patterns for load-more and infinite scroll.

When to use it

• Displaying long lists or table views in a UI
• Implementing page-based navigation (Prev/Next and page numbers)
• Building Load More buttons or infinite scroll feeds
• Creating server-side rendered pages or API endpoints with paginated results
• Searching or filtering results with pagination

Best practices

• Always limit queries to avoid loading all records; set a sensible default page size
• Treat pages as 1-indexed and compute offset as (page - 1) * pageSize
• Return pagination metadata (total, limit, offset) so clients can compute totalPages and navigation
• Use helper functions that return consistent shape: data, page, pageSize, total, totalPages, hasNext, hasPrev
• For React, prefer SWR or similar data fetching to cache and sync pages; use IntersectionObserver for auto-loading

Example use cases

• Server API endpoint that returns paginated posts with meta for total and pages
• React paginated list with Prev/Next and numbered pages using page state and readMany
• Infinite scroll feed using offset = currentItemCount, updating hasMore from meta.total
• Search UI that combines filters with pagination to drill through results
• Next.js server-side page that fetches paginated data and renders PaginationLinks