done = sync, async and advanced async content rendering ways, pages for it, components and other

Data/WeatherForecast.cs

@@ -1,15 +0,0 @@
-using System;
-
-namespace blazor_lifetime.Data
-{
-    public class WeatherForecast
-    {
-        public DateTime Date { get; set; }
-
-        public int TemperatureC { get; set; }
-
-        public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
-
-        public string Summary { get; set; }
-    }
-}

Data/WeatherForecastService.cs

@@ -1,25 +0,0 @@
-using System;
-using System.Linq;
-using System.Threading.Tasks;
-
-namespace blazor_lifetime.Data
-{
-    public class WeatherForecastService
-    {
-        private static readonly string[] Summaries = new[]
-        {
-            "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
-        };
-
-        public Task<WeatherForecast[]> GetForecastAsync(DateTime startDate)
-        {
-            var rng = new Random();
-            return Task.FromResult(Enumerable.Range(1, 5).Select(index => new WeatherForecast
-            {
-                Date = startDate.AddDays(index),
-                TemperatureC = rng.Next(-20, 55),
-                Summary = Summaries[rng.Next(Summaries.Length)]
-            }).ToArray());
-        }
-    }
-}

Models/IAsyncComponentBase.cs

@@ -0,0 +1,10 @@
+using System.Threading.Tasks;
+
+namespace blazor_lifetime.Models
+{
+    public delegate Task RenderHandleAsync();
+    public interface IAsyncComponentBase
+    {
+        RenderHandleAsync RenderChildContentAsync { get; set; }
+    }
+}

Pages/AsyncContentRendering.razor

@@ -0,0 +1,5 @@
+@page "/async"
+
+<h1>Async Content Rendering</h1>
+
+<FirstLevelComponentAsync />

Pages/Counter.razor

@@ -1,19 +0,0 @@
-@page "/counter"
-
-<h1>Counter</h1>
-
-<p>Current count: @currentCount</p>
-
-<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
-<br />
-
-<FirstLevelComponentAsync />
-
-@code {
-    private int currentCount = 0;
-
-    private void IncrementCount()
-    {
-        currentCount++;
-    }
-}

Pages/FetchData.razor

@@ -1,46 +0,0 @@
-@page "/fetchdata"
-
-@using blazor_lifetime.Data
-@inject WeatherForecastService ForecastService
-
-<h1>Weather forecast</h1>
-
-<p>This component demonstrates fetching data from a service.</p>
-
-@if (forecasts == null)
-{
-    <p><em>Loading...</em></p>
-}
-else
-{
-    <table class="table">
-        <thead>
-            <tr>
-                <th>Date</th>
-                <th>Temp. (C)</th>
-                <th>Temp. (F)</th>
-                <th>Summary</th>
-            </tr>
-        </thead>
-        <tbody>
-            @foreach (var forecast in forecasts)
-            {
-                <tr>
-                    <td>@forecast.Date.ToShortDateString()</td>
-                    <td>@forecast.TemperatureC</td>
-                    <td>@forecast.TemperatureF</td>
-                    <td>@forecast.Summary</td>
-                </tr>
-            }
-        </tbody>
-    </table>
-}
-
-@code {
-    private WeatherForecast[] forecasts;
-
-    protected override async Task OnInitializedAsync()
-    {
-        forecasts = await ForecastService.GetForecastAsync(DateTime.Now);
-    }
-}

Pages/ImprovedAsyncContentRendering.razor

@@ -0,0 +1,5 @@
+@page "/async_improved"
+
+<h1>Improved Async Content Rendering</h1>
+
+<FirstLevelAdvancedComponentAsync />

Pages/Index.razor

@@ -1,5 +1,5 @@
 @page "/"
 
-<h1>Hello, world!</h1>
+<h1>HELLO!</h1>
 
-Welcome to your new app.
+Welcome to async content test app.

Pages/SyncContentRendering.razor

@@ -0,0 +1,5 @@
+@page "/sync"
+
+<h1>Sync Content Rendering</h1>
+
+<FirstLevelComponent />

Shared/AdvancedComponentBase.cs

