Design modern, user-friendly, and efficient applications by using Cosmos React tables, which offer a richer set of features and higher performance in comparison to classic tables. Cosmos React tables now offer an excellent run-time editing experience with numerous out-of-the-box capabilities and customization tools.

Improve data visibility

The quick table actions in the toolbar now include the option to freeze columns to keep data in sight while users scroll to another area of the table. The toolbar also supports modifying row density to present data in rows of a preferred size.

Display aggregations for grouped rows

Aggregated values are now available at the grouped row level. For example, when a user groups a table by case status and aggregates on the cost column, the aggregations (sum, min, max, avg) for this column are also displayed for the grouped row.

Customize columns

When users interact with Cosmos React tables at run time, they can conveniently customize the column label and the format of the values that the column holds.

Focus on relevant data

You can apply filters at design time to create preset views and switch between these views at run time. Users can also swiftly configure and save their own personalized views when they interact with the table at run time. For example, you can create a preset view that displays unresolved feedback items. Users can then apply further filters to their tables to bring the data that they need into focus, and then save their personalized views.

Instantly modify values inline and perform quick actions on table rows

When you enable editing in Cosmos React tables, users can quickly edit cell values by double clicking on any cell of the table and perform a variety of actions on a table row, such as update, change stage, preview, and open the row in a new tab. The row actions that you can configure at design time are the same as the optional actions defined in the workflow, which makes table modification not only consistent with cases, but also more intuitive.

For more information, see Configuring a React table in a section, Configuring a list-based landing page, and Configuring lists.