Menu update and short addresses helper

michielpost · Mar 28, 2024 · cd4dfd7 · cd4dfd7
1 parent bdb0f81
commit cd4dfd7
Show file tree

Hide file tree

Showing 7 changed files with 87 additions and 27 deletions.
diff --git a/src/aoWebWallet/Extensions/AddressExtensions.cs b/src/aoWebWallet/Extensions/AddressExtensions.cs
@@ -0,0 +1,10 @@
+namespace aoWebWallet.Extensions
+{
+    public static class AddressExtensions
+    {
+        public static string ToShortAddress(this string address)
+        {
+            return address[0..7] + "..." + address[^7..];
+        }
+    }
+}
diff --git a/src/aoWebWallet/Pages/WalletDetail.razor b/src/aoWebWallet/Pages/WalletDetail.razor
@@ -17,15 +17,30 @@
                     @Address
                 </MudText>
                 <MudText Typo="Typo.body2">@BindingContext.SelectedWallet?.Name</MudText>
+                @if (BindingContext.SelectedWallet?.NeedsBackup ?? false)
+                {
+                    <MudStack Row="true">
+                    <MudIcon style="margin-left:2px; width:20px; padding-bottom:4px;" Icon="@Icons.Material.Filled.Warning" Color="Color.Warning" />
+                    <MudText Typo="Typo.body2">Wallet not backed up yet!</MudText>
+                    </MudStack>
+                }
             </MudStack>
             <MudIconButton Class="copy-clipboard" Icon="@Icons.Material.Filled.ContentCopy" Color="Color.Default" OnClick="async () => { await BindingContext.CopyToClipboard(BindingContext.SelectedWallet?.Address); }" />
             <MudSpacer />
+            @if (!string.IsNullOrEmpty(BindingContext.SelectedWallet?.Jwk))
+            {
+                <MudTooltip Text="Download wallet file" Arrow="true" Placement="Placement.Left">
+                    <MudIconButton Icon="@Icons.Material.Filled.Save" aria-label="backup" OnClick="() => { DownloadWallet(BindingContext.SelectedWallet); }"></MudIconButton>
+                </MudTooltip>
+            }
             <MudTooltip Text="Refresh balances" Arrow="true" Placement="Placement.Left">
-                <MudIconButton Icon="@Icons.Material.Filled.Refresh" aria-label="refresh transactions" OnClick="RefreshTransactions"></MudIconButton>
+                <MudIconButton Icon="@Icons.Material.Filled.Refresh" aria-label="refresh transactions" OnClick="RefreshBalances"></MudIconButton>
             </MudTooltip>
             @if(BindingContext.SelectedWallet?.Source == WalletTypes.Explorer)
             {
-                <MudIconButton Icon="@Icons.Material.Outlined.Grade" aria-label="add to wallets" OnClick="AddWalletAsReadonly"></MudIconButton>
+                <MudTooltip Text="Add as readonly wallet" Arrow="true" Placement="Placement.Left">
+                    <MudIconButton Icon="@Icons.Material.Outlined.Grade" aria-label="add to wallets" OnClick="AddWalletAsReadonly"></MudIconButton>
+                </MudTooltip>
             }
         </MudStack>
     </MudPaper>
@@ -73,9 +88,9 @@
     }
 
     <MudContainer style="max-width: 100%;" Width="100%" Class="d-flex justify-end mb-4 pr-2">
-        <MudTooltip Text="Refresh balances" Arrow="true" Placement="Placement.Left">
+@*         <MudTooltip Text="Refresh balances" Arrow="true" Placement="Placement.Left">
             <MudIconButton Icon="@Icons.Material.Filled.Refresh" aria-label="refresh transactions" OnClick="RefreshBalances"></MudIconButton>
-        </MudTooltip>
+        </MudTooltip> *@
         <MudTooltip Text="Add token" Arrow="true" Placement="Placement.Left">
             <MudIconButton Icon="@Icons.Material.Filled.AddCircle" aria-label="add token" Size="Size.Large" OnClick="OpenAddTokenDialog"></MudIconButton>
         </MudTooltip>

