Implement task steps (#17)

* Set data design for this Feature

* Added TaskDefinitionStep, TaskInstanceStep

* Allow grabbing Steps from parents

* Show steps on home page

* Check off steps from Home

* Make OnlyActive default

* Add modal to add steps to Task Definition edit page

Author: mitch-b

.devcontainer/devcontainer.json

@@ -39,6 +39,7 @@
         "GitHub.copilot-chat",
         "github.vscode-github-actions",
         "ms-dotnettools.csharp",
+        "ms-dotnettools.csdevkit",
         "ms-mssql.mssql"
       ]
     }

.docs/DATA-DESIGN.md

@@ -34,7 +34,6 @@
     * **`TaskType`**
     * **`Asset`(s)**
     * Task name
-    * Task system-name (kebab-name but overridable)
 * (Phase1) `TaskInstance`
   * An instance of a **`TaskDefinition`**.
   * Can be auto-generated when a required lifespan hits.
@@ -49,6 +48,21 @@
     * Duration (Self-Recorded)
     * DueByDate
     * MQTT-enabled (can be _Phase4_)
+* (Phase2) `TaskDefinitionSteps`
+  * _ie, for 'Clean Room', steps may be 'Organize books', 'Clear dresser', 'Hang clothes', etc. ..._
+  * `TaskDefinitionStep`s are associated under **`TaskDefinition`s**
+  * Each `TaskInstance` will have its own set of `TaskDefinitionStep`s to track progress.
+  * Properties:
+    * **`TaskDefinition`**
+    * Task Definition Step name
+    * IsOptional
+* (Phase2) `TaskInstanceStep`
+  * `TaskInstanceStep`s are associated under **`TaskInstance`s** and created from **`TaskDefinitionStep`s**
+  * Properties:
+    * **`TaskInstance`**
+    * **`TaskDefinitionStep`**
+    * CompletedOn
+    * CompletedBy (User)
 * (Phase2) `Part`
   * Parts contain `PurchasedPart`s
   * Properties:

src/MaintenanceLog.Client/Components/TaskInstances/TaskInstanceGrid.razor

@@ -1,10 +1,13 @@
 @using MaintenanceLog.Data.Entities
 @using MaintenanceLog.Data.Services.Contracts
 @using MaintenanceLog.Common.Extensions
+@using System.Security.Claims
 
 @inject IJSRuntime JsRuntime
 @inject ITaskDefinitionService TaskDefinitionService
 @inject ITaskInstanceService TaskInstanceService
+@inject ITaskInstanceStepService TaskInstanceStepService
+@inject AuthenticationStateProvider AuthenticationStateProvider
 @inject NavigationManager NavigationManager
 
 <!-- Task Instances Table -->
@@ -13,8 +16,9 @@
     <table class="table">
         <thead>
             <tr>
-                <th>Start</th>
+                <th></th>
                 <th>Name</th>
+                <th>Steps</th>
                 <th>Asset</th>
                 <th>Area</th>
                 <th>Completed On</th>
@@ -29,14 +33,47 @@
                     <td>
                         @if (taskInstance.CompletedOn is null)
                         {
-                        <button class="btn btn-danger" title="Stop" @onclick="() => StopTaskInstance(taskInstance)">
-                            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-stop" viewBox="0 0 16 16">
-                                <path d="M3.5 5A1.5 1.5 0 0 1 5 3.5h6A1.5 1.5 0 0 1 12.5 5v6a1.5 1.5 0 0 1-1.5 1.5H5A1.5 1.5 0 0 1 3.5 11zM5 4.5a.5.5 0 0 0-.5.5v6a.5.5 0 0 0 .5.5h6a.5.5 0 0 0 .5-.5V5a.5.5 0 0 0-.5-.5z"/>
-                            </svg>
-                        </button>
+                            <button class="btn btn-danger" title="Stop" @onclick="() => StopTaskInstance(taskInstance)">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="white" class="bi bi-stop" viewBox="0 0 16 16">
+                                    <path d="M3.5 5A1.5 1.5 0 0 1 5 3.5h6A1.5 1.5 0 0 1 12.5 5v6a1.5 1.5 0 0 1-1.5 1.5H5A1.5 1.5 0 0 1 3.5 11zM5 4.5a.5.5 0 0 0-.5.5v6a.5.5 0 0 0 .5.5h6a.5.5 0 0 0 .5-.5V5a.5.5 0 0 0-.5-.5z" />
+                                </svg>
+                            </button>
                         }
                     </td>
                     <td>@taskInstance.TaskDefinition!.Name</td>
