Fix #424 - display device name in screens instead of device id (#463)

CGI-FR · Mar 16, 2022 · 0048561 · 0048561
1 parent 9055acd
commit 0048561
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 13 deletions.
diff --git a/src/AzureIoTHub.Portal/Client/Pages/Devices/CreateDevicePage.razor b/src/AzureIoTHub.Portal/Client/Pages/Devices/CreateDevicePage.razor
@@ -24,7 +24,7 @@
                     <MudCard>
                         <MudCardHeader>
                             <CardHeaderContent>
-                                <MudText Align="Align.Center" Typo="Typo.h5">@Device.DeviceID</MudText>
+                                <MudText Typo="Typo.h5">@(string.IsNullOrEmpty(Device.DeviceName) ? Device.DeviceID : Device.DeviceName)</MudText>
                             </CardHeaderContent>
                         </MudCardHeader>
                         <MudCardContent>

diff --git a/src/AzureIoTHub.Portal/Client/Pages/Devices/DeleteDevicePage.razor b/src/AzureIoTHub.Portal/Client/Pages/Devices/DeleteDevicePage.razor
@@ -6,9 +6,16 @@
 
 <MudDialog>
     <DialogContent>
-        <p>Delete @deviceID ?</p>
-        <br />
-        <p><i>Warning : this cannot  be undone.</i></p>
+        <MudGrid>
+            <MudItem xs=12>
+                <MudText>
+                    Delete @deviceName ?
+                </MudText>
+            </MudItem>
+            <MudItem xs=12>
+                <MudText><i>Warning : this cannot  be undone.</i></MudText>
+            </MudItem>
+        </MudGrid>
     </DialogContent>
     <DialogActions>
         <MudButton OnClick="Cancel">Cancel</MudButton>
@@ -19,6 +26,7 @@
 @code {
     [CascadingParameter] MudDialogInstance MudDialog { get; set; }
     [Parameter] public string deviceID { get; set; }
+    [Parameter] public string deviceName { get; set; }
 
     void Submit() => MudDialog.Close(DialogResult.Ok(true));
     void Cancel() => MudDialog.Cancel();
@@ -30,17 +38,17 @@
     private async Task DeleteDevice()
     {
         // var response = await Http.PostAsJsonAsync<DeviceListItem>($"Devices/delete", device);
-        var response = await Http.DeleteAsync($"api/Devices/{deviceID}");
+        var response = await Http.DeleteAsync($"api/devices/{deviceID}");
 
         // Prompts a snack bar to inform if the action was successful
         // TODO : Deal more effectively with error/success messages
         if (!response.IsSuccessStatusCode)
         {
-            Snackbar.Add($"Oh oh, something went wrong while deleting device {deviceID}... ", Severity.Error);
+            Snackbar.Add($"Oh oh, something went wrong while deleting device {deviceName}... ", Severity.Error);
             return;
         }
 
-        Snackbar.Add($"Device {deviceID} has been successfully deleted!", Severity.Success);
+        Snackbar.Add($"Device {deviceName} has been successfully deleted!", Severity.Success);
         MudDialog.Close(DialogResult.Ok(true));
     }
-}
+}
diff --git a/src/AzureIoTHub.Portal/Client/Pages/Devices/DeviceDetailPage.razor b/src/AzureIoTHub.Portal/Client/Pages/Devices/DeviceDetailPage.razor
@@ -24,7 +24,7 @@
                     <MudCard>
                         <MudCardHeader>
                             <CardHeaderContent>
-                                <MudText Typo="Typo.h5">@Device.DeviceID</MudText>
+                                <MudText Typo="Typo.h5">@(string.IsNullOrEmpty(Device.DeviceName) ? Device.DeviceID : Device.DeviceName)</MudText>
                             </CardHeaderContent>
                             <CardHeaderActions>
                                 @if (isLoaded && (!IsLoRa || !(Device is LoRaDeviceDetails)))
@@ -257,7 +257,7 @@
         result.EnsureSuccessStatusCode();
 
         // Prompts a snack bar to inform the action was successful
-        Snackbar.Add($"Device {Device.DeviceID} has been successfully updated!", Severity.Success);
+        Snackbar.Add($"Device {Device.DeviceName} has been successfully updated!", Severity.Success);
 
         // Go back to the list of devices
         NavManager.NavigateTo("devices");

diff --git a/src/AzureIoTHub.Portal/Client/Pages/Devices/DeviceListPage.razor b/src/AzureIoTHub.Portal/Client/Pages/Devices/DeviceListPage.razor
@@ -249,11 +249,14 @@
     {
         var parameters = new DialogParameters();
         parameters.Add("deviceID", device.DeviceID);
+        parameters.Add("deviceName", device.DeviceName);
         var result = await DialogService.Show<DeleteDevicePage>("Confirm Deletion", parameters).Result;
 
         if (result.Cancelled)
         {
             return;
         }
+
+        Search();
     }
 }
diff --git a/src/AzureIoTHub.Portal/Client/Pages/Edge_Devices/EdgeDeviceDeleteConfirmationDialog.razor b/src/AzureIoTHub.Portal/Client/Pages/Edge_Devices/EdgeDeviceDeleteConfirmationDialog.razor
@@ -6,9 +6,16 @@
 
 <MudDialog>
     <DialogContent>
-        <p>Delete @DeviceId ?</p>
-        <br />
-        <p><i>Warning : this cannot  be undone.</i></p>
+        <MudGrid>
+            <MudItem xs=12>
+                <MudText>
+                    Delete @DeviceId ?
+                </MudText>
+            </MudItem>
+            <MudItem xs=12>
+                <MudText><i>Warning : this cannot  be undone.</i></MudText>
+            </MudItem>
+        </MudGrid>
     </DialogContent>
     <DialogActions>
         <MudButton OnClick="Cancel">Cancel</MudButton>