Skip to content

Conversation

@olivierauverlot
Copy link
Contributor

Pagination is a component that enables users to navigate through a large dataset.
The data is divided into pages, each containing a fixed number of rows.

This component is typically used in conjunction with a table component.

The pagination component offers numerous customization features:

  • It supports buttons to navigate to the first or last page, as well as the previous or next page.
  • Navigation buttons can display text or icons.
  • If the number of pages is too large, an offset can be used to enhance the component''s readability.

An article for the blog is included in this pull request to provide an example of managing the pagination component.

Copy link
Collaborator

@lovasoa lovasoa left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks ! Can we fix the icons in the template, and add clear warnings in the component documentation and blog post that this approach does not scale, and using OFFSET on large datasets is slow.

This approach is interesting only for datasets that are big enough not to be realistically loadable on a single webpage, yet small enough for being queryable with OFFSET...LIMIT

Comment on lines +10 to +15
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" class="icon icon-1">
<path d="M11 7l-5 5l5 5" />
<path d="M17 7l-5 5l5 5" />
</svg>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can we use the existing handlebars helper for integrating icons by their name ?

Copy link
Contributor Author

@olivierauverlot olivierauverlot Nov 15, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi,

I agree with you on the performance aspect. I wanted to propose a simple and portable method to illustrate the use of the pagination component. I suggest adding this at the beginning of the post:

"This article serves as a tutorial on the pagination component, rather than an advanced guide on paginated data retrieval from a database. The document employs a straightforward approach using the LIMIT and OFFSET instructions. This approach is interesting only for datasets that are big enough not to be realistically loadable on a single webpage, yet small enough for being queryable with OFFSET...LIMIT."

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I will attempt to use Handlebars helpers for the icons, but I encountered some difficulties while creating the component. I'll investigate further.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants