restructured components so that there are more components in the pages

Management.Web/Pages/Course/CourseCalendar/MonthDetail.razor

@@ -0,0 +1,55 @@
+@using System.Linq
+@using Management.Web.Pages.Course.CourseCalendar.Day
+
+@inject CoursePlanner planner
+
+@code
+{
+  [Parameter, EditorRequired]
+  public CalendarMonth Month { get; set; } = default!;
+
+  public DayOfWeek[] WeekDaysList { get => (DayOfWeek[])Enum.GetValues(typeof(DayOfWeek)); }
+
+  public string MonthName { get => Month?.DaysByWeek.First().FirstOrDefault(d => d != null)?.ToString("MMMM") ?? ""; }
+  private string htmlLabel => "collapse"+MonthName;
+  private bool isInPast =>
+    new DateTime(Month.Year, Month.Month, 1) < new DateTime(DateTime.Now.Year, DateTime.Now.Month, 1);
+  private string collapseClass => " collapse " + (isInPast ? "hide" : "show");
+}
+
+<h3 class="text-center">
+  <a
+    role="button"
+    data-bs-toggle="collapse"
+    data-bs-target="@("#" + htmlLabel)"
+    aria-expanded="@( isInPast ? "false" : "true")"
+    aria-controls="@htmlLabel"
+  >
+    @MonthName
+  </a>
+</h3>
+
+<div class="@collapseClass" id="@htmlLabel">
+  <div class="row text-center fw-bold">
+    @foreach (DayOfWeek day in WeekDaysList)
+    {
+      <div class="@(
+          planner.LocalCourse?.Settings.DaysOfWeek.Contains(day) ?? false
+            ? "col"
+            : "col text-secondary"
+        )">
+        @day
+      </div>
+    }
+  </div>
+
+  @foreach (var week in Month.DaysByWeek)
+  {
+    <div class="row m-3">
+    @foreach (var day in week)
+      {
+        <Day date="day"></Day>
+      }
+    </div>
+  }
+</div>