[Hosts]Add delete entry button and fix focusing issue (microsoft#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>
jefflord · Feb 14, 2024 · 1e47914 · 1e47914
1 parent 76de196
commit 1e47914
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 5 deletions.
diff --git a/src/modules/Hosts/Hosts/HostsXAML/Views/MainPage.xaml b/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>

diff --git a/src/modules/Hosts/Hosts/HostsXAML/Views/MainPage.xaml.cs b/src/modules/Hosts/Hosts/HostsXAML/Views/MainPage.xaml.cs
@@ -55,13 +55,14 @@ private async Task OpenAdditionalLinesDialogAsync()
 
         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 @@ private void ReorderButtonDown_Click(object sender, RoutedEventArgs e)
         /// </summary>
         private void Entries_GotFocus(object sender, RoutedEventArgs e)
         {
-            var listView = sender as ListView;
-            if (listView.SelectedItem == null && listView.Items.Count > 0)
+            var element = sender as FrameworkElement;
+            var entry = element.DataContext as Entry;
+
+            if (entry != null)
+            {
+                ViewModel.Selected = entry;
+            }
+            else if (Entries.SelectedItem == null && Entries.Items.Count > 0)
             {
-                listView.SelectedIndex = 0;
+                Entries.SelectedIndex = 0;
             }
         }
 

diff --git a/src/modules/Hosts/Hosts/Strings/en-us/Resources.resw b/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>

diff --git a/src/modules/Hosts/Hosts/ViewModels/MainViewModel.cs b/src/modules/Hosts/Hosts/ViewModels/MainViewModel.cs
@@ -153,6 +153,19 @@ public void Move(int oldIndex, int newIndex)
             _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()
         {