SLVS-1512 Improve UX (#5742)

SonarSource · Oct 17, 2024 · 86cf0ad · 86cf0ad
1 parent f445b8f
commit 86cf0ad
Show file tree

Hide file tree

Showing 5 changed files with 70 additions and 12 deletions.
diff --git a/src/ConnectedMode.UnitTests/UI/ProjectSelection/ProjectSelectionViewModelTests.cs b/src/ConnectedMode.UnitTests/UI/ProjectSelection/ProjectSelectionViewModelTests.cs
@@ -165,6 +165,7 @@ public void ProjectSearchTerm_RaisesEvents()
         viewModel.ProjectSearchTerm = searchTerm;
 
         eventHandler.Received().Invoke(viewModel, Arg.Is<PropertyChangedEventArgs>(x => x.PropertyName == nameof(viewModel.NoProjectExists)));
+        eventHandler.Received().Invoke(viewModel, Arg.Is<PropertyChangedEventArgs>(x => x.PropertyName == nameof(viewModel.HasSearchTerm)));
     }
 
     [TestMethod]
@@ -277,6 +278,27 @@ public async Task AdapterGetAllProjectsAsync_ReturnsResponseFromAdapter(bool exp
         response.ResponseData.Should().BeEquivalentTo(expectedServerProjects);
     }
 