@@ -0,0 +1,31 @@
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Components;
+using blazor_lifetime.Models;
+
+namespace blazor_lifetime.Shared
+{
+    public class AdvancedComponentBase : OwningComponentBase, IAsyncComponentBase
+    {
+        [Parameter] public virtual RenderFragment ChildContent { get; set; }
+        public RenderHandleAsync RenderChildContentAsync { get; set; }
+
+        protected override async Task OnAfterRenderAsync(bool firstRender)
+        {
+            if (firstRender)
+            {
+                await OnComponentMountAsync().ConfigureAwait(false);
+                if (RenderChildContentAsync != null)
+                {
+                    await RenderChildContentAsync();
+                }
+            }
+            else
+            {
+                await Task.CompletedTask;
+            }
+        }
+
+        protected virtual Task OnComponentMountAsync()
+            => Task.CompletedTask;
+    }
+}

Shared/AsyncContentSupport.razor

@@ -0,0 +1,36 @@
+@using blazor_lifetime.Models
+
+@if (_isContentVisible)
+{
+    @ChildContent
+}
+else
+{
+    @if (LoadingContent != null)
+    {
+        @LoadingContent
+    }
+}
+
+@code{
+    private bool _isContentVisible = false;
+
+    [Parameter] public RenderFragment ChildContent { get; set; }
+    [Parameter] public RenderFragment LoadingContent { get; set; }
+    [Parameter] public IAsyncComponentBase Component { get; set; }
+
+    protected override void OnInitialized()
+    {
+        if (Component == null)
+        {
+            throw new Exception(nameof(Component));
+        }
+        Component.RenderChildContentAsync += OnRenderChildContentAsync;
+    }
+
+    protected async Task OnRenderChildContentAsync()
+    {
+        _isContentVisible = true;
+        await InvokeAsync(StateHasChanged);
+    }
+}

Shared/FirstLevelAdvancedComponentAsync.razor

@@ -0,0 +1,12 @@
+@inherits FirstLevelAdvancedComponentAsyncModel
+
+<AsyncContentSupport RenderHandler="@this">
+    <LoadingContent>
+        Please wait... Content is loading...
+    </LoadingContent>
+    <ChildContent>
+        <div>First Component Start</div>
+        <SecondLevelComponentAsync Parameter=@AsyncParameter />
+        <div>First Component End</div>
+    </ChildContent>
+</AsyncContentSupport>

Shared/FirstLevelAdvancedComponentAsync.razor.cs

@@ -0,0 +1,19 @@
+using blazor_lifetime.Models;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Threading.Tasks;
+
+namespace blazor_lifetime.Shared
+{
+    public class FirstLevelAdvancedComponentAsyncModel : AdvancedComponentBase
+    {
+        protected string AsyncParameter { get; set; }
+        protected override async Task OnComponentMountAsync()
+        {
+            Console.WriteLine($"{GetType().Name}.OnComponentMountAsync.Start");
+            await Task.Delay(500);
+            AsyncParameter = "value 123";
+            Console.WriteLine($"{GetType().Name}.OnComponentMountAsync.End");
+        }
+    }
+}

Pages/FirstLevelComponent.razor.cs → Shared/FirstLevelComponent.razor.cs

@@ -2,7 +2,7 @@
 using System;
 using System.Threading;
 
