Add common loading component

This has no specific issue associated, but reduces boilerplate in most page components

src/JobsJobsJobs/Client/Shared/Loading.razor

@@ -0,0 +1,18 @@
+@if (IsLoading)
+{
+  <p>@Message</p>
+}
+else if (ErrorMessages.Count > 0)
+{
+  <p>The following error@(ErrorMessages.Count == 1 ? "" : "s") occurred:</p>
+  <ul>
+    @foreach (var msg in ErrorMessages)
+    {
+      <li><pre>@msg</pre></li>
+    }
+  </ul>
+}
+else
+{
+  @ChildContent
+}

src/JobsJobsJobs/Client/Shared/Loading.razor.cs

@@ -0,0 +1,58 @@
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Threading.Tasks;
+
+namespace JobsJobsJobs.Client.Shared
+{
+    public partial class Loading : ComponentBase
+    {
+        /// <summary>
+        /// The delegate to call to load the data for this page
+        /// </summary>
+        [Parameter]
+        public EventCallback<ICollection<string>> OnLoad { get; set; }
+
+        /// <summary>
+        /// The message to display when the page is loading (optional)
+        /// </summary>
+        [Parameter]
+        public MarkupString Message { get; set; } = new MarkupString("Loading&hellip;");
+
+        /// <summary>
+        /// The content to be displayed once the data has been loaded
+        /// </summary>
+        [Parameter]
+        public RenderFragment ChildContent { get; set; } = default!;
+
+        /// <summary>
+        /// Error messages that may arise from the data loading delegate
+        /// </summary>
+        private ICollection<string> ErrorMessages { get; set; } = new List<string>();
+
+        /// <summary>
+        /// Whether we are currently loading data
+        /// </summary>
+        private bool IsLoading { get; set; } = true;
+
+        protected override async Task OnInitializedAsync()
+        {
+            if (OnLoad.HasDelegate)
+            {
+                try
+                {
+                    await OnLoad.InvokeAsync(ErrorMessages);
+                }
+                finally
+                {
+                    IsLoading = false;
+                }
+            }
+            else
+            {
+                IsLoading = false;
+            }
+        }
+    }
+}

src/JobsJobsJobs/Client/Shared/NavMenu.razor

@@ -9,10 +9,10 @@
   </button>
 </div>
 
-<div class="@NavMenuCssClass" @onclick="ToggleNavMenu">
+<div class="@NavMenuCssClass" @onclick=@ToggleNavMenu>
   <ul class="nav flex-column">
     <li class="nav-item px-3">
-      <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
+      <NavLink class="nav-link" href="" Match=@NavLinkMatch.All>
         <span class="oi oi-home" aria-hidden="true"></span> Home
       </NavLink>
     </li>