+    [TestMethod]
+    [DataRow(null)]
+    [DataRow("")]
+    public void ProjectSearchTerm_SearchTermNullOrEmpty_ReturnsFalse(string searchTerm)
+    {
+        testSubject.ProjectSearchTerm = searchTerm;
+
+        testSubject.HasSearchTerm.Should().BeFalse();
+    }
+
+    [TestMethod]
+    [DataRow("abc")]
+    [DataRow(" ")]
+    [DataRow("\t")]
+    public void ProjectSearchTerm_SearchTermNotNullNorEmpty_ReturnsTrue(string searchTerm)
+    {
+        testSubject.ProjectSearchTerm = searchTerm;
+
+        testSubject.HasSearchTerm.Should().BeTrue();
+    }
+
     private void MockInitializedProjects(List<ServerProject> serverProjects)
     {
         testSubject.InitProjects(new AdapterResponseWithData<List<ServerProject>>(true, serverProjects));

diff --git a/src/ConnectedMode/UI/ProjectSelection/ProjectSelectionDialog.xaml b/src/ConnectedMode/UI/ProjectSelection/ProjectSelectionDialog.xaml
@@ -4,6 +4,8 @@
         xmlns:res="clr-namespace:SonarLint.VisualStudio.ConnectedMode.UI.Resources"
         xmlns:ui="clr-namespace:SonarLint.VisualStudio.ConnectedMode.UI"
         xmlns:wpf="clr-namespace:SonarLint.VisualStudio.Core.WPF;assembly=SonarLint.VisualStudio.Core"
+        xmlns:vsimagecatalog="clr-namespace:Microsoft.VisualStudio.Imaging;assembly=Microsoft.VisualStudio.ImageCatalog"
+        xmlns:imaging="clr-namespace:Microsoft.VisualStudio.Imaging;assembly=Microsoft.VisualStudio.Imaging"
         Title="{x:Static res:UiResources.ProjectSelectionDialogTitle}"
         WindowStartupLocation="CenterOwner"
         Loaded="ProjectSelectionDialog_OnLoaded"
@@ -52,34 +54,54 @@
             <TextBlock Grid.Row="0" Grid.Column="0" Text="{x:Static res:UiResources.ExistingProjectsLabel}" Style="{StaticResource HeaderTextBlock}"
                        Margin="0,10"/>
             <TextBox Grid.Row="1"
+                     x:Name="ProjectSearchTextBox"
                      VerticalAlignment="Top"
-                     Text="{Binding ProjectSearchTerm, UpdateSourceTrigger=PropertyChanged}" />
-            <TextBlock Grid.Row="1" IsHitTestVisible="False"
-                       Text="{x:Static res:UiResources.SearchForProjectPlaceholder}" VerticalAlignment="Center"
-                       HorizontalAlignment="Left" Margin="5,0,0,0" Foreground="DarkGray">
-                <TextBlock.Style>
-                    <Style TargetType="{x:Type TextBlock}">
+                     Text="{Binding ProjectSearchTerm, UpdateSourceTrigger=PropertyChanged, Delay=500}" />
+            <StackPanel Grid.Row="1" Orientation="Horizontal" VerticalAlignment="Center">
+                <StackPanel.Style>
+                    <Style TargetType="{x:Type StackPanel}">
                         <Setter Property="Visibility" Value="Collapsed" />
                         <Style.Triggers>
                             <DataTrigger Binding="{Binding Text, ElementName=ProjectSearchTextBox}" Value="">
                                 <Setter Property="Visibility" Value="Visible" />
                             </DataTrigger>
                         </Style.Triggers>
                     </Style>
-                </TextBlock.Style>
-            </TextBlock>
+                </StackPanel.Style>
+                <imaging:CrispImage IsHitTestVisible="False" 
+                                    Width="16" Height="16" Moniker="{x:Static vsimagecatalog:KnownMonikers.Search}" 
+                                    HorizontalAlignment="Left" Margin="5,0,0,0"/>
+                <TextBlock IsHitTestVisible="False"
+                           Text="{x:Static res:UiResources.SearchForProjectPlaceholder}"
+                           HorizontalAlignment="Left" Margin="5,0,0,0" Foreground="DarkGray" />
+            </StackPanel>
 
             <ListBox Grid.Row="2"
                      Margin="0, 10, 0, 10"
                      ItemsSource="{Binding ProjectResults}"
                      SelectedItem="{Binding SelectedProject}"
-                     ItemTemplate="{StaticResource NameAndKeyListBoxItem}" />
+                     ItemTemplate="{StaticResource NameAndKeyListBoxItem}" 
+                     VirtualizingPanel.IsVirtualizing="True" 
+                     ScrollViewer.CanContentScroll="True"/>
 
-            <TextBlock Grid.Row="2" VerticalAlignment="Center" HorizontalAlignment="Center" Text="{x:Static res:UiResources.NoProjectsExistLabel}" 
-                       Visibility="{Binding Path=NoProjectExists, Converter={StaticResource TrueToVisibleConverter}}"/>
+            <TextBlock Grid.Row="2" VerticalAlignment="Center" HorizontalAlignment="Center"
+                       Visibility="{Binding Path=NoProjectExists, Converter={StaticResource TrueToVisibleConverter}}">
+                <TextBlock.Style>
+                    <Style TargetType="{x:Type TextBlock}">
+                        <Style.Triggers>
+                            <DataTrigger Binding="{Binding Path=HasSearchTerm}" Value="True">
+                                <Setter Property="Text" Value="{x:Static res:UiResources.NoProjectsFoundForSearchTermLabel}" />
+                            </DataTrigger>
+                            <DataTrigger Binding="{Binding Path=HasSearchTerm}" Value="False">
+                                <Setter Property="Text" Value="{x:Static res:UiResources.NoProjectsExistLabel}" />
+                            </DataTrigger>
+                        </Style.Triggers>
+                    </Style>
+                </TextBlock.Style>
+            </TextBlock>
         </Grid>
 
-        <ui:ProgressAndErrorHandlerComponent Grid.Row="3" Grid.ColumnSpan="3" Margin="0,10" ProgressReporterViewModel="{Binding Path=ProgressReporterViewModel}"/>
+        <ui:ProgressAndErrorHandlerComponent Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="3" Margin="0,10" ProgressReporterViewModel="{Binding Path=ProgressReporterViewModel}"/>
 
         <Button Grid.Column="1" Grid.Row="4" Content="{x:Static res:UiResources.SelectButton}"
                 HorizontalAlignment="Right"

diff --git a/src/ConnectedMode/UI/ProjectSelection/ProjectSelectionViewModel.cs b/src/ConnectedMode/UI/ProjectSelection/ProjectSelectionViewModel.cs
@@ -38,6 +38,7 @@ public class ProjectSelectionViewModel(
     public IProgressReporterViewModel ProgressReporterViewModel { get; } = progressReporterViewModel;
 
     public bool NoProjectExists => ProjectResults.Count == 0;
+    public bool HasSearchTerm => !string.IsNullOrEmpty(ProjectSearchTerm);
 
     public string ProjectSearchTerm
     {
@@ -47,6 +48,7 @@ public string ProjectSearchTerm
             projectSearchTerm = value;
             SearchForProject();
             RaisePropertyChanged();
+            RaisePropertyChanged(nameof(HasSearchTerm));
         }
     }
 

diff --git a/src/ConnectedMode/UI/Resources/UiResources.Designer.cs b/src/ConnectedMode/UI/Resources/UiResources.Designer.cs
diff --git a/src/ConnectedMode/UI/Resources/UiResources.resx b/src/ConnectedMode/UI/Resources/UiResources.resx
@@ -413,4 +413,7 @@ Please manually add the credentials for the connection and then try again.</valu
   <data name="SearchingProjectInProgressText" xml:space="preserve">
     <value>Searching for project...</value>
   </data>
+  <data name="NoProjectsFoundForSearchTermLabel" xml:space="preserve">
+    <value>Your search did not match any project</value>
+  </data>
 </root>