+                    <td>
+                        @if (@taskInstance.TaskInstanceSteps?.Count > 0)
+                        {
+                            var completedSteps = taskInstance.TaskInstanceSteps.Where(s => s.CompletedOn.HasValue).Count();
+                            if (completedSteps == taskInstance.TaskInstanceSteps.Count || taskInstance.CompletedOn.HasValue)
+                            {
+                                <span class="badge bg-success">@completedSteps / @taskInstance.TaskInstanceSteps.Count</span>
+                            }
+                            else
+                            {
+                                <span class="badge bg-info">@completedSteps / @taskInstance.TaskInstanceSteps.Count</span>
+                            }
+                            <ul>
+                                @foreach (var step in taskInstance.TaskInstanceSteps)
+                                {
+                                    <li>
+                                        @if (step.CompletedOn.HasValue)
+                                        {
+                                            <s>
+                                                <input type="checkbox" @onchange="() => HandleInstanceStepCheckboxChanged(step)" checked="@step.CompletedOn.HasValue" />
+                                                @step.TaskDefinitionStep!.Name
+                                            </s>
+                                        }
+                                        else
+                                        {
+                                            <input type="checkbox" @onchange="() => HandleInstanceStepCheckboxChanged(step)" checked="@step.CompletedOn.HasValue" />
+                                            @step.TaskDefinitionStep!.Name
+                                        }
+                                    </li>
+                                }
+                            </ul>
+                        }
+                    </td>
                     <td>@taskInstance.TaskDefinition!.Asset?.Name</td>
                     <td>@taskInstance.TaskDefinition!.Area?.Name</td>
                     <td>
@@ -76,11 +113,13 @@ else
     public int? TaskDefinitionId { get; set; }
     [Parameter]
     public bool? OnlyShowActive { get; set; }
+    private string? _userId;
 
     private List<TaskInstance>? taskInstances;
 
     protected override async Task OnInitializedAsync()
     {
+        await GetClaimsPrincipalData();
         await base.OnInitializedAsync();
     }
 
@@ -90,13 +129,20 @@ else
         await LoadTaskInstances();
     }
 
+    private async Task GetClaimsPrincipalData()
+    {
+        var authState = await AuthenticationStateProvider.GetAuthenticationStateAsync();
+        var user = authState.User;
+        _userId = user.FindFirstValue(ClaimTypes.NameIdentifier);
+    }
+
     private async Task LoadTaskInstances()
     {
         taskInstances = (await TaskInstanceService.GetAsync())
             .Where(t => !TaskDefinitionId.HasValue || (t.TaskDefinitionId == TaskDefinitionId))
             .Where(t => !OnlyShowActive.HasValue || OnlyShowActive == false || (OnlyShowActive == true && t.CompletedOn == null))
             .ToList();
-        
+
         await InvokeAsync(StateHasChanged);
     }
 
@@ -119,4 +165,29 @@ else
         await TaskInstanceService.UpdateAsync(taskInstance);
         await LoadTaskInstances();
     }
