Skip to content

Commit 57f0a0b

Browse files
ferrariofilippoferrariofilippo
authored
Feature: Updated the edit tags button in the Details Pane (#12978)
1 parent 0f25af8 commit 57f0a0b

File tree

4 files changed

+129
-40
lines changed

4 files changed

+129
-40
lines changed

‎src/Files.App/Data/Items/TagsListItem.cs

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
// Copyright (c) 2023 Files Community
2+
// Licensed under the MIT License. See the LICENSE.
3+
4+
using Microsoft.UI.Xaml.Controls;
5+
6+
namespace Files.App.Data.Items
7+
{
8+
9+
public class TagsListItem
10+
{
11+
public bool IsTag
12+
=> this is TagItem;
13+
14+
public TagItem? AsTag
15+
=> this as TagItem;
16+
17+
public bool IsFlyout
18+
=> this is FlyoutItem;
19+
20+
public FlyoutItem? AsFlyout
21+
=> this as FlyoutItem;
22+
}
23+
24+
public class TagItem : TagsListItem
25+
{
26+
public TagViewModel Tag { get; set; }
27+
28+
public TagItem(TagViewModel tag)
29+
{
30+
Tag = tag;
31+
}
32+
}
33+
34+
public class FlyoutItem : TagsListItem
35+
{
36+
public MenuFlyout Flyout { get; set; }
37+
38+
public FlyoutItem(MenuFlyout flyout)
39+
{
40+
Flyout = flyout;
41+
}
42+
}
43+
}

‎src/Files.App/ResourceDictionaries/PathIcons.xaml

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -115,6 +115,42 @@
115115

116116
<x:String x:Key="ColorIconFilledTag">M15.9918 3.0252C15.9902 1.9269 15.1032 1.03539 14.0049 1.02819L9.11457 0.996137C8.58049 0.992636 8.06719 1.2029 7.68905 1.58008L1.00751 8.24461C0.224764 9.02537 0.223956 10.2931 1.00571 11.0748L5.9541 16.0232C6.73515 16.8043 8.00148 16.8043 8.78253 16.0232L15.4133 9.39243C15.7891 9.01663 15.9999 8.50672 15.9991 7.97527L15.9918 3.0252ZM11.9853 5.99203C11.4331 5.99203 10.9853 5.54432 10.9853 4.99203C10.9853 4.43975 11.4331 3.99203 11.9853 3.99203C12.5376 3.99203 12.9853 4.43975 12.9853 4.99203C12.9853 5.54432 12.5376 5.99203 11.9853 5.99203Z</x:String>
117117

118+
<Style x:Key="ColorIconTags" TargetType="local:OpacityIcon">
119+
<Setter Property="Template">
120+
<Setter.Value>
121+
<ControlTemplate>
122+
<Viewbox Stretch="Fill">
123+
<Grid Width="16" Height="16">
124+
<Path
125+
x:Name="Path1"
126+
Data="M8.41399 1.29289C8.60152 1.10536 8.85588 1 9.12109 1H12.9998C13.5521 1 13.9998 1.44772 13.9998 2V5.87868C13.9998 6.1439 13.8944 6.39825 13.7069 6.58579L8.20688 12.0858C7.81636 12.4763 7.18319 12.4763 6.79267 12.0858L2.91399 8.20711C2.52346 7.81658 2.52346 7.18342 2.91399 6.79289L8.41399 1.29289ZM11.5 4.5C12.0523 4.5 12.5 4.05228 12.5 3.5C12.5 2.94772 12.0523 2.5 11.5 2.5C10.9477 2.5 10.5 2.94772 10.5 3.5C10.5 4.05228 10.9477 4.5 11.5 4.5Z"
127+
Fill="{ThemeResource IconAltBrush}" />
128+
<Path
129+
x:Name="Path2"
130+
Data="M11.5 4.5C12.0523 4.5 12.5 4.05228 12.5 3.5C12.5 2.94772 12.0523 2.5 11.5 2.5C10.9477 2.5 10.5 2.94772 10.5 3.5C10.5 4.05228 10.9477 4.5 11.5 4.5Z"
131+
Fill="{ThemeResource IconBaseBrush}" />
132+
<Path
133+
x:Name="Path3"
134+
Data="M7.70688 0.585786C8.08195 0.210714 8.59066 0 9.12109 0H12.9998C14.1043 0 14.9998 0.895431 14.9998 2V5.87868C14.9998 6.40911 14.7891 6.91782 14.414 7.29289L8.91399 12.7929C8.13294 13.5739 6.86661 13.5739 6.08556 12.7929L2.20688 8.91421C1.42583 8.13317 1.42583 6.86684 2.20688 6.08579L7.70688 0.585786ZM9.12109 1C8.85588 1 8.60152 1.10536 8.41399 1.29289L2.91399 6.79289C2.52346 7.18342 2.52346 7.81658 2.91399 8.20711L6.79267 12.0858C7.18319 12.4763 7.81636 12.4763 8.20688 12.0858L13.7069 6.58579C13.8944 6.39825 13.9998 6.1439 13.9998 5.87868V2C13.9998 1.44772 13.5521 1 12.9998 1H9.12109Z"
135+
Fill="{ThemeResource IconBaseBrush}" />
136+
<Path
137+
x:Name="Path4"
138+
Data="M1.68825 9.8098C1.51125 10.4763 1.68413 11.2165 2.20688 11.7392L4.67135 14.2037C6.23344 15.7658 8.7661 15.7658 10.3282 14.2037L14.414 10.1179C14.7891 9.74283 14.9998 9.23412 14.9998 8.70369V8.12132L9.62109 13.5C8.44952 14.6716 6.55003 14.6716 5.37845 13.5L1.68825 9.8098Z"
139+
Fill="{ThemeResource IconBaseBrush}" />
140+
</Grid>
141+
142+
<VisualStateManager.VisualStateGroups>
143+
<VisualStateGroup>
144+
<VisualState x:Name="Normal" />
145+
<VisualState x:Name="Disabled" />
146+
</VisualStateGroup>
147+
</VisualStateManager.VisualStateGroups>
148+
</Viewbox>
149+
</ControlTemplate>
150+
</Setter.Value>
151+
</Setter>
152+
</Style>
153+
118154
<Style x:Key="ColorIconEnterCompactOverlay" TargetType="local:OpacityIcon">
119155
<Setter Property="Template">
120156
<Setter.Value>

‎src/Files.App/UserControls/Pane/PreviewPane.xaml

Lines changed: 37 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,9 @@
77
xmlns:converters="using:CommunityToolkit.WinUI.UI.Converters"
88
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
99
xmlns:helpers="using:Files.App.Helpers"
10+
xmlns:items="using:Files.App.Data.Items"
1011
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
1112
xmlns:properties="using:Files.App.ViewModels.Properties"
12-
xmlns:tags="using:Files.Core.ViewModels.FileTags"
1313
xmlns:triggers="using:CommunityToolkit.WinUI.UI.Triggers"
1414
xmlns:usercontrols="using:Files.App.UserControls"
1515
x:Name="Root"
@@ -285,7 +285,7 @@
285285

286286
<GridView
287287
HorizontalAlignment="Stretch"
288-
ItemsSource="{x:Bind ViewModel.SelectedItem.FileTagsUI, Mode=OneWay}"
288+
ItemsSource="{x:Bind ViewModel.Items, Mode=OneWay}"
289289
SelectionMode="None">
290290
<GridView.ItemsPanel>
291291
<ItemsPanelTemplate>
@@ -294,45 +294,50 @@
294294
</GridView.ItemsPanel>
295295

296296
<GridView.ItemTemplate>
297-
<DataTemplate x:Name="TagTemplate" x:DataType="tags:TagViewModel">
298-
<StackPanel
299-
AutomationProperties.Name="{x:Bind Name, Mode=OneWay}"
300-
Orientation="Horizontal"
301-
Spacing="8"
302-
ToolTipService.ToolTip="{x:Bind Name, Mode=OneWay}">
303-
<PathIcon Data="{StaticResource ColorIconFilledTag}" Foreground="{x:Bind Color, Mode=OneWay}" />
304-
<TextBlock
305-
HorizontalAlignment="Stretch"
306-
Style="{StaticResource Local.FileDetailsTextBlockStyle}"
307-
Text="{x:Bind Name, Mode=OneWay}"
308-
TextTrimming="CharacterEllipsis" />
297+
<DataTemplate x:Name="TagTemplate" x:DataType="items:TagsListItem">
298+
<StackPanel>
299+
<StackPanel
300+
x:Name="DetailsTagItem"
301+
x:Load="{x:Bind IsTag, Mode=OneWay}"
302+
AutomationProperties.Name="{x:Bind AsTag.Tag.Name, Mode=OneWay}"
303+
Orientation="Horizontal"
304+
Spacing="8"
305+
ToolTipService.ToolTip="{x:Bind AsTag.Tag.Name, Mode=OneWay}">
306+
<PathIcon Data="{StaticResource ColorIconFilledTag}" Foreground="{x:Bind AsTag.Tag.Color, Mode=OneWay}" />
307+
<TextBlock
308+
HorizontalAlignment="Stretch"
309+
Style="{StaticResource Local.FileDetailsTextBlockStyle}"
310+
Text="{x:Bind AsTag.Tag.Name, Mode=OneWay}"
311+
TextTrimming="CharacterEllipsis" />
312+
</StackPanel>
313+
314+
<!-- Edit Tags Button -->
315+
<Button
316+
x:Name="DetailsEditTags"
317+
HorizontalAlignment="Left"
318+
x:Load="{x:Bind IsFlyout, Mode=OneWay}"
319+
AutomationProperties.Name="{helpers:ResourceString Name=EditTags}"
320+
Background="Transparent"
321+
BorderBrush="Transparent"
322+
Flyout="{x:Bind AsFlyout.Flyout, Mode=OneWay}"
323+
ToolTipService.ToolTip="{helpers:ResourceString Name=EditTags}">
324+
<Button.Content>
325+
<usercontrols:OpacityIcon
326+
Width="16"
327+
Height="16"
328+
Style="{StaticResource ColorIconTags}" />
329+
</Button.Content>
330+
</Button>
309331
</StackPanel>
310332
</DataTemplate>
311333
</GridView.ItemTemplate>
312334
</GridView>
313335
</StackPanel>
314336

315-
<!-- Edit Tags Button -->
316-
<Button
317-
x:Name="DetailsEditTags"
318-
Margin="8,0,8,8"
319-
HorizontalAlignment="Left"
320-
Flyout="{x:Bind ViewModel.TagsFlyout, Mode=OneWay}"
321-
ToolTipService.ToolTip="{helpers:ResourceString Name=EditTags}"
322-
Visibility="Collapsed">
323-
<Button.Content>
324-
<StackPanel Orientation="Horizontal" Spacing="8">
325-
<FontIcon FontSize="12" Glyph="&#xE8EC;" />
326-
<TextBlock Text="{helpers:ResourceString Name=EditTags}" />
327-
<FontIcon FontSize="12" Glyph="&#xE70D;" />
328-
</StackPanel>
329-
</Button.Content>
330-
</Button>
331-
332337
<!-- Open Properties Button -->
333338
<Button
334339
x:Name="DetailsOpenProperties"
335-
Margin="8,0,8,8"
340+
Margin="8,8,8,8"
336341
HorizontalAlignment="Left"
337342
Command="{x:Bind Commands.OpenProperties}"
338343
IsEnabled="{x:Bind Commands.OpenProperties.IsExecutable, Mode=OneWay}"
@@ -364,7 +369,6 @@
364369
<Setter Target="PreviewErrorText.Visibility" Value="Visible" />
365370
<Setter Target="PreviewErrorText.Text" Value="{x:Bind GetLocalizedResource('DetailsPanePreviewNotAvaliableText')}" />
366371
<Setter Target="FileDetailsRepeater.Visibility" Value="Visible" />
367-
<Setter Target="DetailsEditTags.Visibility" Value="Visible" />
368372
<Setter Target="DetailsOpenProperties.Visibility" Value="Visible" />
369373
<Setter Target="DetailsListHeader.Visibility" Value="Visible" />
370374
<Setter Target="PreviewControlPresenter.Visibility" Value="Collapsed" />
@@ -378,7 +382,6 @@
378382
<Setter Target="PreviewErrorText.Visibility" Value="Visible" />
379383
<Setter Target="PreviewErrorText.Text" Value="{x:Bind GetLocalizedResource('DetailsPanePreviewNotAvaliableText')}" />
380384
<Setter Target="FileDetailsRepeater.Visibility" Value="Collapsed" />
381-
<Setter Target="DetailsEditTags.Visibility" Value="Collapsed" />
382385
<Setter Target="DetailsOpenProperties.Visibility" Value="Collapsed" />
383386
<Setter Target="PreviewControlPresenter.Visibility" Value="Collapsed" />
384387
</VisualState.Setters>
@@ -390,7 +393,6 @@
390393
<VisualState.Setters>
391394
<Setter Target="PreviewErrorText.Visibility" Value="Collapsed" />
392395
<Setter Target="FileDetailsRepeater.Visibility" Value="Visible" />
393-
<Setter Target="DetailsEditTags.Visibility" Value="Visible" />
394396
<Setter Target="DetailsOpenProperties.Visibility" Value="Visible" />
395397
<Setter Target="PreviewControlPresenter.Visibility" Value="Visible" />
396398
<Setter Target="DetailsListHeader.Visibility" Value="Visible" />
@@ -403,7 +405,6 @@
403405
<VisualState.Setters>
404406
<Setter Target="PreviewErrorText.Visibility" Value="Collapsed" />
405407
<Setter Target="FileDetailsRepeater.Visibility" Value="Collapsed" />
406-
<Setter Target="DetailsEditTags.Visibility" Value="Collapsed" />
407408
<Setter Target="DetailsOpenProperties.Visibility" Value="Collapsed" />
408409
<Setter Target="DetailsListHeader.Visibility" Value="Visible" />
409410
<Setter Target="PreviewControlPresenter.Visibility" Value="Collapsed" />

‎src/Files.App/ViewModels/UserControls/PreviewPaneViewModel.cs

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
// Copyright (c) 2023 Files Community
22
// Licensed under the MIT License. See the LICENSE.
33

4-
using Files.App.Data.Contexts;
54
using Files.App.UserControls.FilePreviews;
65
using Files.App.ViewModels.Previews;
76
using Microsoft.UI.Xaml;
@@ -49,7 +48,7 @@ public ListedItem SelectedItem
4948

5049
if (SetProperty(ref selectedItem, value))
5150
{
52-
OnPropertyChanged(nameof(TagsFlyout));
51+
UpdateTagsItems();
5352
OnPropertyChanged(nameof(LoadTagsList));
5453

5554
if (value is not null)
@@ -88,8 +87,7 @@ public bool LoadTagsList
8887
PreviewPaneState is PreviewPaneStates.NoPreviewAvailable ||
8988
PreviewPaneState is PreviewPaneStates.PreviewAndDetailsAvailable;
9089

91-
public MenuFlyout TagsFlyout
92-
=> new Files.App.UserControls.Menus.FileTagsContextMenu(new List<ListedItem>() { SelectedItem });
90+
public ObservableCollection<TagsListItem> Items { get; } = new();
9391

9492
public PreviewPaneViewModel(IPreviewPaneSettingsService previewSettings, IContentPageContext contentPageContextService = null)
9593
{
@@ -374,6 +372,17 @@ private void SelectedItem_PropertyChanged(object? sender, PropertyChangedEventAr
374372
{
375373
if (e.PropertyName is nameof(ListedItem.HasTags))
376374
OnPropertyChanged(nameof(LoadTagsList));
375+
else if (e.PropertyName is nameof(ListedItem.FileTagsUI))
376+
UpdateTagsItems();
377+
}
378+
379+
private void UpdateTagsItems()
380+
{
381+
Items.Clear();
382+
383+
SelectedItem?.FileTagsUI?.ForEach(tag => Items.Add(new TagItem(tag)));
384+
385+
Items.Add(new FlyoutItem(new Files.App.UserControls.Menus.FileTagsContextMenu(new List<ListedItem>() { SelectedItem })));
377386
}
378387

379388
public void Dispose()

0 commit comments

Comments
 (0)