Feature: Redesigned the left-hand sidebar (#13052)

src/Files.App/App.xaml

@@ -13,9 +13,6 @@
 			<!--  Default list view item margin  -->
 			<x:Double x:Key="ListItemMargin">0</x:Double>
 
-			<!--  Default nav menu item height  -->
-			<x:Double x:Key="NavigationViewItemOnLeftMinHeight">32</x:Double>
-
 			<!--  Fix caption buttons background  -->
 			<SolidColorBrush x:Key="WindowCaptionBackground" Color="Transparent" />
 			<SolidColorBrush x:Key="WindowCaptionBackgroundDisabled" Color="Transparent" />
@@ -34,9 +31,8 @@
 
 				<!--  Styles for the custom icons  -->
 				<ResourceDictionary Source="/ResourceDictionaries/PathIcons.xaml" />
-
+				<ResourceDictionary Source="/ResourceDictionaries/SidebarResources.xaml" />
 				<ResourceDictionary Source="ms-appx:///ResourceDictionaries/App.Theme.TextBlockStyles.xaml" />
-
 				<ResourceDictionary>
 					<ResourceDictionary.ThemeDictionaries>
 						<ResourceDictionary x:Key="Light">

src/Files.App/Data/Commands/CommandCodes.cs

@@ -23,7 +23,6 @@ public enum CommandCodes
 		ToggleShowHiddenItems,
 		ToggleShowFileExtensions,
 		TogglePreviewPane,
-		ToggleSidebar,
 
 		// File System
 		CopyItem,

src/Files.App/Data/Commands/Manager/CommandManager.cs

@@ -51,7 +51,6 @@ public IRichCommand this[HotKey hotKey]
 		public IRichCommand ToggleShowHiddenItems => commands[CommandCodes.ToggleShowHiddenItems];
 		public IRichCommand ToggleShowFileExtensions => commands[CommandCodes.ToggleShowFileExtensions];
 		public IRichCommand TogglePreviewPane => commands[CommandCodes.TogglePreviewPane];
-		public IRichCommand ToggleSidebar => commands[CommandCodes.ToggleSidebar];
 		public IRichCommand SelectAll => commands[CommandCodes.SelectAll];
 		public IRichCommand InvertSelection => commands[CommandCodes.InvertSelection];
 		public IRichCommand ClearSelection => commands[CommandCodes.ClearSelection];
@@ -213,7 +212,6 @@ public CommandManager()
 			[CommandCodes.ToggleShowHiddenItems] = new ToggleShowHiddenItemsAction(),
 			[CommandCodes.ToggleShowFileExtensions] = new ToggleShowFileExtensionsAction(),
 			[CommandCodes.TogglePreviewPane] = new TogglePreviewPaneAction(),
-			[CommandCodes.ToggleSidebar] = new ToggleSidebarAction(),
 			[CommandCodes.SelectAll] = new SelectAllAction(),
 			[CommandCodes.InvertSelection] = new InvertSelectionAction(),
 			[CommandCodes.ClearSelection] = new ClearSelectionAction(),

src/Files.App/Data/Commands/Manager/ICommandManager.cs

@@ -25,7 +25,6 @@ public interface ICommandManager : IEnumerable<IRichCommand>
 		IRichCommand ToggleShowHiddenItems { get; }
 		IRichCommand ToggleShowFileExtensions { get; }
 		IRichCommand TogglePreviewPane { get; }
-		IRichCommand ToggleSidebar { get; }
 
 		IRichCommand CopyItem { get; }
 		IRichCommand CopyPath { get; }

src/Files.App/Data/Contexts/Tags/TagsContext.cs

@@ -30,7 +30,7 @@ sealed class TagsContext : ITagsContext
 		public TagsContext()
 		{
 			FileTagsContainerViewModel.SelectedTagChanged += SelectedTagsChanged;
-			SidebarControl.SelectedTagChanged += SelectedTagsChanged;
+			SidebarViewModel.SelectedTagChanged += SelectedTagsChanged;
 		}
 
 		private void SelectedTagsChanged(object _, SelectedTagChangedEventArgs e)

src/Files.App/Data/Items/DriveItem.cs

@@ -6,7 +6,9 @@
 using Files.Core.Storage.Enums;
 using Files.Core.Storage.LocatableStorage;
 using Files.Core.Storage.NestedStorage;
+using Microsoft.UI.Dispatching;
 using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
 using Microsoft.UI.Xaml.Media.Imaging;
 using Windows.Storage;
 using Windows.Storage.Streams;
@@ -20,7 +22,11 @@ public class DriveItem : ObservableObject, INavigationControlItem, ILocatableFol
 		public BitmapImage Icon
 		{
 			get => icon;
-			set => SetProperty(ref icon, value);
+			set
+			{
+				SetProperty(ref icon, value, nameof(Icon));
+				OnPropertyChanged(nameof(IconSource));
+			}
 		}
 
 		public byte[] IconData { get; set; }
@@ -32,8 +38,6 @@ public string Path
 			set => path = value;
 		}
 