+
+    private async Task HandleInstanceStepCheckboxChanged(TaskInstanceStep taskInstanceStep)
+    {
+        if (taskInstanceStep.CompletedOn.HasValue)
+        {
+            await UnCheckInstanceStep(taskInstanceStep);
+        }
+        else
+        {
+            await CheckOffInstanceStep(taskInstanceStep);
+        }
+        await LoadTaskInstances();
+    }
+
+    private async Task CheckOffInstanceStep(TaskInstanceStep taskInstanceStep)
+    {
+        taskInstanceStep.CompletedOn = DateTimeOffset.UtcNow;
+        await TaskInstanceStepService.UpdateAsync(taskInstanceStep);
+    }
+
+    private async Task UnCheckInstanceStep(TaskInstanceStep taskInstanceStep)
+    {
+        taskInstanceStep.CompletedOn = null!;
+        await TaskInstanceStepService.UpdateAsync(taskInstanceStep);
+    }
 }

src/MaintenanceLog.Client/Pages/Home.razor

@@ -16,22 +16,19 @@
         Hello @context.User.Identity?.Name!
 
         <h2 class="pt-4">Tasks</h2>
-        <input type="checkbox" @bind-value="onlyActive" @bind-value:after="OnOnlyActiveChanged" /> Only Active
-        <TaskInstanceGrid OnlyShowActive="onlyActive" />
+        <input type="checkbox" @bind="onlyActive" /> Only Active
+
+        <TaskInstanceGrid OnlyShowActive="@onlyActive" />
     </Authorized>
 </AuthorizeView>
 
 @code
 {
-    private bool? onlyActive = false;
+    private bool? onlyActive = true;
 
     protected override async Task OnAfterRenderAsync(bool firstRender)
     {
-        //onlyActive = await LocalStorage.GetItemAsync<bool?>("onlyActive");
-    }
-
-    private async Task OnOnlyActiveChanged()
-    {
-        //await LocalStorage.SetItemAsync("onlyActive", onlyActive);
+        //onlyActive = await LocalStorage.GetItemAsync<bool?>(nameof(onlyActive));
+        await base.OnAfterRenderAsync(firstRender);
     }
 }

src/MaintenanceLog.Client/Pages/TaskDefinitionSteps/AddTaskDefinitionStepModal.razor

@@ -0,0 +1,100 @@
+@using MaintenanceLog.Data.Entities
+@using MaintenanceLog.Data.Services.Contracts
+
+@inject ITaskDefinitionStepService TaskDefinitionStepService
+
+<button class="btn btn-primary" @onclick="OpenModal">
+    + Step
+</button>
+
+@if (isModalOpen && taskDefinitionStep is not null)
+{
+    <div class="modal">
+        <div class="modal-content">
+            <span class="close" @onclick="CloseModal">&times;</span>
+            <p>Add a new Task Definition Step:</p>
+
+            <input type="text" class="form-control" placeholder="Name" @bind="taskDefinitionStep.Name" />
+            <div class="form-check">
+                <input class="form-check-input" type="checkbox" id="isOptionalCheck" @bind="taskDefinitionStep.IsOptional" />
+                <label class="form-check-label" for="isOptionalCheck">Is Optional</label>
+            </div>
+
+            <button class="btn btn-primary" @onclick="AddTaskDefinitionStep">
+                Add
+            </button>
+        </div>
+    </div>
+}
+
+<style>
+
+    .modal {
+        display: block; /* Hidden by default */
+        position: fixed; /* Stay in place */
+        z-index: 1; /* Sit on top */
+        left: 0;
+        top: 0;
+        width: 100%; /* Full width */
+        height: 100%; /* Full height */
+        overflow: auto; /* Enable scroll if needed */
+        background-color: rgb(0,0,0); /* Fallback color */
+        background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
+    }
+
+    .modal-content {
+        background-color: #fefefe;
+        margin: 15% auto; /* 15% from the top and centered */
+        padding: 20px;
+        border: 1px solid #888;
+        width: 80%; /* Could be more or less, depending on screen size */
+    }
+
+    .close {
+        color: #aaa;
+        float: right;
+        font-size: 28px;
+        font-weight: bold;
+    }
+
+        .close:hover,
+        .close:focus {
+            color: black;
+            text-decoration: none;
+            cursor: pointer;
+        }
+
+</style>
+
+@code {
+    [Parameter]
+    public int TaskDefinitionId { get; set; }
+
+    private bool isModalOpen = false;
+    private TaskDefinitionStep? taskDefinitionStep;
+
+    void OpenModal()
+    {
+        taskDefinitionStep = new TaskDefinitionStep()
+            {
+                Name = "",
+                TaskDefinitionId = TaskDefinitionId
+            };
+        isModalOpen = true;
+    }
+
+    void CloseModal()
+    {
+        isModalOpen = false;
+    }
+
+    private async Task AddTaskDefinitionStep()
+    {
+        if (taskDefinitionStep is null)
+        {
+            return;
+        }
+        await TaskDefinitionStepService.AddAsync(taskDefinitionStep);
+        isModalOpen = false;
+    }
+}

