Use PageHeader throughout the system

WebApp/Components/Features/Students/Create.razor

@@ -1,16 +1,21 @@
 @page "/students/create"
 @attribute [Authorize]
+@using WebApp.Components.Shared.Components
 @inject AppDbContext Context
 @inject NavigationManager NavigationManager
 
-<PageTitle>Create Student - TSA Chapter Organizer</PageTitle>
+<PageHeader
+    Title="Create"
+    Subtitle="Student"
+    ShowBackButton="true"
+    BackButtonUrl="/students">
+    <ActionButtons>
+        <MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Form="create-student-form">Create</MudButton>
+        <MudButton Href="/students" Variant="Variant.Text">Cancel</MudButton>
+    </ActionButtons>
+</PageHeader>
 
-<MudText Typo="Typo.h3">Create</MudText>
-<MudText Typo="Typo.h4">Student</MudText>
-<MudDivider />
-
-
-<EditForm Model="Student" OnValidSubmit="OnValidSubmit" Enhance>
+<EditForm id="create-student-form" Model="Student" OnValidSubmit="OnValidSubmit" Enhance>
     <AntiforgeryToken />
     <DataAnnotationsValidator />
     <MudGrid>
@@ -25,8 +30,6 @@
             </MudPaper>
         </MudItem>
     </MudGrid>
