Merge pull request #2 from michielpost/feature/theme-switch

Save theme switch in user settings
michielpost · Mar 27, 2024 · 88c2a64 · 88c2a64
2 parents e52b059 + 1470037
commit 88c2a64
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 11 deletions.
diff --git a/src/aoWebWallet/Pages/MvvmComponentBase.cs b/src/aoWebWallet/Pages/MvvmComponentBase.cs
@@ -1,4 +1,5 @@
 using aoWebWallet.ViewModels;
+using CommunityToolkit.Mvvm.ComponentModel;
 using Microsoft.AspNetCore.Components;
 using System.ComponentModel;
 using System.Diagnostics;
@@ -62,6 +63,11 @@ protected virtual Task LoadDataAsync()
             return Task.CompletedTask;
         }
 
+        protected void WatchObject<D>(D obj) where D : ObservableObject
+        {
+            ObjWatch.Add(obj);
+        }
+
         protected void WatchDataLoaderVM<D>(DataLoaderViewModel<D> vm) where D : class
         {
             ObjWatch.Add(vm);

diff --git a/src/aoWebWallet/Shared/NavMenu.razor b/src/aoWebWallet/Shared/NavMenu.razor
@@ -21,7 +21,14 @@
                 <MudNavLink style="margin-bottom:5px;" Href="about" Match="NavLinkMatch.Prefix" Icon="@Icons.Material.Filled.Info">About</MudNavLink>
             </div>
         <div style="display: flex; flex-direction: row; justify-content: center; align-items: center; margin-left:10px; padding:5px;">
-            <MudIcon Icon="@icons[index]" Color="Color.Primary" />
+            @if (BindingContext.UserSettings?.IsDarkMode ?? true)
+            {
+                <MudIcon Icon="@icons[1]" Color="Color.Primary" />
+            }
+            else
+            {
+                <MudIcon Icon="@icons[0]" Color="Color.Primary" />
+            }
             <MudButton Variant="Variant.Filled" OnClick="ToggleTheme" DisableElevation="true" Size="Size.Small">Theme</MudButton>
         </div>
 
@@ -35,19 +42,30 @@
 </MudNavMenu>
 
 @code{
-    private int index = 1;
     private string[] icons = { Icons.Material.Filled.WbSunny, Icons.Material.Filled.NightlightRound };
 
-    private void ToggleTheme()
+    protected override void OnInitialized()
     {
-        index = (index + 1) % 2;
-        if (index == 0)
-        {
-            BindingContext.IsDarkMode = false;
-        }
-        else
+        BindingContext.PropertyChanged += BindingContext_PropertyChanged;
+
+        base.OnInitialized();
+    }
+
+    private void BindingContext_PropertyChanged(object? sender, System.ComponentModel.PropertyChangedEventArgs e)
+    {
+        if (e.PropertyName == nameof(MainViewModel.IsDarkMode))
         {
-            BindingContext.IsDarkMode = true;
+            this.StateHasChanged();
         }
     }
+
+    public virtual void Dispose()
+    {
+        BindingContext.PropertyChanged -= BindingContext_PropertyChanged;
+    }
+
+    private Task ToggleTheme()
+    {
+        return BindingContext.SetIsDarkMode(!BindingContext.IsDarkMode);
+    }
 }
diff --git a/src/aoWebWallet/ViewModels/MainViewModel.cs b/src/aoWebWallet/ViewModels/MainViewModel.cs
@@ -395,12 +395,19 @@ partial void OnComputeUnitUrlChanged(string? value)
         public async Task LoadUserSettings()
         {
             UserSettings = await storageService.GetUserSettings();
+            if (UserSettings != null)
+            {
+                IsDarkMode = UserSettings.IsDarkMode ?? true;
+            }
         }
 
         public async Task SaveUserSettings()
         {
-            if(UserSettings != null)
+            if (UserSettings != null)
+            {
                 await storageService.SaveUserSettings(UserSettings);
+                IsDarkMode = UserSettings.IsDarkMode ?? true;
+            }
         }
 
         public async Task AddWalletAsReadonly()
@@ -619,5 +626,14 @@ public async Task CopyToClipboard(string? text)
 
                 return new Transaction { Id = idResult };
             });
+
+        public async Task SetIsDarkMode(bool isDarkMode)
+        {
+            if(UserSettings != null)
+            {
+                UserSettings.IsDarkMode = isDarkMode;
+                await SaveUserSettings();
+            }
+        }
     }
 }