DYN-8906 : introduce autocomplete search combo (#16256)

BogdanZavu · zavub · web-flow · commit 4da62ba32800 · 2025-06-03T17:49:29.000-04:00
Co-authored-by: Bogdan Zavu &lt;bogdan.zavu@autodesk.com&gt;
diff --git a/src/DynamoCoreWpf/UI/Themes/Modern/DynamoConverters.xaml b/src/DynamoCoreWpf/UI/Themes/Modern/DynamoConverters.xaml
@@ -120,6 +120,7 @@
     <controls:LibraryTreeItemsHostVisibilityConverter x:Key="LibraryTreeItemsHostVisibilityConverter" />
     <controls:NullValueToCollapsedConverter x:Key="NullValueToCollapsedConverter" />
     <controls:NullValueToGridRow1Converter x:Key="NullValueToGridRow1Converter" />
+    <controls:NullToVisibiltyConverter x:Key="NullToVisibiltyConverter" />
     <controls:SearchHighlightMarginConverter x:Key="SearchHighlightMarginConverter" />
     <controls:ConfidenceScoreFormattingConverter x:Key="ConfidenceScoreFormattingConverter" />
     <controls:InOutParamTypeConverter x:Key="InOutParamTypeConverter" />
diff --git a/src/DynamoCoreWpf/UI/Themes/Modern/DynamoModern.xaml b/src/DynamoCoreWpf/UI/Themes/Modern/DynamoModern.xaml
@@ -487,7 +487,14 @@
                                         BorderBrush="{DynamicResource MidLightBlueBrush}"
                                         BorderThickness="0,6,0,0" />
                                 <ScrollViewer Margin="0,6,0,6" SnapsToDevicePixels="True">
-                                    <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
+                                    <StackPanel KeyboardNavigation.DirectionalNavigation="Contained">
+                                        <ContentControl x:Name="SearchSlot"
+                                            Content="{TemplateBinding Tag}"
+                                            Visibility="{Binding Content, RelativeSource={RelativeSource Self}, Converter={StaticResource NullToVisibiltyConverter}}"
+                                        />
+
+                                        <StackPanel IsItemsHost="True" />
+                                    </StackPanel>
                                 </ScrollViewer>
                             </Grid>
                         </Popup>
diff --git a/src/NodeAutoCompleteViewExtension/ViewModels/NodeAutoCompleteBarViewModel.cs b/src/NodeAutoCompleteViewExtension/ViewModels/NodeAutoCompleteBarViewModel.cs
@@ -31,7 +31,8 @@
 using Dynamo.Graph.Workspaces;
 using Dynamo.Graph;
 using System.Windows.Media;
-using Dynamo.Selection;
+using System.ComponentModel;
+using System.Windows.Data;
 
 namespace Dynamo.NodeAutoComplete.ViewModels
 {
@@ -127,7 +128,7 @@ public bool HideAutocompleteMethodOptions
         /// <summary>
         /// Cluster autocomplete search results.
         /// </summary>
-        public IEnumerable<DNADropdownViewModel> DropdownResults
+        internal IEnumerable<DNADropdownViewModel> DropdownResults
         {
             get
             {
@@ -136,16 +137,27 @@ public IEnumerable<DNADropdownViewModel> DropdownResults
             set
             {
                 dropdownResults = value;
-                RaisePropertyChanged(nameof(DropdownResults));
+                FilteredView = CollectionViewSource.GetDefaultView(dropdownResults);
+                if (FilteredView != null)
+                {
+                    FilteredView.Filter = FilterLogic;
+                }
+
                 RaisePropertyChanged(nameof(NthofTotal));
                 RaisePropertyChanged(nameof(ResultsLoaded));
                 RaisePropertyChanged(nameof(SwitchIsEnabled));
                 RaisePropertyChanged(nameof(ConfirmSource));
                 RaisePropertyChanged(nameof(PreviousSource));
                 RaisePropertyChanged(nameof(NextSource));
+                RaisePropertyChanged(nameof(FilteredView));
             }
         }
 
+        /// <summary>
+        /// Return the filter associated currently with dropdown results.
+        /// </summary>
+        public ICollectionView FilteredView { get; set; }
+                
         /// <summary>
         /// Return the qualified results from the ML service above preferred confidence threshold
         /// </summary>
@@ -182,6 +194,46 @@ public bool IsOpen
         private int ClusterResultsCount => DropdownResults == null ? 0 : DropdownResults.Count();
 
         private int selectedIndex = 0;
+
+        private string _searchInput = string.Empty;
+
+        private bool FilterLogic(object item)
+        {
+            var dnaModel = item as DNADropdownViewModel;
+            if (dnaModel != null)
+            {
+                if (dnaModel.Description.IndexOf(SearchInput.Trim(), StringComparison.OrdinalIgnoreCase) >= 0)
+                {
+                    return true;
+                }
+                return false;
+            }
+
+            return true;
+        }
+
+        public string SearchInput
+        {
+            get
+            {
+                return _searchInput;
+            }
+            set
+            {
+                if (_searchInput == value)
+                {
+                    return;
+                }
+
+                _searchInput = value;
+
+                if (FilteredView != null)
+                {                    
+                    FilteredView.Refresh();
+                }
+            }
+        }
+
         /// <summary>
         /// Selected index of the current cluster autocomplete option
         /// </summary>
diff --git a/src/NodeAutoCompleteViewExtension/Views/NodeAutoCompleteBarView.xaml b/src/NodeAutoCompleteViewExtension/Views/NodeAutoCompleteBarView.xaml
@@ -149,14 +149,33 @@
                             x:Name="AutocompleteCombobox"
                             SelectedIndex="{Binding SelectedIndex, Mode=TwoWay}"
                             Width="240"
-                            ItemsSource="{Binding DropdownResults, NotifyOnTargetUpdated=True}"
+                            FontFamily="{StaticResource ArtifaktElementRegular}"
+                            Foreground="{StaticResource DefaultSearchTextBlockText}"
+                            ItemsSource="{Binding FilteredView, NotifyOnTargetUpdated=True}"
                             Visibility="{Binding ResultsLoaded, UpdateSourceTrigger=PropertyChanged, Converter={StaticResource BooleanToVisibilityConverter}}"
                             TabIndex="0"
                         >
                             <ComboBox.Style>
                                 <Style BasedOn="{StaticResource PackageManagerSmallComboBox}" TargetType="ComboBox">
                                 </Style>
                             </ComboBox.Style>
+                            <ComboBox.Tag>
+                                <TextBox x:Name="AutoCompleteSearchBox"                                            
+                                    HorizontalAlignment="Stretch"
+                                    Height="24"
+                                    Margin="16,5,16,5"
+                                    Padding="2"                                                 
+                                    Width="Auto"                                    
+                                    Foreground="{Binding Foreground, RelativeSource={RelativeSource AncestorType=ComboBox}}"
+                                    Background="{Binding Background, RelativeSource={RelativeSource AncestorType=ComboBox}}"
+                                    FontFamily="{Binding FontFamily, RelativeSource={RelativeSource AncestorType=ComboBox}}"
+                                    CaretBrush="{Binding Foreground, RelativeSource={RelativeSource AncestorType=ComboBox}}"
+                                    FontSize="14">
+                                    <TextBox.Text>
+                                        <Binding Path="SearchInput" Mode="OneWayToSource" UpdateSourceTrigger="PropertyChanged" />
+                                    </TextBox.Text>
+                                </TextBox>
+                            </ComboBox.Tag>
                             <ComboBox.ItemTemplate>
                                 <DataTemplate>
                                     <StackPanel Orientation="Horizontal" Margin="0" Height="34" VerticalAlignment="Center">