diff --git a/src/aoWebWallet/Pages/WalletDetail.razor.cs b/src/aoWebWallet/Pages/WalletDetail.razor.cs
@@ -1,4 +1,5 @@
-using aoWebWallet.ViewModels;
+using aoWebWallet.Models;
+using aoWebWallet.ViewModels;
 using Microsoft.AspNetCore.Components;
 using MudBlazor;
 
@@ -43,5 +44,11 @@ protected override async Task LoadDataAsync()
             await base.LoadDataAsync();
         }
 
+        private async void DownloadWallet(Wallet wallet)
+        {
+            await BindingContext.DownloadWallet(wallet);
+            StateHasChanged();
+        }
+
     }
 }
diff --git a/src/aoWebWallet/Pages/Wallets.razor b/src/aoWebWallet/Pages/Wallets.razor
@@ -19,7 +19,6 @@
     }
 
     <DataLoaderProgress DataLoader="BindingContext.TokenList.DataLoader" Title="tokens" />
-    <DataLoaderProgress DataLoader="BindingContext.WalletList.DataLoader" Title="wallets" />
 
     <MudContainer style="max-width: 100%;"  Width="100%" Class="d-flex justify-end mb-4 pr-3">
             @if (BindingContext.WalletList.Data != null && BindingContext.WalletList.Data.Any())
@@ -95,6 +94,12 @@
 
             }
         }
+        else
+        {
+            <MudText Typo="Typo.h6">Loading wallets...</MudText>
+
+            <DataLoaderProgress DataLoader="BindingContext.WalletList.DataLoader" Title="wallets" />
+        }
 
     </MudStack>
 </MudContainer>

diff --git a/src/aoWebWallet/Shared/NavMenu.razor b/src/aoWebWallet/Shared/NavMenu.razor
@@ -2,24 +2,38 @@
 
 <MudNavMenu Class="aoww-main-menu">
 
-@*     <MudNavGroup Class="mt-2 mb-2 aoww-main-nav-text flex" Title="Wallets" Icon="@Icons.Material.Filled.Wallet" Expanded="true">
-        <div style="display:flex; flex-direction: row; justify-content:center; align-items:center;">
-            <MudAvatar Image="images/account--5.svg" Size="Size.Small" Class="rounded-full ml-11  aoww-nested-nav-items" />
-            <MudNavLink Href="" style="font-size:12px;" Match="NavLinkMatch.All">j7hh8628...</MudNavLink>
-        </div>
-        <div style="display:flex; flex-direction: row; justify-content:center; align-items:center; ">
-            <MudAvatar Image="images/account--2.svg" Size="Size.Small" Class="rounded-full ml-11 aoww-nested-nav-items"  />
-            <MudNavLink Href="" style="font-size:12px;" Match="NavLinkMatch.All">aGh8628...</MudNavLink>
-        </div>
-    </MudNavGroup> *@
-    <MudNavLink Href="" Match="NavLinkMatch.All" Class="aoww-main-nav-text mt-2" Icon="@Icons.Material.Filled.Wallet">Wallets</MudNavLink>
+    @if ((BindingContext.WalletList.Data ?? new()).Any())
+    {
+        <MudNavLink Href="" Match="NavLinkMatch.All" Class="aoww-main-nav-text mt-2" Icon="@Icons.Material.Filled.Home">Home</MudNavLink>
+        <MudNavGroup Class="mt-2 mb-2 aoww-main-nav-text flex" Title="Wallets" Icon="@Icons.Material.Filled.Wallet" Expanded="true">
+            @{
+                int logoCount = 1;
+            }
+            @foreach (var wallet in BindingContext.WalletList.Data ?? new())
+            {
+                string logoUrl = $"images/account--{logoCount}.svg";
+                string detailUrl = $"wallet/{wallet.Address}";
+
+                <MudStack Row=true>
+                    <MudAvatar Image="@logoUrl" Size="Size.Small" Class="rounded-full ml-11  aoww-nested-nav-items" />
+                    <MudNavLink Href="@detailUrl" style="font-size:12px;" Match="NavLinkMatch.All">@wallet.Address.ToShortAddress()</MudNavLink>
+                </MudStack>
+                logoCount++;
+            }
+        </MudNavGroup>
+    }
+    else
+    {
+        <MudNavLink Href="" Match="NavLinkMatch.All" Class="aoww-main-nav-text mt-2" Icon="@Icons.Material.Filled.Wallet">Wallets</MudNavLink>
+    }
+
     <MudNavLink Href="token-explorer" Match="NavLinkMatch.Prefix" Class="aoww-main-nav-text" Icon="@Icons.Material.Filled.Explore">Token Explorer</MudNavLink>
 
     <div style="margin-top: auto; display:flex; flex-direction: row;">
         <div style="border-right: 1px solid gray;">
