[Hosts]Add delete entry button and fix focusing issue (#31418)

* [Hosts] Add delete entry button
Fix focusing issue when clicking toggle switch or delete button

* fix button accessibility

* address feedback

---------

Co-authored-by: Davide Giacometti <davide.giacometti@outlook.it>

src/modules/Hosts/Hosts/HostsXAML/Views/MainPage.xaml

@@ -265,6 +265,9 @@
                                 <!--  Duplicate  -->
                                 <ColumnDefinition Width="Auto" />
                                 <!--  ToggleSwitch  -->
+                                <ColumnDefinition Width="Auto" />
+                                <!--  DeleteEntry  -->
+                                <ColumnDefinition Width="Auto" />
                             </Grid.ColumnDefinitions>
                             <TextBlock
                                 Grid.Column="0"
@@ -348,9 +351,20 @@
                                 Width="40"
                                 MinWidth="0"
                                 HorizontalAlignment="Right"
+                                GotFocus="Entries_GotFocus"
                                 IsOn="{x:Bind Active, Mode=TwoWay}"
                                 OffContent=""
                                 OnContent="" />
+                            <Button
+                                x:Uid="DeleteEntryBtn"
+                                Grid.Column="5"
+                                Height="32"
+                                Click="Delete_Click"
+                                CommandParameter="{x:Bind (models:Entry)}"
+                                Content="{ui:FontIcon Glyph=&#xE74D;,
+                                                      FontSize=16}"
+                                GotFocus="Entries_GotFocus"
+                                Style="{StaticResource SubtleButtonStyle}" />
                         </Grid>
                     </DataTemplate>
                 </ListView.ItemTemplate>

src/modules/Hosts/Hosts/HostsXAML/Views/MainPage.xaml.cs

@@ -55,13 +55,14 @@ namespace Hosts.Views
 
         private async void Entries_ItemClick(object sender, ItemClickEventArgs e)
         {
-            await ShowEditDialogAsync(e.ClickedItem as Entry);
+            Entry entry = e.ClickedItem as Entry;
+            ViewModel.Selected = entry;
+            await ShowEditDialogAsync(entry);
         }
 
         public async Task ShowEditDialogAsync(Entry entry)
         {
             var resourceLoader = Helpers.ResourceLoaderInstance.ResourceLoader;
-            ViewModel.Selected = entry;
             EntryDialog.Title = resourceLoader.GetString("UpdateEntry_Title");
             EntryDialog.PrimaryButtonText = resourceLoader.GetString("UpdateBtn");
             EntryDialog.PrimaryButtonCommand = UpdateCommand;
@@ -179,10 +180,16 @@ namespace Hosts.Views
         /// </summary>
         private void Entries_GotFocus(object sender, RoutedEventArgs e)
         {
-            var listView = sender as ListView;
+            var element = sender as FrameworkElement;
-            if (listView.SelectedItem == null && listView.Items.Count > 0)
+            var entry = element.DataContext as Entry;
+
+            if (entry != null)
             {
-                listView.SelectedIndex = 0;
+                ViewModel.Selected = entry;
+            }
+            else if (Entries.SelectedItem == null && Entries.Items.Count > 0)
+            {
+                Entries.SelectedIndex = 0;
             }
         }
 

src/modules/Hosts/Hosts/Strings/en-us/Resources.resw

@@ -193,6 +193,13 @@
   <data name="DeleteDialogAreYouSure.Text" xml:space="preserve">
     <value>Are you sure you want to delete this entry?</value>
   </data>
+  <data name="DeleteEntryBtn.[using:Microsoft.UI.Xaml.Automation]AutomationProperties.Name" xml:space="preserve">
+    <value>Delete</value>
+  </data>
+  <data name="DeleteEntryBtn.[using:Microsoft.UI.Xaml.Controls]ToolTipService.ToolTip" xml:space="preserve">
+    <value>Delete (Delete)</value>
+    <comment>"Delete" between parentheses refers to the Delete keyboard key</comment>
+  </data>
   <data name="Duplicate.Text" xml:space="preserve">
     <value>Duplicate</value>
     <comment>Refers to the action of duplicate an existing entry</comment>

src/modules/Hosts/Hosts/ViewModels/MainViewModel.cs

@@ -153,6 +153,19 @@ namespace Hosts.ViewModels
             _entries.Move(oldIndex, newIndex);
         }
 
+        [RelayCommand]
+        public void DeleteEntry(Entry entry)
+        {
+            if (entry is not null)
+            {
+                var address = entry.Address;
+                var hosts = entry.SplittedHosts;
+                _entries.Remove(entry);
+
+                FindDuplicates(address, hosts);
+            }
+        }
+
         [RelayCommand]
         public void ReadHosts()
         {