-namespace blazor_lifetime.Pages
+namespace blazor_lifetime.Shared
 {
     public class FirstLevelComponentModel : ComponentBase
     {
@@ -30,7 +30,8 @@ namespace blazor_lifetime.Pages
                 Console.WriteLine($"{GetType().Name}.OnAfterRender(FirstRender).Start");
                 Thread.Sleep(500);
                 Console.WriteLine($"{GetType().Name}.OnAfterRender(FirstRender).End");
-            } else
+            }
+            else
             {
                 Console.WriteLine($"{GetType().Name}.OnAfterRender.Start");
                 Thread.Sleep(500);

Pages/FirstLevelComponentAsync.razor.cs → Shared/FirstLevelComponentAsync.razor.cs

@@ -2,7 +2,7 @@
 using System;
 using System.Threading.Tasks;
 
-namespace blazor_lifetime.Pages
+namespace blazor_lifetime.Shared
 {
     public class FirstLevelComponentAsyncModel : ComponentBase
     {
@@ -10,7 +10,7 @@ namespace blazor_lifetime.Pages
         protected override async Task OnInitializedAsync()
         {
             Console.WriteLine($"{GetType().Name}.OnInitialized.Start");
-            await Task.Delay(500); 
+            await Task.Delay(500);
             AsyncParameter = "value 123";
             Console.WriteLine($"{GetType().Name}.OnInitialized.End");
         }
@@ -29,7 +29,8 @@ namespace blazor_lifetime.Pages
                 Console.WriteLine($"{GetType().Name}.OnAfterRender(FirstRender).Start");
                 await Task.Delay(500);
                 Console.WriteLine($"{GetType().Name}.OnAfterRender(FirstRender).End");
-            } else
+            }
+            else
             {
                 Console.WriteLine($"{GetType().Name}.OnAfterRender.Start");
                 await Task.Delay(500);

Shared/NavMenu.razor

@@ -13,13 +13,18 @@
             </NavLink>
         </li>
         <li class="nav-item px-3">
-            <NavLink class="nav-link" href="counter">
-                <span class="oi oi-plus" aria-hidden="true"></span> Counter
+            <NavLink class="nav-link" href="sync" Match="NavLinkMatch.All">
+                <span class="oi oi-plus" aria-hidden="true"></span> Sync
             </NavLink>
         </li>
         <li class="nav-item px-3">
-            <NavLink class="nav-link" href="fetchdata">
-                <span class="oi oi-list-rich" aria-hidden="true"></span> Fetch data
+            <NavLink class="nav-link" href="async" Match="NavLinkMatch.All">
+                <span class="oi oi-plus" aria-hidden="true"></span> Async
+            </NavLink>
+        </li>
+        <li class="nav-item px-3">
+            <NavLink class="nav-link" href="async_improved" Match="NavLinkMatch.All">
+                <span class="oi oi-plus" aria-hidden="true"></span> Improved Async
             </NavLink>
         </li>
     </ul>

Pages/SecondLevelComponent.razor.cs → Shared/SecondLevelComponent.razor.cs

@@ -2,12 +2,13 @@
 using System;
 using System.Threading;
 
-namespace blazor_lifetime.Pages
+namespace blazor_lifetime.Shared
 {
     public class SecondLevelComponentModel : ComponentBase
     {
         private string _parameter;
-        [Parameter] public string Parameter
+        [Parameter]
+        public string Parameter
         {
             get
             {
@@ -41,7 +42,8 @@ namespace blazor_lifetime.Pages
                 Console.WriteLine($"{GetType().Name}.OnAfterRender(FirstRender).Start");
                 Thread.Sleep(500);
                 Console.WriteLine($"{GetType().Name}.OnAfterRender(FirstRender).End");
-            } else
+            }
+            else
             {
                 Console.WriteLine($"{GetType().Name}.OnAfterRender.Start");
                 Thread.Sleep(500);

Pages/SecondLevelComponentAsync.razor.cs → Shared/SecondLevelComponentAsync.razor.cs

@@ -2,12 +2,13 @@
 using System;
 using System.Threading.Tasks;
 
-namespace blazor_lifetime.Pages
+namespace blazor_lifetime.Shared
 {
     public class SecondLevelComponentAsyncModel : ComponentBase
     {
         private string _parameter;
-        [Parameter] public string Parameter
+        [Parameter]
+        public string Parameter
         {
             get
             {

Startup.cs

@@ -1,15 +1,8 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Threading.Tasks;
 using Microsoft.AspNetCore.Builder;
-using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Hosting;
-using Microsoft.AspNetCore.HttpsPolicy;
 using Microsoft.Extensions.Configuration;
 using Microsoft.Extensions.DependencyInjection;
 using Microsoft.Extensions.Hosting;
-using blazor_lifetime.Data;
 
 namespace blazor_lifetime
 {
@@ -22,16 +15,12 @@ namespace blazor_lifetime
 
         public IConfiguration Configuration { get; }
 
-        // This method gets called by the runtime. Use this method to add services to the container.
-        // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
         public void ConfigureServices(IServiceCollection services)
         {
             services.AddRazorPages();
             services.AddServerSideBlazor();
-            services.AddSingleton<WeatherForecastService>();
         }
 
-        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
         public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
         {
             if (env.IsDevelopment())
@@ -41,7 +30,6 @@ namespace blazor_lifetime
             else
             {
                 app.UseExceptionHandler("/Error");
-                // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
                 app.UseHsts();
             }