-    <MudButton StartIcon="@Icons.Material.Filled.ArrowBack" Href="students">Back</MudButton>
-    <MudButton ButtonType="ButtonType.Submit" StartIcon="@Icons.Material.Filled.Save">Save</MudButton>
 </EditForm>
 
 @code {

WebApp/Components/Features/Students/Details.razor

@@ -1,24 +1,27 @@
 @page "/students/details"
 @attribute [Authorize]
 @using Microsoft.EntityFrameworkCore
-@using Core.Entities
-@using Data
+@using WebApp.Components.Shared.Components
 @inject AppDbContext context
 @inject NavigationManager NavigationManager
 
-<PageTitle>Student Details - TSA Chapter Organizer</PageTitle>
-
-<MudText Typo="Typo.h3">Details</MudText>
-<MudText Typo="Typo.h4">Student</MudText>
-<MudDivider />
-
 @if (student is null)
 {
     <MudText><em>Loading...</em></MudText>
+    return;
 }
-else
-{
-    <MudPaper Class="pa-4 mt-4">
+
+<PageHeader
+    Title="Student Details"
+    ShowBackButton="true"
+    BackButtonUrl="@(ReturnUrl ?? "/students")">
+    <ActionButtons>
+        <MudButton StartIcon="@Icons.Material.Filled.Edit" Href="@($"/students/edit?id={student.Id}&returnUrl={ReturnUrl ?? "/students"}")" Variant="Variant.Outlined">Edit</MudButton>
+        <MudButton Href="@(ReturnUrl ?? "/students")" Variant="Variant.Text">Back to List</MudButton>
+    </ActionButtons>
+</PageHeader>
+
+<MudPaper Class="pa-4 mt-4">
         <MudGrid>
             <MudItem xs="12" sm="6" md="4">
                 <MudText Typo="Typo.subtitle2">First Name</MudText>
@@ -61,13 +64,7 @@ else
                 <MudText>@student.OfficerRole</MudText>
             </MudItem>
         </MudGrid>
-    </MudPaper>
-
-    <div class="mt-4">
-        <MudButton StartIcon="@Icons.Material.Filled.Edit" Href="@($"/students/edit?id={student.Id}&returnUrl={ReturnUrl ?? "/students"}")" Variant="Variant.Filled" Color="Color.Primary">Edit</MudButton>
-        <MudButton StartIcon="@Icons.Material.Filled.ArrowBack" Href="@(ReturnUrl ?? "/students")" Variant="Variant.Text">Back to List</MudButton>
-    </div>
-}
+</MudPaper>
 
 @code {
     private Student? student;

WebApp/Components/Features/Students/Edit.razor

@@ -1,25 +1,30 @@
 @page "/students/edit"
 @attribute [Authorize]
 @using Microsoft.EntityFrameworkCore
+@using WebApp.Components.Shared.Components
 @inject AppDbContext Context
 @inject NavigationManager NavigationManager
 
-<PageTitle>Edit Student - TSA Chapter Organizer</PageTitle>
-
-<MudText Typo="Typo.h3">Edit</MudText>
-<MudText Typo="Typo.h4">Student@(@Student == null ? "" : $" ({Student.Name})")</MudText>
-
-
-
 @if (Student is null)
 {
     <p><em>Loading...</em></p>
+    return;
 }
-else
-{
-    /* https://www.mudblazor.com/components/form */
-    /* https://medium.com/@husainalbar/applying-mudblazor-for-crud-operations-in-our-blazor-project-a343037a52ef */
-    <EditForm method="post" Model="Student" OnValidSubmit="UpdateStudent" FormName="edit" Enhance>
+
+<PageHeader
+    Title="Edit Student"
+    Subtitle="@($"{Student.FirstNameLastName}")"
+    ShowBackButton="true"
+    BackButtonUrl="@(ReturnUrl ?? "/students")">
+    <ActionButtons>
+        <MudButton OnClick="UpdateStudent" Variant="Variant.Filled" Color="Color.Primary">Save</MudButton>
+        <MudButton Href="@(ReturnUrl ?? "/students")" Variant="Variant.Text">Cancel</MudButton>
+    </ActionButtons>
+</PageHeader>
+
+@* https://www.mudblazor.com/components/form *@
+@* https://medium.com/@husainalbar/applying-mudblazor-for-crud-operations-in-our-blazor-project-a343037a52ef *@
+<EditForm method="post" Model="Student" OnValidSubmit="UpdateStudent" FormName="edit" Enhance>
         <AntiforgeryToken />
         <DataAnnotationsValidator/>
         <MudGrid>
@@ -45,10 +50,7 @@ else
                 </MudPaper>
             </MudItem>
         </MudGrid>
-        <MudButton StartIcon="@Icons.Material.Filled.ArrowBack" Href="@(ReturnUrl ?? "/students")">Back</MudButton>
-        <MudButton StartIcon="@Icons.Material.Filled.Save"  OnClick="UpdateStudent">Save</MudButton>
-    </EditForm>
-}
+</EditForm>
 
 @code {
     [SupplyParameterFromQuery]
@@ -74,7 +76,7 @@ else
     // For more information, see https://learn.microsoft.com/aspnet/core/blazor/forms/#mitigate-overposting-attacks.
     private async Task UpdateStudent()
     { 
-        if (Student.OfficerRole == 0)
+        if (Student?.OfficerRole == 0)
             Student.OfficerRole = null;
 
         Context.Attach(Student!).State = EntityState.Modified;

WebApp/Components/Features/Students/EventRanking.razor

@@ -2,14 +2,15 @@
 @attribute [Authorize]
 @using Microsoft.EntityFrameworkCore
 @using WebApp.Models
+@using WebApp.Components.Shared.Components
 @using Core.Validation
 @inject AppDbContext Context
 @inject ValidationService ValidationService
 @rendermode InteractiveServer
 
-<PageTitle>Student Event Ranks - TSA Chapter Organizer</PageTitle>
-
-<MudText Typo="Typo.h3"><MudIcon Icon="@AppIcons.EventRank"></MudIcon> Student Event Ranks</MudText>
+<PageHeader
+    Title="Student Event Ranks"
+    Icon="@AppIcons.EventRank" />
 
 @if (_students == null)
 {

WebApp/Components/Features/Students/Registration.razor

@@ -2,23 +2,22 @@
 @attribute [Authorize]
 @using Microsoft.EntityFrameworkCore
 @using WebApp.Models
+@using WebApp.Components.Shared.Components
 @using Core.Validation
 @inject AppDbContext Context
 @inject WebApp.LocalStorageService LocalStorage
 @inject ValidationService ValidationService
 
-<PageTitle>Registration - TSA Chapter Organizer</PageTitle>
-
-<MudText Typo="Typo.h3">Registration</MudText>
-
-<MudButtonGroup>
-    <MudButton StartIcon="@Icons.Material.Filled.FilterAlt"
-               Variant="@(_showRegionalOnly ? Variant.Filled : Variant.Outlined)"
-               Color="Color.Primary"
-               OnClick="ToggleRegionalFilter">
-        @(_showRegionalOnly ? "Showing Regional Only" : "Show Regional Only")
-    </MudButton>
-</MudButtonGroup>
+<PageHeader Title="Registration">
+    <ActionButtons>
+        <MudButton StartIcon="@Icons.Material.Filled.FilterAlt"
+                   Variant="@(_showRegionalOnly ? Variant.Filled : Variant.Outlined)"
+                   Color="Color.Primary"
+                   OnClick="ToggleRegionalFilter">
+            @(_showRegionalOnly ? "Showing Regional Only" : "Show Regional Only")
+        </MudButton>
+    </ActionButtons>
+</PageHeader>
 
 <MudText Typo="Typo.body2" Style="margin-top: 8px; margin-bottom: 4px;">
     <MudIcon Icon="@AppIcons.Captain" Size="Size.Small" /> = Team Captain