can create and drag and drop pages

Management.Web/Pages/Course/Module/ModuleItems/AssignmentListItem.razor

@@ -0,0 +1,137 @@
+@using Management.Web.Shared.Components
+@using Management.Web.Course.Module.ModuleItems
+@using CanvasModel.Assignments
+
+@inject DragContainer dragContainer
+@inject NavigationManager Navigation
+@inject AssignmentEditorContext assignmentContext
+
+@inherits DroppableAssignment
+
+@code {
+  [Parameter]
+  [EditorRequired]
+  public LocalModule Module { get; set; } = new();
+  protected override void OnInitialized()
+  {
+    planner.StateHasChanged += reload;
+  }
+  private void reload()
+  {
+    this.InvokeAsync(this.StateHasChanged);
+  }
+  public void Dispose()
+  {
+    planner.StateHasChanged -= reload;
+  }
+  private bool showAll { get; set; } = false;
+
+
+  private void HandleDragStart()
+  {
+    dragContainer.DropCallback = DropCallback;
+  }
+
+  private void HandleDragEnd()
+  {
+    dragContainer.DropCallback = null;
+  }
+
+  private CanvasAssignment? assignmentInCanvas => planner
+    .CanvasAssignments?
+    .FirstOrDefault(
+      a => a.Name == Assignment.Name
+    );
+
+  private bool existsInCanvas =>
+    assignmentInCanvas != null;
+  private void OnClick()
+  {
+    assignmentContext.Assignment = Assignment;
+    Navigation.NavigateTo("/course/" + planner.LocalCourse?.Settings.Name + "/assignment/" + Assignment.Name);
+  }
+
+  private bool NeedsToBeUpdatedInCanvas => planner.LocalCourse != null
+    && planner.LocalCourse.Settings.CanvasId != null
+    && planner.CanvasAssignments != null
+    && planner.CanvasModules != null
+    && assignmentInCanvas != null
+    && Assignment.NeedsUpdates(
+      (CanvasAssignment)assignmentInCanvas,
+      Assignment.GetCanvasAssignmentGroupId(planner.LocalCourse.Settings.AssignmentGroups)
+    );
+}
+
+<div
+  draggable="true"
+  @ondragstart="HandleDragStart"
+  @ondragend="HandleDragEnd"
+  @onclick="OnClick"
+  role="button"
+>
+  <ModuleItemLayout Name=@Assignment.Name IsSyncedWithCanvas=@(existsInCanvas && !NeedsToBeUpdatedInCanvas)>
+    @if(
+      planner.LocalCourse != null
+      && existsInCanvas
+      && NeedsToBeUpdatedInCanvas
+      && assignmentInCanvas != null
+    )
+    {
+      <div class="mx-3 text-body-tertiary">
+        @Assignment.GetUpdateReason(
+          (CanvasAssignment)assignmentInCanvas,
+          Assignment.GetCanvasAssignmentGroupId(planner.LocalCourse.Settings.AssignmentGroups))
+      </div>
+    }
+    @if(!existsInCanvas)
+    {
+      <div class="mx-3 text-body-tertiary">
+        no assignment with same name in canvas
+      </div>
+    }
+
+    @if(!showAll)
+    {
+      <div class="card-text overflow-hidden p-2" style="max-height: 5rem;">
+        <div>Points: @Assignment.PointsPossible</div>
+        <div>Due At: @Assignment.DueAt</div>
+      </div>
+      }
+      else
+      {
+        <div class="card-text">
+          <div class="px-3 py-1 bg-dark-subtle my-1">
+
+          @((MarkupString) @Assignment.GetDescriptionHtml())
+          </div>
+
+          <section class="px-3">
+            <div>Points: @Assignment.PointsPossible</div>
+            <div>Due At: @Assignment.DueAt</div>
+            <div>Lock At: @Assignment.LockAt</div>
+            <div>Submission Types:</div>
+            <ul>
+              @foreach(var type in Assignment.SubmissionTypes)
+              {
+                <li>
+                  @type
+                </li>
+              }
+            </ul>
+          </section>
+        </div>
+      }
+
+
+    <div
+      class="text-center fs-3 fw-bold lh-1 text-primary"
+      role="button"
+      @onclick:preventDefault="true"
+      @onclick:stopPropagation="true"
+      @onclick="() => showAll = !showAll"
+    >
+      <MeatballsIcon />
+    </div>
+
+  </ModuleItemLayout>
+</div>