📣 More Control Over Your Datagrid Data & Styling

Announcements New Releases
1

Hey everyone :waving_hand:

This release brings you better access to your Datagrid data and more flexibility in how you style each header.

:card_index_dividers: Access all the data behind the Datagrid

Before, the Datagrid only exposed the data visible on the screen, which made it difficult to build advanced logic, especially around filters, sorting, or pagination.

Now, you can access the full dataset behind the Datagrid, before and after user interactions:

Datagrid_data
Datagrid_data1920×1080 184 KB

You have access to:

• allData: the full list of records powering the Datagrid
• total: the total number of records in allData
• sortedFilteredData: the dataset after filters and sorts are applied
• totalSortedFilteredData: the number of records after filters and sorts
• perPageTotal: the maximum number of records shown per page
• totalPages: the total number of pages when pagination is enabled
• displayedData: the portion of sortedFilteredData visible on the current page
• totalDisplayedRecords: the count of displayed records after all filters, sorts, and pagination

This makes it easier to:

• Display counts or summaries that reflect the user’s current view
• Build logic or workflows based on the full dataset or just the filtered view
• Create custom pagination or sorting experiences

Check out our docs to learn more

:artist_palette: Style each Datagrid header independently

Before, every Datagrid header had to share the same styling because the header didn’t have access to information about its column.

With this update, you can style headers independently for each column:

• Style each header individually

• Highlight important columns

• Apply conditional styling (e.g., style all date columns differently)

• Create more readable and structured Datagrids

Datagrid_header_styling

Check out our docs to learn more

‍That’s all for this release! As always, let us know what you think :slightly_smiling_face:

5 Likes
2

Amazing!

The Datagrid is a community favorite, and it’s getting better and better with each update :flexed_biceps:

2 Likes
3

Thanks for this.

Could we look at pagination as well? As Datagrid is ideally meant for large amounts of data, there has to be a way to support Supabase pagination via edge or sql functions. note: by using the built-in paginator ui

1 Like
4

Hi @emdiemeric :waving_hand:

I 100% agree, having that built directly into the Datagrid would be very helpful. At the moment, we don’t have plans to add this natively because it’s part of AG Grid’s Enterprise feature set so you’d need to setup pagination manually.