microsoft / fluentui-blazor

Microsoft Fluent UI Blazor components library. For use with ASP.NET Core Blazor applications
https://www.fluentui-blazor.net
MIT License
3.83k stars 371 forks source link

fix: FluentDataGrid stays in loading state after adding items to the collection #2088

Closed TheLever closed 5 months ago

TheLever commented 5 months ago

πŸ› Bug Report

πŸ’» Repro or Code Sample

  1. Create a new Fluent UI Blazor app (not WASM)
  2. Copy the examples from the "Remote Data" section
  3. Add a Button to add to the collection of items, yielding this code:
    
    @page "/"

@rendermode @(new InteractiveServerRenderMode(prerender: false))

Home
New Item

@code {

FluentDataGrid<GridItem> DataGrid;
GridItemsProvider<GridItem> itemProvider = default!;

List<GridItem> items = new List<GridItem>
{
    new GridItem { Name =  "Test Item", Value = 1 }

};

 protected override Task OnInitializedAsync()
{
    itemsProvider = req => ValueTask.FromResult(GridItemsProviderResult.From(
        items: items,
        totalItemCount: items.Count));

    return Task.CompletedTask;
}

private async Task OnNewItem(MouseEventArgs args)
{
    DataGrid.SetLoadingState(true);

    items.Add(
        new GridItem{ Name = "Test Value Added", Value = 7});

    await DataGrid.RefreshDataAsync();

    DataGrid.SetLoadingState(false);
}

public class GridItem
{
    public string? Name { get; set; }

    public int Value { get; set; }
}

}



## πŸ€” Expected Behavior

After addition, the "Loading" spinner should stop spinning and display the new collection of items.

## 😯 Current Behavior

After addition, the "Loading" spinner keeps spinning and does not show any data. If I navigate away from the component and back again, it loads the new collection (not in this minimal repro, but I see that behavior in my "production" code).

## πŸ’ Possible Solution

<!--- Not obligatory, but suggest a fix/reason for the bug -->
<!--- Please let us know if you'd be willing to contribute the fix; we'd be happy to work with you -->

## πŸ”¦ Context

<!--- How has this issue affected you? What are you trying to accomplish? -->
<!--- Providing context helps us come up with a solution that is most useful in the real world -->

## 🌍 Your Environment

* OS & Device: MacOS Sonoma 14.5, M3
* Browser: Chrome 124.0.6367.209
* .NET and Fluent UI Blazor library Version: 8.0.2/4.7.2
vnbaaij commented 5 months ago

Remove the initial Loading="true" from the grid declaration and then it works.