QuickGrid: Adds EmptyContentTemplate #59078 #50498

Author: ashortland-eqix

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

@@ -0,0 +1,6 @@
+@namespace Microsoft.AspNetCore.Components.QuickGrid
+@typeparam TGridItem
+
+@{
+    InternalGridContext.Grid.SetEmptyContent(this);
+}

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

@@ -0,0 +1,10 @@
+using Microsoft.AspNetCore.Components.QuickGrid.Infrastructure;
+
+namespace Microsoft.AspNetCore.Components.QuickGrid;
+
+public partial class EmptyContentTemplate<TGridItem>
+{
+    [CascadingParameter] internal InternalGridContext<TGridItem> InternalGridContext { get; set; } = default!;
+
+    [Parameter] public RenderFragment ChildContent { get; set; }
+}

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

@@ -20,12 +20,13 @@
                 @if (Virtualize)
                 {
                     <Virtualize @ref="@_virtualizeComponent"
-                        TItem="(int RowIndex, TGridItem Data)"
-                        ItemSize="@ItemSize"
-                        OverscanCount="@OverscanCount"
-                        ItemsProvider="@ProvideVirtualizedItems"
-                        ItemContent="@(item => builder => RenderRow(builder, item.RowIndex, item.Data))"
-                        Placeholder="@(placeholderContext => builder => RenderPlaceholderRow(builder, placeholderContext))" />
+                                TItem="(int RowIndex, TGridItem Data)"
+                                ItemSize="@ItemSize"
+                                OverscanCount="@OverscanCount"
+                                ItemsProvider="@ProvideVirtualizedItems"
+                                ItemContent="@(item => builder => RenderRow(builder, item.RowIndex, item.Data))"
+                                EmptyContent="@EmptyContent"
+                                Placeholder="@(placeholderContext => builder => RenderPlaceholderRow(builder, placeholderContext))" />
                 }
                 else
                 {
@@ -41,9 +42,17 @@
     {
         var initialRowIndex = 2; // aria-rowindex is 1-based, plus the first row is the header
         var rowIndex = initialRowIndex;
-        foreach (var item in _currentNonVirtualizedViewItems)
+
+        if (EmptyContent != null && _currentNonVirtualizedViewItems.Count == 0)
         {
-            RenderRow(__builder, rowIndex++, item);
+            RenderEmptyRow(__builder, rowIndex++);
+        }
+        else
+        {
+            foreach (var item in _currentNonVirtualizedViewItems)
+            {
+                RenderRow(__builder, rowIndex++, item);
+            }
         }
 
         // When pagination is enabled, by default ensure we render the exact number of expected rows per page,
@@ -63,39 +72,48 @@
         }
     }
 
+    private void RenderEmptyRow(RenderTreeBuilder __builder, int rowIndex)
+    {
+        <tr aria-rowindex="@rowIndex">
+            <td colspan="@_columns.Count">
+                @EmptyContent
+            </td>
+        </tr>
+    }
+
     private void RenderRow(RenderTreeBuilder __builder, int rowIndex, TGridItem item)
     {
         var rowClass = RowClass?.Invoke(item);
         <tr @key="@(ItemKey(item))" aria-rowindex="@rowIndex" class="@rowClass">
             @foreach (var col in _columns)
             {
                 <td class="@ColumnClass(col)" @key="@col">@{ col.CellContent(__builder, item); }</td>
-            }
-        </tr>
-    }
+        }
+    </tr>
+}
 
-    private void RenderPlaceholderRow(RenderTreeBuilder __builder, PlaceholderContext placeholderContext)
-    {
-        <tr aria-rowindex="@(placeholderContext.Index + 1)">
-            @foreach (var col in _columns)
-            {
-                <td class="grid-cell-placeholder @ColumnClass(col)" @key="@col">@{ col.RenderPlaceholderContent(__builder, placeholderContext); }</td>
-            }
-        </tr>
+private void RenderPlaceholderRow(RenderTreeBuilder __builder, PlaceholderContext placeholderContext)
+{
+    <tr aria-rowindex="@(placeholderContext.Index + 1)">
+        @foreach (var col in _columns)
+        {
+            <td class="grid-cell-placeholder @ColumnClass(col)" @key="@col">@{ col.RenderPlaceholderContent(__builder, placeholderContext); }</td>
+    }
+</tr>
     }
 
     private void RenderColumnHeaders(RenderTreeBuilder __builder)
+{
+    foreach (var col in _columns)
     {
-        foreach (var col in _columns)
-        {
-            <th class="@ColumnHeaderClass(col)" aria-sort="@AriaSortValue(col)" @key="@col" scope="col">
-                <div class="col-header-content">@col.HeaderContent</div>
+        <th class="@ColumnHeaderClass(col)" aria-sort="@AriaSortValue(col)" @key="@col" scope="col">
+            <div class="col-header-content">@col.HeaderContent</div>
 
-                @if (col == _displayOptionsForColumn)
-                {
-                    <div class="col-options">@col.ColumnOptions</div>
-                }
-            </th>
-        }
+            @if (col == _displayOptionsForColumn)
+            {
+                <div class="col-options">@col.ColumnOptions</div>
+            }
+        </th>
     }
 }
+}

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

@@ -124,6 +124,13 @@ public partial class QuickGrid<TGridItem> : IAsyncDisposable
     // We cascade the InternalGridContext to descendants, which in turn call it to add themselves to _columns
     // This happens on every render so that the column list can be updated dynamically
     private readonly InternalGridContext<TGridItem> _internalGridContext;
+
+    /// <summary>
+    /// Gets or sets a <see cref="RenderFragment" /> that will be rendered when no data is available to display.
+    /// This allows derived components to specify a default if the user does not specify it.
+    /// </summary>
+    protected internal RenderFragment? EmptyContent { get; protected set; }
+
     private readonly List<ColumnBase<TGridItem>> _columns;
     private bool _collectingColumns; // Columns might re-render themselves arbitrarily. We only want to capture them at a defined time.
 
@@ -216,6 +223,11 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
         }
     }
 
+    internal void SetEmptyContent(EmptyContentTemplate<TGridItem> emptyContentTemplate)
+    {
+        EmptyContent = emptyContentTemplate.ChildContent;
+    }
+
     // Invoked by descendant columns at a special time during rendering
     internal void AddColumn(ColumnBase<TGridItem> column, SortDirection? initialSortDirection, bool isDefaultSortColumn)
     {