Pixata.Blazor.TelerikComponents 12.3.3

Pixata.Blazor.TelerikComponents

This package complements the Pixata.Blazor package, and adds components that rely on the Telerik components for Blazor. These were split off into their own package to enable those without a licence for Telerik to use the other components.

A Nuget package is available for this project.

Note that as of version 12.2.0, the major and minor package versions will correspond to the version of the Telerik.Blazor package that is required. The patch version will be used for updates to this package. The build number will indicate my own internal versioning. Thus, version 12.2.0 is based on the Telerik Blazor package version 12.2.x, where x is my own nicremental build number.

The components

Form components

These were writen to make it quicker to create forms in Blazor. They are all very much based around Bootstrap, which I was using heavily when I wrote these components. If you look at the form page on the sample web site you can see the usage.)

Extension method to improve the performance of the Telerik Blazor grid

Whilst the Telerik Blazor grid does an amazing job, it has its limitations. One of these is the way it computes aggregates. For large tables, this can be slow.

I had a play with Dapper, which improved matters significantly, and then found out that I could do the same with pure EF Core, without any extra packages. I wrapped up the code into an extension method for GridReadEventArgs, which you can call from the OnRead event of the grid. In the project that motivated this code, I managed to reduce the time taken for the grid to load from over 10 seconds to around 400 milliseconds 😎.

There is a sample repo that shows the method in usage, and a blog post that explain the usage (with far too many anecdotes and rambling). If you are bored, that post links to two previous posts that detail my journey to this extension method.

Note that as from version 2.0.0 of the package, the method allows you to query a table-valued function as well as a table or view.

Breaking change

As of version 2.0.0, the generic parameter has been removed from TelerikGridFilterResults (as it wasn't needed), so you will need to update your code if you capture this as an explicit type. For example, change this:

TelerikGridFilterResults<MyType> data = await args.GetData<MyType>(/* args go here */)

...to this...

TelerikGridFilterResults data = await args.GetData<MyType>(/* args go here */)

Not a major issue, but worth noting.

LocalisationHelper

The Telerik Blazor components supply a default text for many situations. For example, if a grid does not contain any data, then it will show the rather geeky message "No records to display". Overriding these messages with your own text is not hard, but is now even easier with the LocalisationHelper class in this package.

Basic usage is as simple as adding the following line to any <code>Program.cs</code> file in your app..

builder.Services.AddSingleton(typeof(ITelerikStringLocalizer), typeof(LocalisationHelper));

However, that will only override two of the messages (the ones that annoy me the most)...

• "No records to display" in grids now shows "Sorry, nothing matched your filters. Please widen your search criteria"
• When binding a dropdown (or any component that allows filtering) to an <code>enum</code>, the first entry in the dropdown is changed from "Select a value" to "All" which I think is more sensible. It's also shorter, which is an advantage when your values are short.

However, adding your own messages, or modifying my choice of the above is easy...

LocalisationHelper.Values["DatePicker_Open"] = "Open Sesame";
builder.Services.AddSingleton(typeof(ITelerikStringLocalizer), typeof(LocalisationHelper));

As the class is static, you only need to do this once.

You can see a list of all messages on (Telerik's web site).

Warning

The package relies on the Telerik.Blazor Nuget package. If you don't have a subscription with Telerik, you can get a 30-day trial version from them.

Sample project

I have added a Blazor web project to the repository, and intend to use that to try out and demonstrate the components. At the moment, it's a just-out-of-the-box template project, but should hopefully be expanded to include sample usage of the components.

Note that the sample web site is not fully working, and as of 17th Sept '24 isn't being updated when the code changes. I would like to sort this out at some point, but don't have the time right now, so don't hold your breath!