src/MaintenanceLog.Client/Pages/TaskDefinitionSteps/TaskDefinitionStepGrid.razor

@@ -0,0 +1,66 @@
+@using MaintenanceLog.Data.Entities
+@using MaintenanceLog.Data.Services.Contracts
+
+@inject IJSRuntime JsRuntime
+@inject ITaskDefinitionStepService TaskDefinitionStepService
+
+<!-- Task Definition Steps Table -->
+@if (taskDefinitionSteps != null)
+{
+    <table class="table">
+        <thead>
+            <tr>
+                <th>Name</th>
+                <th>Is Optional</th>
+                <th>Actions</th>
+            </tr>
+        </thead>
+        <tbody>
+            @foreach (var step in taskDefinitionSteps)
+            {
+                <tr>
+                    <td>@step.Name</td>
+                    <td>@step.IsOptional</td>
+                    <td>
+                        <button class="btn btn-danger" @onclick="() => DeleteTaskDefinitionStep(step.Id)">Delete</button>
+                    </td>
+                </tr>
+            }
+        </tbody>
+    </table>
+
+    <AddTaskDefinitionStepModal TaskDefinitionId="TaskDefinitionId" />
+}
+
+
+@code {
+    [Parameter]
+    public int TaskDefinitionId { get; set; }
+
+    private List<TaskDefinitionStep>? taskDefinitionSteps;
+
+    protected override async Task OnInitializedAsync()
+    {
+        await base.OnInitializedAsync();
+        await LoadTaskDefinitionSteps();
+    }
+
+    private async Task LoadTaskDefinitionSteps()
+    {
+        taskDefinitionSteps = (await TaskDefinitionStepService.GetAsync())
+            .Where(t => t.TaskDefinitionId == TaskDefinitionId)
+            .ToList();
+
+        await InvokeAsync(StateHasChanged);
+    }
+
+    private async Task DeleteTaskDefinitionStep(int id)
+    {
+        bool confirmed = await JsRuntime.InvokeAsync<bool>("confirm", "Are you sure?");
+        if (confirmed)
+        {
+            await TaskDefinitionStepService.DeleteAsync(id);
+            await LoadTaskDefinitionSteps();
+        }
+    }
+}

src/MaintenanceLog.Client/Pages/TaskDefinitions/EditTaskDefinition.razor

@@ -1,5 +1,6 @@
 @page "/task-definitions/edit/{TaskDefinitionId:int}"
 
+@using MaintenanceLog.Client.Pages.TaskDefinitionSteps
 @using MaintenanceLog.Data.Entities
 @using MaintenanceLog.Data.Services.Contracts
 @using Microsoft.AspNetCore.Authorization
@@ -67,6 +68,8 @@
         <!-- Submit Button -->
         <button type="submit" class="btn btn-primary">Save</button>
     </EditForm>
+
+    <TaskDefinitionStepGrid TaskDefinitionId="TaskDefinitionId" />
 }
 else
 {