feat: add option to collapse the navigation sidebar

timschneeb · Aug 9, 2024 · be1ee30 · be1ee30
1 parent b400807
commit be1ee30
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 17 deletions.
diff --git a/GalaxyBudsClient/Interface/MainView.axaml.cs b/GalaxyBudsClient/Interface/MainView.axaml.cs
@@ -1,7 +1,7 @@
 using System;
 using System.Collections.Generic;
+using System.ComponentModel;
 using System.Linq;
-using Avalonia;
 using Avalonia.Controls;
 using Avalonia.Interactivity;
 using Avalonia.Threading;
@@ -13,7 +13,7 @@
 using GalaxyBudsClient.Interface.Services;
 using GalaxyBudsClient.Interface.ViewModels;
 using GalaxyBudsClient.Interface.ViewModels.Pages;
-using GalaxyBudsClient.Platform;
+using GalaxyBudsClient.Model.Config;
 using GalaxyBudsClient.Utils.Interface;
 using Serilog;
 using SymbolIconSource = FluentIcons.Avalonia.Fluent.SymbolIconSource;
@@ -82,12 +82,22 @@ public MainView()
 
         InitializeNavigationPages();
 
+        Settings.MainSettingsPropertyChanged += OnMainSettingsPropertyChanged;
         BreadcrumbBar.ItemClicked += OnBreadcrumbBarItemClicked;
         FrameView.Navigated += OnFrameViewNavigated;
         NavView.ItemInvoked += OnNavigationViewItemInvoked;
         NavView.BackRequested += OnNavigationViewBackRequested;
     }
-
+
+    private void OnMainSettingsPropertyChanged(object? sender, PropertyChangedEventArgs e)
+    {
+        if (e.PropertyName == nameof(SettingsData.ShowSidebar))
+        {
+            RefreshSidebarState();
+            RefreshSidebarItemStates();
+        }
+    }
+
     private void OnLanguageUpdated()
     {
         FlowDirection = Loc.ResolveFlowDirection();
@@ -180,22 +190,31 @@ private void CheckSetupWizardState()
         }
     }
 
-    private void InitializeNavigationPages()
+    private void RefreshSidebarState()
     {
-        if (PlatformUtils.IsDesktop || OperatingSystem.IsBrowser())
-        {
-            NavView.Classes.Add("AppNav");
-        }
-        else
+        NavView.Classes.Set("AppNav", Settings.Data.ShowSidebar);
+        NavView.Classes.Set("MobileContentContainer", true);
+        NavView.PaneDisplayMode = Settings.Data.ShowSidebar ? 
+            NavigationViewPaneDisplayMode.Left : NavigationViewPaneDisplayMode.LeftMinimal;
+    }
+
+    private void RefreshSidebarItemStates()
+    {
+        foreach(var nvi in NavView.MenuItemsSource.Cast<NavigationViewItem>()
+                    .Concat(NavView.FooterMenuItemsSource.Cast<NavigationViewItem>()))
         {
-            NavView.PaneDisplayMode = NavigationViewPaneDisplayMode.LeftMinimal;
-            ContentContainer.Classes.Add("MobileContentContainer");
+            nvi.Classes.Set("AppNav", Settings.Data.ShowSidebar);
         }
-
+    }
+
+    private void InitializeNavigationPages()
+    {
+        RefreshSidebarState();
+
         Dispatcher.UIThread.Post(() =>
         {   
             var menuItems = new List<NavigationViewItem>(14);
-            var footerItems = new List<NavigationViewItem>(1);
+            var footerItems = new List<NavigationViewItem>(2);
             
             foreach (var page in _mainPages)
             {
@@ -206,10 +225,7 @@ private void InitializeNavigationPages()
                     IconSource = new SymbolIconSource { Symbol = page.IconKey }
                 };
 
-                if (PlatformUtils.IsDesktop || OperatingSystem.IsBrowser())
-                {
-                    nvi.Classes.Add("AppNav");
-                }
+                nvi.Classes.Set("AppNav", Settings.Data.ShowSidebar);
 
                 if (page.ShowsInFooter)
                     footerItems.Add(nvi);

diff --git a/GalaxyBudsClient/Interface/Pages/SettingsPage.axaml b/GalaxyBudsClient/Interface/Pages/SettingsPage.axaml
@@ -108,6 +108,11 @@
                                              Symbol="ImageSparkle"
                                              IsChecked="{Binding RealisticEarbudImages, Source={x:Static config:Settings.Data}}" />
 
+                <controls:SettingsSwitchItem Content="{ext:Translate {x:Static i18N:Keys.SettingsNavSidebar}}"
+                                             Description="{ext:Translate {x:Static i18N:Keys.SettingsNavSidebarDescription}}"
+                                             Symbol="LayoutColumnOneThirdLeft"
+                                             IsChecked="{Binding ShowSidebar, Source={x:Static config:Settings.Data}}" />
+
             </ui:SettingsExpander>
 
             <ui:SettingsExpander Header="{ext:Translate {x:Static i18N:Keys.SettingsTraySettings}}"

diff --git a/GalaxyBudsClient/Model/Config/Settings.cs b/GalaxyBudsClient/Model/Config/Settings.cs
@@ -43,6 +43,8 @@ static Settings()
     public static Themes DefaultTheme => PlatformUtils.SupportsMicaTheme ? Themes.DarkMica : 
         PlatformUtils.SupportsBlurTheme ? Themes.DarkBlur : Themes.Dark;
 
+    public static bool DefaultShowSidebar => PlatformUtils.IsDesktop ? true : false;
+
     private static void OnTouchActionPropertyChanged(object? sender, PropertyChangedEventArgs e)
     {
         Save();

diff --git a/GalaxyBudsClient/Model/Config/SettingsData.cs b/GalaxyBudsClient/Model/Config/SettingsData.cs
@@ -36,6 +36,7 @@ public class SettingsData : ReactiveObject
     [Reactive] public Locales Locale { set; get; } = Locales.en;
     [Reactive] public TemperatureUnits TemperatureUnit { set; get; } = TemperatureUnits.Celsius;
     [Reactive] public bool RealisticEarbudImages { set; get; } = true;
+    [Reactive] public bool ShowSidebar { set; get; } = Settings.DefaultShowSidebar;
 
     /* Connections */
     [Reactive] public bool UseBluetoothWinRt { set; get; } = true;

diff --git a/GalaxyBudsClient/i18n/en.axaml b/GalaxyBudsClient/i18n/en.axaml
@@ -388,6 +388,8 @@ Measure level: Select a vertical span to measure the battery level difference be
     <sys:String x:Key="settings_minimize_tray_description">Keep in background instead of terminating the app</sys:String>
     <sys:String x:Key="settings_realistic_earbud_icons">Use realistic earbud images</sys:String>
     <sys:String x:Key="settings_realistic_earbud_icons_description">Display realistic &amp; color-aware images of your earbuds, if they support it</sys:String>
+    <sys:String x:Key="settings_nav_sidebar">Navigation sidebar</sys:String>
+    <sys:String x:Key="settings_nav_sidebar_description">Show or collapse the navigation buttons on the left hand side</sys:String>
     <sys:String x:Key="settings_tray_settings">Tray icon &amp; startup</sys:String>
     <sys:String x:Key="settings_dyn_tray_mode">Dynamic tray icon</sys:String>
     <sys:String x:Key="settings_dyn_tray_mode_description">Display the battery status in the tray icon</sys:String>