IvanJosipovic / BlazorTable

Blazor Table Component with Sorting, Paging and Filtering
https://BlazorTable.netlify.app
MIT License
540 stars 109 forks source link

[Feat] Dynamic table rendering #280

Open KevinBurton opened 3 years ago

KevinBurton commented 3 years ago

I have an application that makes use of BlazorTable paging. It basically looks like:

        protected override async Task OnInitializedAsync()
        {
            _loader = new BreakpointOrganismPickerDataLoader(dataService, Props.BreakpointProject, Props.BreakpointGroup);
            data = (await _loader.LoadDataAsync(new FilterData() { OrderBy = "ProjectId asc", Skip = 0, Top = 10 })).Records;
        }
. . . .
    public class BreakpointOrganismPickerDataLoader : IDataLoader<BreakpointSummary>
    {
        private readonly IBreakpointManagementDataService _dataService;
        private readonly BreakpointProjectSummary _currentProject;
        private readonly BreakpointSummary _currentGroup;
        public BreakpointOrganismPickerDataLoader(IBreakpointManagementDataService dataService, BreakpointProjectSummary currentProject = null, BreakpointSummary currentGroup = null)
        {
            _dataService = dataService;
            _currentProject = currentProject;
            _currentGroup = currentGroup;
        }
        public async Task<PaginationResult<BreakpointSummary>> LoadDataAsync(FilterData parameters)
        {

            int projectId = _currentProject == null ? 0 : _currentProject.ProjectId;
            int groupId = _currentGroup == null ? 0 : _currentGroup.GroupId;
            IList<BreakpointSummary> results;
            if (parameters.Top == null)
            {
                results = await _dataService.GetBreakpointByProjectGroup(projectId, groupId);
            }
            else if (string.IsNullOrWhiteSpace(parameters.OrderBy))
            {
                results = await _dataService.GetBreakpointByProjectGroup(projectId, groupId, parameters.Top.Value, parameters.Skip.Value);
            }
            else
            {
                results = await _dataService.GetBreakpointByProjectGroup(projectId, groupId, parameters.Top.Value, parameters.Skip.Value, parameters.OrderBy);
            }
            var count = await _dataService.GetBreakpointByProjectGroupCount(projectId, groupId);
            return new PaginationResult<BreakpointSummary>
            {
                Records = results,
                Skip = parameters?.Skip ?? 0,
                Total = int.Parse(count),
                Top = parameters?.Top ?? 0
            };
        }
    }

As you can see the parameters specifying what data to page is passed in the constructor. The problem is that as indicated by the name Props.BreakpointProject, Props.BreakpointGroup change with state changes in the app. So the state will change and the table is still query data for the table based on the old values. I would like the _loader and the associated data to be more dynamic. Right now they are initialized in the OnInitializedAsync method. I would like to re-initialize and possibly re-render the table if the parameters to the constructor of the loader change?