Skip to content

Code Quality: Improved tooltip UX in BreadcrumbBar #17277

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Jul 21, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -21,5 +21,8 @@ public partial class BreadcrumbBar : Control

[GeneratedDependencyProperty]
public partial string? RootItemToolTip { get; set; }

[GeneratedDependencyProperty]
public partial string? RootItemChevronToolTip { get; set; }
}
}
1 change: 1 addition & 0 deletions src/Files.App.Controls/BreadcrumbBar/BreadcrumbBar.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,7 @@
x:Name="PART_RootBreadcrumbBarItem"
Grid.Column="0"
Padding="{StaticResource BreadcrumbBarRootItemPadding}"
ChevronToolTip="{TemplateBinding RootItemChevronToolTip}"
CornerRadius="{StaticResource BreadcrumbBarRootItemCornerRadius}"
ItemToolTip="{TemplateBinding RootItemToolTip}">
<ContentPresenter Content="{Binding RootItem, RelativeSource={RelativeSource TemplatedParent}, Mode=OneWay}" />
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,10 @@ public partial class BreadcrumbBarItem
public partial bool IsLastItem { get; set; }

[GeneratedDependencyProperty]
public partial string ItemToolTip { get; set; }
public partial string? ItemToolTip { get; set; }

[GeneratedDependencyProperty]
public partial string ChevronToolTip { get; set; }
public partial string? ChevronToolTip { get; set; }

partial void OnIsEllipsisChanged(bool newValue)
{
Expand Down
2 changes: 2 additions & 0 deletions src/Files.App.Controls/Omnibar/Omnibar.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -131,6 +131,8 @@
Width="{StaticResource OmnibarModeDefaultClickAreaWidth}"
Height="{StaticResource OmnibarModeDefaultHeight}"
Margin="1"
AutomationProperties.AccessibilityView="Content"
AutomationProperties.Name="{Binding ModeName, RelativeSource={RelativeSource TemplatedParent}, Mode=OneWay}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="0"
Expand Down
2 changes: 2 additions & 0 deletions src/Files.App/Data/Items/PathBoxItem.cs
Original file line number Diff line number Diff line change
Expand Up @@ -8,5 +8,7 @@ public sealed class PathBoxItem
public string? Title { get; set; }

public string? Path { get; set; }

public string? ChevronToolTip { get; set; }
}
}
5 changes: 4 additions & 1 deletion src/Files.App/Strings/en-US/Resources.resw
Original file line number Diff line number Diff line change
Expand Up @@ -4259,7 +4259,10 @@
<value>Show collapsed path breadcrumbs</value>
</data>
<data name="BreadcrumbBarChevronButtonToolTip" xml:space="preserve">
<value>Show child folders</value>
<value>Show folders in {0}</value>
</data>
<data name="BreadcrumbBarRootChevronButtonToolTip" xml:space="preserve">
<value>Show folders in Home</value>
</data>
<data name="NoCommandsFound" xml:space="preserve">
<value>There are no commands containing {0}</value>
Expand Down
3 changes: 2 additions & 1 deletion src/Files.App/UserControls/NavigationToolbar.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -366,6 +366,7 @@
ItemDropDownFlyoutClosed="BreadcrumbBar_ItemDropDownFlyoutClosed"
ItemDropDownFlyoutOpening="BreadcrumbBar_ItemDropDownFlyoutOpening"
ItemsSource="{x:Bind ViewModel.PathComponents, Mode=OneWay}"
RootItemChevronToolTip="{helpers:ResourceString Name=BreadcrumbBarRootChevronButtonToolTip}"
RootItemToolTip="{helpers:ResourceString Name=Home}">
<controls:BreadcrumbBar.RootItem>
<Image
Expand All @@ -379,7 +380,7 @@
AllowDrop="True"
AutomationProperties.AccessibilityView="Content"
AutomationProperties.Name="{x:Bind Title, Mode=OneWay}"
ChevronToolTip="{helpers:ResourceString Name=BreadcrumbBarChevronButtonToolTip}"
ChevronToolTip="{x:Bind ChevronToolTip, Mode=OneWay}"
Content="{x:Bind Title, Mode=OneWay}"
DataContext="{x:Bind}"
DragLeave="BreadcrumbBarItem_DragLeave"
Expand Down
5 changes: 4 additions & 1 deletion src/Files.App/Utils/Storage/Helpers/StorageFileExtensions.cs
Original file line number Diff line number Diff line change
Expand Up @@ -152,6 +152,8 @@ public static async Task<List<PathBoxItem>> GetDirectoryPathComponentsWithDispla
if (!string.IsNullOrEmpty(folder?.DisplayName))
item.Title = folder.DisplayName;
}

