canvasManagement/Management.Web/Shared/Module/Assignment/AssignmentDetails.razor

@using Management.Web.Shared.Components

@inject AssignmentDragContainer dragContainer
@inject CoursePlanner planner

@code {
  [Parameter]
  [EditorRequired]
  public LocalAssignment Assignment { get; set; } = new();
  [Parameter]
  [EditorRequired]
  public LocalModule Module { get; set; } = new();
  private bool showUpdateForm = false;
  
  protected override void OnInitialized()
  {
    planner.StateHasChanged += reload;
  }
  private void reload()
  {
    this.InvokeAsync(this.StateHasChanged);
  }
  public void Dispose()
  {
    planner.StateHasChanged -= reload;
  }
  private Modal? assignmentEditorModal {get; set;}
  private void HandleDragStart()
  {
    dragContainer.DropCallback = (DateTime dropDate) => {
      if (planner.LocalCourse != null)
      {
        var newCourse = planner.LocalCourse with 
        {
          Modules = planner.LocalCourse.Modules.Select(m => 
            m.Name != Module.Name
              ? m
              : m with 
              {
                Assignments = Module.Assignments.Select(a => 
                  a.id != Assignment.id
                  ? a
                  : a with 
                  {
                    due_at=dropDate
                  }
                )
              }
          )
        };
        planner.LocalCourse = newCourse;
      }
    };
  }

  private void HandleDragEnd()
  {
    dragContainer.DropCallback = null;
  }

}

<div 
  draggable="true"
  @ondragstart="HandleDragStart"
  @ondragend="HandleDragEnd"
  @onclick="@(() => showUpdateForm = true)"
  class="draggableCart"
  role="button"
>
  <div class="card">
    <div class="card-body">
      <div class="card-title">@Assignment.name</div>
      <div class="card-text">
        @Assignment.description
        <div>Due At: @Assignment.due_at</div>
        <div>Lock At: @Assignment.lock_at</div>
        <div>Points: @Assignment.points_possible</div>
        @if(Assignment.canvasId != null)
        {
          <div>Synced with canvas</div>
        }
        else
        {
          <div>Not synced with canvas</div>
        }
        <div class="ms-3">

          <div class="row  p-1">
            <div class="col border-end my-auto text-end">
              Label
            </div>
            <div class="col my-auto">
              Points
            </div>
          </div>
          @foreach(var rubricItem in Assignment.rubric)
          {
            <div class="row  p-1">
              <div class="col border-end my-auto text-end">
                @rubricItem.Label
              </div>
              <div class="col my-auto">
                @rubricItem.Points
              </div>
            </div>
          }
        </div>
      </div>

    </div>
  </div>
</div>

<AssignmentForm
  Assignment="Assignment"
  Show="showUpdateForm"
  OnHide="@(() => showUpdateForm = false)"
  Module="Module"
/>