-		public string ToolTipText { get; private set; }
-
 		public string DeviceID { get; set; }
 
 		public StorageFolder Root { get; set; }
@@ -68,7 +72,10 @@ public ByteSize MaxSpace
 			{
 				if (SetProperty(ref maxSpace, value))
 				{
-					ToolTipText = GetSizeString();
+					if (Type != DriveType.CloudDrive)
+					{
+						ToolTip = GetSizeString();
+					}
 
 					OnPropertyChanged(nameof(MaxSpaceText));
 					OnPropertyChanged(nameof(ShowDriveDetails));
@@ -84,7 +91,10 @@ public ByteSize FreeSpace
 			{
 				if (SetProperty(ref freeSpace, value))
 				{
-					ToolTipText = GetSizeString();
+					if (Type != DriveType.CloudDrive)
+					{
+						ToolTip = GetSizeString();
+					}
 
 					OnPropertyChanged(nameof(FreeSpaceText));
 				}
@@ -107,7 +117,22 @@ public ByteSize SpaceUsed
 		public bool ShowDriveDetails
 			=> MaxSpace.Bytes > 0d;
 
-		public DriveType Type { get; set; }
+		private DriveType type;
+		public DriveType Type
+		{
+			get => type; set
+			{
+				type = value;
+				if (value == DriveType.Network)
+				{
+					ToolTip = "Network".GetLocalizedResource();
+				}
+				else if (value == DriveType.CloudDrive)
+				{
+					ToolTip = Text;
+				}
+			}
+		}
 
 		private string text;
 		public string Text
@@ -152,6 +177,28 @@ public bool ShowStorageSense
 
 		public string Name => Root.DisplayName;
 
+		public object? Children => null;
+
+		private object toolTip = "";
+		public object ToolTip
+		{
+			get => toolTip;
+			set
+			{
+				SetProperty(ref toolTip, value);
+			}
+		}
+
+		public bool IsExpanded { get => false; set { } }
+
+		public IconSource? IconSource
+		{
+			get => new ImageIconSource()
+			{
+				ImageSource = Icon
+			};
+		}
+
 		public static async Task<DriveItem> CreateFromPropertiesAsync(StorageFolder root, string deviceId, string label, DriveType type, IRandomAccessStream imageStream = null)
 		{
 			var item = new DriveItem();
@@ -255,7 +302,6 @@ public async Task LoadThumbnailAsync(bool isSidebar = false)
 				}
 				IconData ??= UIHelpers.GetSidebarIconResourceInfo(Constants.ImageRes.Folder).IconData;
 			}
-
 			Icon ??= await IconData.ToBitmapAsync();
 		}
 

src/Files.App/Data/Items/FileTagItem.cs

@@ -1,11 +1,17 @@
 // Copyright (c) 2023 Files Community
 // Licensed under the MIT License. See the LICENSE.
 
+using CommunityToolkit.WinUI.Helpers;
+using Files.App.Converters;
 using Files.Core.ViewModels.FileTags;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+using Microsoft.UI.Xaml.Markup;
+using Microsoft.UI.Xaml.Media;
 
 namespace Files.App.Data.Items
 {
-	public class FileTagItem : INavigationControlItem
+	public class FileTagItem : ObservableObject, INavigationControlItem
 	{
 		public string Text { get; set; }
 
@@ -16,7 +22,8 @@ public string Path
 			set
 			{
 				path = value;
-				ToolTipText = Text;
+				OnPropertyChanged(nameof(IconSource));
+				OnPropertyChanged(nameof(ToolTip));
 			}
 		}
 
@@ -33,5 +40,20 @@ public int CompareTo(INavigationControlItem other)
 			=> Text.CompareTo(other.Text);
 
 		public TagViewModel FileTag { get; set; }
+
+		public object? Children => null;
+
+		public IconSource? IconSource
+		{
+			get => new PathIconSource()
+			{
+				Data = (Geometry)XamlBindingHelper.ConvertValue(typeof(Geometry), (string)Application.Current.Resources["ColorIconFilledTag"]),
+				Foreground = new SolidColorBrush(FileTag.Color.ToColor())
+			};
+		}
+
+		public object ToolTip => Text;
+
+		public bool IsExpanded { get => false; set { } }
 	}
 }

src/Files.App/Data/Items/INavigationControlItem.cs

@@ -1,18 +1,20 @@
 // Copyright (c) 2023 Files Community
 // Licensed under the MIT License. See the LICENSE.
 
+using Files.App.UserControls.Sidebar;
+using Microsoft.UI.Xaml.Controls;
+
 namespace Files.App.Data.Items
 {
-	public interface INavigationControlItem : IComparable<INavigationControlItem>
+
+	public interface INavigationControlItem : IComparable<INavigationControlItem>, INotifyPropertyChanged, ISidebarItemModel
 	{
-		public string Text { get; }
+		public new string Text { get; }
 
 		public string Path { get; }
 
 		public SectionType Section { get; }
 
-		public string ToolTipText { get; }
-
 		public NavigationControlItemType ItemType { get; }
 
 		public ContextMenuOptions MenuOptions { get; }