Disable the edition of existing tags names on Device Tags Settings page #1002

src/AzureIoTHub.Portal.Server.Tests.Unit/Pages/Settings/DeviceTagsPageTests.cs

@@ -6,7 +6,6 @@ namespace AzureIoTHub.Portal.Server.Tests.Unit.Pages.Settings
     using System;
     using System.Collections.Generic;
     using System.Linq;
-    //using System.Threading.Tasks;
     using AutoFixture;
     using AzureIoTHub.Portal.Client.Exceptions;
     using AzureIoTHub.Portal.Client.Models;
@@ -268,5 +267,24 @@ public void ClickOnSaveShouldProcessProblemDetailsExceptionIfIssueOccursWhenUpda
             // Assert
             cut.WaitForAssertion(() => MockRepository.VerifyAll());
         }
+
+        [Test]
+        public void ClickOnAddNewTagShouldAddNewTag()
+        {
+            //Arrange
+            _ = this.mockDeviceTagSettingsClientService.Setup(service => service.GetDeviceTags())
+                .ReturnsAsync(Array.Empty<DeviceTag>());
+
+            var cut = RenderComponent<DeviceTagsPage>();
+            cut.WaitForAssertion(() => cut.Markup.Should().NotContain("Loading..."));
+
+            // Act
+            cut.WaitForElement("#addTagButton").Click();
+
+            // Assert
+            cut.WaitForAssertion(() => cut.Markup.Should().NotContain("No matching records found"));
+            cut.WaitForAssertion(() => cut.FindAll("table tbody tr").Count.Should().Be(1));
+            cut.WaitForAssertion(() => MockRepository.VerifyAll());
+        }
     }
 }

src/AzureIoTHub.Portal/Client/Models/DeviceTagModel.cs

@@ -0,0 +1,25 @@
+// Copyright (c) CGI France. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+
+namespace AzureIoTHub.Portal.Client.Models
+{
+    using Portal.Models.v10;
+
+    public class DeviceTagModel : DeviceTag
+    {
+        public DeviceTagModel()
+        {
+            IsNewTag = true;
+        }
+
+        public DeviceTagModel(DeviceTag deviceTag)
+        {
+            Name = deviceTag.Name;
+            Label = deviceTag.Label;
+            Required = deviceTag.Required;
+            Searchable = deviceTag.Searchable;
+        }
+
+        public bool IsNewTag { get; set; }
+    }
+}

src/AzureIoTHub.Portal/Client/Pages/Settings/DeviceTagsPage.razor

@@ -1,13 +1,12 @@
 @page "/settings/device-tag"
-@using AzureIoTHub.Portal.Models.v10
 
 @attribute [Authorize]
 @inject ISnackbar Snackbar
 @inject IDeviceTagSettingsClientService DeviceTagSettingsClientService
 
 <MudGrid>
     <MudItem xs="12">
-        <MudTable Items=@Tags Loading="isProcessing" Dense=true Hover=true Bordered=true Striped=true>
+        <MudTable Items="@Tags" Loading="isProcessing" Dense=true Hover=true Bordered=true Striped=true>
 
             <ToolBarContent>
                 <MudText Typo="Typo.h6">Tags</MudText>
@@ -37,6 +36,7 @@
                 <MudTd DataLabel="Name" Style="word-break: break-all;">
                     <MudForm @ref="FormName" Model="TagContexte">
                         <MudTextField @bind-Value="@TagContexte.Name" Label="Name"
+                                      Disabled="@(!TagContexte.IsNewTag)"
                                       HelperText="Name that will be registered in the device twin" HelperTextOnFocus="true"
                                       For="@(() => TagContexte.Name)" Margin="Margin.Dense" Variant="Variant.Outlined" Required="true"></MudTextField>
                     </MudForm>
@@ -66,7 +66,7 @@
                 </MudTd>
             </RowTemplate>
             <FooterContent>
-                <MudButton StartIcon="@Icons.Material.Filled.Add" Size="Size.Medium" Color="Color.Success" OnClick="AddTag" id="addTagButton">Add a new Tag</MudButton>
+                <MudButton StartIcon="@Icons.Material.Filled.Add" Size="Size.Medium" Color="Color.Success" OnClick="@AddTag" id="addTagButton">Add a new Tag</MudButton>
             </FooterContent>
 
             <NoRecordsContent>
@@ -83,7 +83,7 @@
     [CascadingParameter]
     public Error Error { get; set; }
 
-    List<DeviceTag> Tags { get; set; } = new();
+    List<DeviceTagModel> Tags { get; } = new();
     private MudForm FormName { get; set; }
     private MudForm FormLabel { get; set; }
 
@@ -100,7 +100,10 @@
         {
             isProcessing = true;
             Tags.Clear();
-            Tags.AddRange(await DeviceTagSettingsClientService.GetDeviceTags());
+
+            var result = await DeviceTagSettingsClientService.GetDeviceTags();
+
+            Tags.AddRange(result.Select(tag => new DeviceTagModel(tag)).ToList());
         }
         catch (ProblemDetailsException exception)
         {
@@ -118,24 +121,24 @@
 
         if (Tags.Count == 0 || (last.Name is not null && last.Label is not null))
         {
-            Tags.Add(new DeviceTag());
+            Tags.Add(new DeviceTagModel());
         }
     }
 
-    private void DeleteTag(DeviceTag item)
+    private void DeleteTag(DeviceTagModel deviceTagModel)
     {
         try
         {
-            DeviceTagSettingsClientService.DeleteDeviceTagByName(item.Name);
-            Tags.Remove(item);
+            DeviceTagSettingsClientService.DeleteDeviceTagByName(deviceTagModel.Name);
+            Tags.Remove(deviceTagModel);
         }
         catch (ProblemDetailsException exception)
         {
             Error?.ProcessProblemDetails(exception);
         }
     }
 
-    private async Task Save(DeviceTag deviceTag)
+    private async Task Save(DeviceTagModel deviceTagModel)
     {
         try
         {
@@ -166,7 +169,9 @@
             }         
             else
             {
-                await DeviceTagSettingsClientService.CreateOrUpdateDeviceTag(deviceTag);
+                await DeviceTagSettingsClientService.CreateOrUpdateDeviceTag(deviceTagModel);
+
+                deviceTagModel.IsNewTag = false;
             }
 
             Snackbar.Add($"Settings have been successfully updated!", Severity.Success);