How to add button column picker visibility to ridzen grid?

How to add dialog service 

please can you give me full solution sample code if possible please 

thanks advanced for help

Add a button to your Blazor component:

Column Picker

Define a list of available columns in your component:

private readonly List> _allColumns = new List>
{
    new RadzenGridColumn { Property="applicationId", Title="Application ID", Visible=false },
    new RadzenGridColumn { Property="applicationName", Title="Application Name", Visible=true },
    new RadzenGridColumn { Property="commonName", Title="Common Name", Visible=true },
    new RadzenGridColumn { Property="typeOfApplication", Title="Type Of Application", Visible=true }
};

Define a list of visible columns that will be displayed in the grid initially:

private List> _visibleColumns = new List>
{
    new RadzenGridColumn { Property="applicationName", Title="Application Name", Visible=true },
    new RadzenGridColumn { Property="commonName", Title="Common Name", Visible=true },
    new RadzenGridColumn { Property="typeOfApplication", Title="Type Of Application", Visible=true }
};

Handle the click event of the button to show a popup or modal dialog with checkboxes to allow the user to select which columns to show or hide:

private void ShowColumnPicker()
{
    var visibleColumns = _visibleColumns.Select(c => c.Property);
    var dialog = DialogService.Open("Select Columns", new Dictionary { { "AllColumns", _allColumns }, { "VisibleColumns", visibleColumns } });
    dialog.OnClose = async result =>
    {
        if (!result.Cancelled)
        {
            var selectedColumns = (List)result.Data;
            _visibleColumns = _allColumns.Where(c => selectedColumns.Contains(c.Property)).ToList();
            StateHasChanged();
        }
    };
}

In this code, we're passing the list of all columns and the list of visible columns to a custom dialog component called ColumnPickerDialog. The OnClose event of the dialog is used to update the list of visible columns based on the user's selection.

Update the RadzenGrid component to use the _visibleColumns list:

    
        @foreach (var column in _visibleColumns)
        {
            @column
        }
    

1. In this code, we're iterating over the _visibleColumns list and rendering each column using the @column syntax.

2. Create a custom dialog component called ColumnPickerDialog that allows the user to select which columns to show or hide