-                <MudNavLink Href="settings" Match="NavLinkMatch.Prefix" Icon="@Icons.Material.Filled.Settings">Settings</MudNavLink>
-                <MudNavLink style="margin-bottom:5px;" Href="about" Match="NavLinkMatch.Prefix" Icon="@Icons.Material.Filled.Info">About</MudNavLink>
-            </div>
+            <MudNavLink Href="settings" Match="NavLinkMatch.Prefix" Icon="@Icons.Material.Filled.Settings">Settings</MudNavLink>
+            <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;">
             @if (BindingContext.UserSettings?.IsDarkMode ?? true)
             {
@@ -33,19 +47,22 @@
         </div>
 
     </div>
-    <div style="display:flex; flex-direction: column; justify-content:center; padding:3px 0 11px 0; margin-top:8px; align-items: center; width:100%" >
-        <MudDivider DividerType="DividerType.FullWidth" Class="mb-8"/>
+    <div style="display:flex; flex-direction: column; justify-content:center; padding:3px 0 11px 0; margin-top:8px; align-items: center; width:100%">
+        <MudDivider DividerType="DividerType.FullWidth" Class="mb-8" />
         <MudImage style="opacity: 0.55" Src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iTGF5ZXJfMiIgZGF0YS1uYW1lPSJMYXllciAyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMzExLjU4IDI0MC45MiI+CiAgPGRlZnM+CiAgICA8c3R5bGU+CiAgICAgIC5jbHMtMSB7CiAgICAgICAgZmlsbDogI2ZmZjsKICAgICAgICBmaWxsLXJ1bGU6IGV2ZW5vZGQ7CiAgICAgIH0KICAgIDwvc3R5bGU+CiAgPC9kZWZzPgogIDxnIGlkPSJMYXllcl8xLTIiIGRhdGEtbmFtZT0iTGF5ZXIgMSI+CiAgICA8Zz4KICAgICAgPHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjAgMjQwLjQ1IDgwLjIgMjQwLjQ1IDk2LjU3IDE5Ni4xOSA1OS43NCAxMjAuNzkgMCAyNDAuNDUiLz4KICAgICAgPHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjEyMy41NyAxLjEyIDk2LjU3IDYyLjYgMTgwLjg2IDI0MC40NSAyNDEuNTggMjQwLjQ1IDIxMi43NyAxODAuNjIgMTIzLjU3IDEuMTIiLz4KICAgICAgPHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9Ijc4NS4wMSA0Ni44NSA4MjEuODQgMTIyLjI2IDg4MS41OCAyLjU5IDgwMS4zOCAyLjU5IDc4NS4wMSA0Ni44NSIvPgogICAgICA8cG9seWdvbiBjbGFzcz0iY2xzLTEiIHBvaW50cz0iNDcyIDEuMTIgNTAwLjggNjAuOTYgNTkwIDI0MC40NSA2MTcuMDEgMTc4Ljk4IDUzMi43MiAxLjEyIDQ3MiAxLjEyIi8+CiAgICAgIDxwb2x5Z29uIGNsYXNzPSJjbHMtMSIgcG9pbnRzPSI3MTMuMzQgMS41OSA3MTMuNTggMS4xMiA2MzMuMzggMS4xMiA2MTcuMDEgNDUuMzggNjUzLjg0IDEyMC43OSA2ODIuNjQgNjMuMSA3NzEgMjQwLjkyIDc5OC4wMSAxNzkuNDUgNzEzLjcyIDEuNTkgNzEzLjM0IDEuNTkiLz4KICAgICAgPHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjEyMzEuMzggMi41OSAxMjE1LjAxIDQ2Ljg1IDEyNTEuODQgMTIyLjI2IDEzMTEuNTggMi41OSAxMjMxLjM4IDIuNTkiLz4KICAgICAgPHBvbHlnb24gY2xhc3M9ImNscy0xIiBwb2ludHM9IjkwMiAxLjEyIDkzMC44IDYwLjk2IDEwMjAgMjQwLjQ1IDEwNDcuMDEgMTc4Ljk4IDk2Mi43MiAxLjEyIDkwMiAxLjEyIi8+CiAgICAgIDxwb2x5Z29uIGNsYXNzPSJjbHMtMSIgcG9pbnRzPSIxMTQzLjM0IDEuNTkgMTE0My41OCAxLjEyIDEwNjMuMzggMS4xMiAxMDQ3LjAxIDQ1LjM4IDEwODMuODQgMTIwLjc5IDExMTIuNjQgNjMuMSAxMjAxIDI0MC45MiAxMjI4LjAxIDE3OS40NSAxMTQzLjcyIDEuNTkgMTE0My4zNCAxLjU5Ii8+CiAgICAgIDxwYXRoIGNsYXNzPSJjbHMtMSIgZD0ibTM2MS44LDBjLTY2LjQsMC0xMjAuMjMsNTMuODMtMTIwLjIzLDEyMC4yM3M1My44MywxMjAuMjMsMTIwLjIzLDEyMC4yMywxMjAuMjMtNTMuODMsMTIwLjIzLTEyMC4yM1M0MjguMiwwLDM2MS44LDBabTAsMTkzLjI2Yy00MC4zNCwwLTczLjAzLTMyLjctNzMuMDMtNzMuMDNzMzIuNy03My4wMyw3My4wMy03My4wMyw3My4wMywzMi43LDczLjAzLDczLjAzLTMyLjcsNzMuMDMtNzMuMDMsNzMuMDNaIi8+CiAgICA8L2c+CiAgPC9nPgo8L3N2Zz4="
-                    Width="66" Class="pt-2" Alt="AOWW Logotype"/>
+                  Width="66" Class="pt-2" Alt="AOWW Logotype" />
         <MudText Typo="Typo.caption">Copyright @DateTimeOffset.UtcNow.Year</MudText>
     </div>
 </MudNavMenu>
 
-@code{
+@code {
     private string[] icons = { Icons.Material.Filled.WbSunny, Icons.Material.Filled.NightlightRound };
+    int logoCount = 1;
 
     protected override void OnInitialized()
     {
+        WatchDataLoaderVM(BindingContext.WalletList);
+
         BindingContext.PropertyChanged += BindingContext_PropertyChanged;
 
         base.OnInitialized();

diff --git a/src/aoWebWallet/ViewModels/MainViewModel.cs b/src/aoWebWallet/ViewModels/MainViewModel.cs
@@ -274,8 +274,13 @@ public async Task DownloadWallet(Wallet wallet)
 
             if (this.WalletList.Data != null)
             {
-                await storageService.SaveWalletList(this.WalletList.Data);
-                //await LoadWalletList();
+                var selected = this.WalletList.Data.Where(x => x.Address == address).FirstOrDefault();
+                if(selected != null)
+                {
+                    selected.LastBackedUpDate = DateTimeOffset.UtcNow;
+                    await storageService.SaveWalletList(this.WalletList.Data);
+                    //await LoadWalletList();
+                }
             }
         }
 

diff --git a/src/aoWebWallet/_Imports.razor b/src/aoWebWallet/_Imports.razor
@@ -17,4 +17,5 @@
 @using MudBlazor
 @using webvNext.DataLoader
 @using ArweaveAO
-@using ArweaveBlazor
+@using ArweaveBlazor
+@using aoWebWallet.Extensions