Feedback

Author: dariatiurina

src/Components/QuickGrid/Microsoft.AspNetCore.Components.QuickGrid/src/QuickGrid.razor.cs

@@ -314,38 +314,40 @@ public async Task RefreshDataAsync()
     private async Task RefreshDataCoreAsync()
     {
         // First render of Virtualize component will handle the data load itself.
-        if (!(_firstRefreshDataAsync && Virtualize))
+        if (_firstRefreshDataAsync && Virtualize)
         {
-            // Move into a "loading" state, cancelling any earlier-but-still-pending load
-            _pendingDataLoadCancellationTokenSource?.Cancel();
-            var thisLoadCts = _pendingDataLoadCancellationTokenSource = new CancellationTokenSource();
+            _firstRefreshDataAsync = false;
+            return;
+        }
+
+        // Move into a "loading" state, cancelling any earlier-but-still-pending load
+        _pendingDataLoadCancellationTokenSource?.Cancel();
+        var thisLoadCts = _pendingDataLoadCancellationTokenSource = new CancellationTokenSource();
 
-            if (_virtualizeComponent is not null)
+        if (_virtualizeComponent is not null)
+        {
+            // If we're using Virtualize, we have to go through its RefreshDataAsync API otherwise:
+            // (1) It won't know to update its own internal state if the provider output has changed
+            // (2) We won't know what slice of data to query for
+            await _virtualizeComponent.RefreshDataAsync();
+            _pendingDataLoadCancellationTokenSource = null;
+        }
+        else
+        {
+            // If we're not using Virtualize, we build and execute a request against the items provider directly
+            _lastRefreshedPaginationStateHash = Pagination?.GetHashCode();
+            var startIndex = Pagination is null ? 0 : (Pagination.CurrentPageIndex * Pagination.ItemsPerPage);
+            var request = new GridItemsProviderRequest<TGridItem>(
+                startIndex, Pagination?.ItemsPerPage, _sortByColumn, _sortByAscending, thisLoadCts.Token);
+            var result = await ResolveItemsRequestAsync(request);
+            if (!thisLoadCts.IsCancellationRequested)
             {
-                // If we're using Virtualize, we have to go through its RefreshDataAsync API otherwise:
-                // (1) It won't know to update its own internal state if the provider output has changed
-                // (2) We won't know what slice of data to query for
-                await _virtualizeComponent.RefreshDataAsync();
+                _currentNonVirtualizedViewItems = result.Items;
+                _ariaBodyRowCount = _currentNonVirtualizedViewItems.Count;
+                Pagination?.SetTotalItemCountAsync(result.TotalItemCount);
                 _pendingDataLoadCancellationTokenSource = null;
             }
-            else
-            {
-                // If we're not using Virtualize, we build and execute a request against the items provider directly
-                _lastRefreshedPaginationStateHash = Pagination?.GetHashCode();
-                var startIndex = Pagination is null ? 0 : (Pagination.CurrentPageIndex * Pagination.ItemsPerPage);
-                var request = new GridItemsProviderRequest<TGridItem>(
-                    startIndex, Pagination?.ItemsPerPage, _sortByColumn, _sortByAscending, thisLoadCts.Token);
-                var result = await ResolveItemsRequestAsync(request);
-                if (!thisLoadCts.IsCancellationRequested)
-                {
-                    _currentNonVirtualizedViewItems = result.Items;
-                    _ariaBodyRowCount = _currentNonVirtualizedViewItems.Count;
-                    Pagination?.SetTotalItemCountAsync(result.TotalItemCount);
-                    _pendingDataLoadCancellationTokenSource = null;
-                }
-            }
         }
-        _firstRefreshDataAsync = false;
     }
 
     // Gets called both by RefreshDataCoreAsync and directly by the Virtualize child component during scrolling

src/Components/test/E2ETest/Tests/QuickGridTest.cs

@@ -166,7 +166,7 @@ public void RowStyleApplied()
         const p = document.querySelector('tbody > tr:first-child > td:nth-child(5)');
         return p ? getComputedStyle(p).textAlign : null;"));
     }
-    
+
     [Fact]
     public void CanOpenColumnOptions()
     {
@@ -208,4 +208,11 @@ public void CanCloseColumnOptionsByHideColumnOptionsAsync()
         var firstNameSearchSelector = "#grid > table > thead > tr > th:nth-child(2) input[type=search]";
         Browser.DoesNotExist(By.CssSelector(firstNameSearchSelector));
     }
+
+    [Fact]
+    public void ItemsProviderCalledOnceWithVirtualize()
+    {
+        app = Browser.MountTestComponent<QuickGridVirtualizeComponent>();
+        Browser.Equal("1", () => app.FindElement(By.Id("items-provider-call-count")).Text);
+    }
 }

src/Components/test/testassets/BasicTestApp/Index.razor

@@ -94,6 +94,7 @@
         <option value="@GetTestServerProjectComponent("Components.TestServer.ProtectedBrowserStorageUsageComponent")">Protected browser storage usage</option>
         <option value="@GetTestServerProjectComponent("Components.TestServer.ProtectedBrowserStorageInjectionComponent")">Protected browser storage injection</option>
         <option value="BasicTestApp.QuickGridTest.SampleQuickGridComponent">QuickGrid Example</option>
+        <option value="BasicTestApp.QuickGridTest.QuickGridVirtualizeComponent">QuickGrid with Virtualize Example</option>
         <option value="BasicTestApp.RazorTemplates">Razor Templates</option>
         <option value="BasicTestApp.Reconnection.ReconnectionComponent">Reconnection server-side blazor</option>
         <option value="BasicTestApp.RedTextComponent">Red text</option>

src/Components/test/testassets/BasicTestApp/QuickGridTest/QuickGridVirtualizeComponent.razor

@@ -0,0 +1,36 @@
+@using Microsoft.AspNetCore.Components.QuickGrid
+@using System.Linq
+
+<p id="items-provider-call-count">@ItemsProviderCallCount</p>
+
+<div id="grid" style="height: 200px; overflow: auto">
+    <QuickGrid ItemsProvider="@itemsProvider" Virtualize="true" ItemSize="50">
+        <PropertyColumn Property="@(p => p.Id)" />
+        <PropertyColumn Property="@(p => p.Name)" />
+    </QuickGrid>
+</div>
+
+@code {
+    internal class Person
+    {
+        public int Id { get; set; }
+        public string Name { get; set; } = string.Empty;
+    }
+
+    private GridItemsProvider<Person> itemsProvider = default!;
+
+    int ItemsProviderCallCount = 0;
+
+    protected override void OnInitialized()
+    {
+        itemsProvider = async request =>
+        {
+            await Task.CompletedTask;
+            Interlocked.Increment(ref ItemsProviderCallCount);
+            StateHasChanged();
+            return GridItemsProviderResult.From(
+                items: Enumerable.Range(1, 100).Select(i => new Person { Id = i, Name = $"Person {i}" }).ToList(),
+                totalItemCount: 100);
+        };
+    }
+}