item.ChevronToolTip = string.Format(Strings.BreadcrumbBarChevronButtonToolTip.GetLocalizedResource(), item.Title);
}

return pathBoxItems;
Expand Down Expand Up @@ -321,7 +323,8 @@ private static PathBoxItem GetPathItem(string component, string path)
return new PathBoxItem()
{
Title = title,
Path = path
Path = path,
ChevronToolTip = string.Format(Strings.BreadcrumbBarChevronButtonToolTip.GetLocalizedResource(), title),
};
}

Expand Down
1 change: 1 addition & 0 deletions src/Files.App/Views/HomePage.xaml.cs
Original file line number Diff line number Diff line change
Expand Up @@ -69,6 +69,7 @@ protected override async void OnNavigatedTo(NavigationEventArgs e)
{
Title = componentLabel,
Path = tag,
ChevronToolTip = string.Format(Strings.BreadcrumbBarChevronButtonToolTip.GetLocalizedResource(), componentLabel),
};

AppInstance.ToolbarViewModel.PathComponents.Add(item);
Expand Down
1 change: 1 addition & 0 deletions src/Files.App/Views/ReleaseNotesPage.xaml.cs
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,7 @@ protected override async void OnNavigatedTo(NavigationEventArgs e)
{
Title = componentLabel,
Path = tag,
ChevronToolTip = string.Format(Strings.BreadcrumbBarChevronButtonToolTip.GetLocalizedResource(), componentLabel),
};

AppInstance.ToolbarViewModel.PathComponents.Add(item);
Expand Down
8 changes: 7 additions & 1 deletion src/Files.App/Views/Shells/BaseShellPage.cs
Original file line number Diff line number Diff line change
Expand Up @@ -481,7 +481,13 @@ public async Task UpdatePathUIToWorkingDirectoryAsync(string newWorkingDir, stri
// Clear the path UI
ToolbarViewModel.PathComponents.Clear();
ToolbarViewModel.IsSingleItemOverride = true;
ToolbarViewModel.PathComponents.Add(new PathBoxItem() { Path = null, Title = singleItemOverride });
ToolbarViewModel.PathComponents.Add(
new()
{
Path = null,
Title = singleItemOverride,
ChevronToolTip = string.Format(Strings.BreadcrumbBarChevronButtonToolTip.GetLocalizedResource(), singleItemOverride),
});
}
}

Expand Down
6 changes: 3 additions & 3 deletions tests/Files.App.UITests/Views/OmnibarPage.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -52,11 +52,11 @@
<controls:OmnibarMode
IconOnActive="{controls:ThemedIconMarkup Style={StaticResource App.ThemedIcons.Omnibar.Commands}, IsFilled=True}"
IconOnInactive="{controls:ThemedIconMarkup Style={StaticResource App.ThemedIcons.Omnibar.Commands}, IconType=Outline}"
ItemsSource="{x:Bind Omnibar1_PaletteSuggestions, Mode=OneWay}"
ModeName="Palette"
PlaceholderText="Enter a palette command..."
SuggestionItemsSource="{x:Bind Omnibar1_PaletteSuggestions, Mode=OneWay}"
TextMemberPath="{x:Bind Omnibar1_TextMemberPathForPaletteMode}">
<controls:OmnibarMode.SuggestionItemTemplate>
<controls:OmnibarMode.ItemTemplate>
<DataTemplate x:DataType="data:OmnibarPaletteSuggestionItem">
<Grid Height="48" ColumnSpacing="12">
<Grid.ColumnDefinitions>
Expand Down Expand Up @@ -90,7 +90,7 @@
</StackPanel>
</Grid>
</DataTemplate>
</controls:OmnibarMode.SuggestionItemTemplate>
</controls:OmnibarMode.ItemTemplate>
</controls:OmnibarMode>

<controls:OmnibarMode
Expand Down
Loading