Added update system to the app (#13)

2026-10-18 00:57:59 +00:00 · 2024-06-30 15:26:28 +02:00
1 parent 50a03e6c9d
commit d6e80a4563
@@ -2,31 +2,57 @@

 <MudPaper Height="calc(100vh);" Elevation="0">
    <MudLayout>
-        <MudDrawerContainer Class="mud-height-full absolute">
-            <MudDrawer Elevation="0" Variant="@DrawerVariant.Mini" OpenMiniOnHover="@true" Color="Color.Default">
-                <MudNavMenu>
-                    <MudTooltip Text="Home" Placement="Placement.Right">
-                        <MudNavLink Href="/" Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.Home">Home</MudNavLink>
-                    </MudTooltip>
-                    <MudTooltip Text="Chats" Placement="Placement.Right">
-                        <MudNavLink Href="/chat" Icon="@Icons.Material.Filled.Chat">Chats</MudNavLink>
-                    </MudTooltip>
-                    <MudTooltip Text="Supporters" Placement="Placement.Right">
-                        <MudNavLink Href="/supporters" Icon="@Icons.Material.Filled.Favorite" IconColor="Color.Error">Supporters</MudNavLink>
-                    </MudTooltip>
-                    <MudTooltip Text="About" Placement="Placement.Right">
-                        <MudNavLink Href="/about" Icon="@Icons.Material.Filled.Info">About</MudNavLink>
-                    </MudTooltip>
-                    <MudTooltip Text="Settings" Placement="Placement.Right">
-                        <MudNavLink Href="/settings" Icon="@Icons.Material.Filled.Settings">Settings</MudNavLink>
-                    </MudTooltip>
-                </MudNavMenu>
-            </MudDrawer>
-        </MudDrawerContainer>
+        @if (!this.performingUpdate)
+        {
+            <MudDrawerContainer Class="mud-height-full absolute">
+                <MudDrawer Elevation="0" Variant="@DrawerVariant.Mini" OpenMiniOnHover="@true" Color="Color.Default">
+                    <MudNavMenu>
+                        <MudTooltip Text="Home" Placement="Placement.Right">
+                            <MudNavLink Href="/" Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.Home">Home</MudNavLink>
+                        </MudTooltip>
+                        <MudTooltip Text="Chats" Placement="Placement.Right">
+                            <MudNavLink Href="/chat" Icon="@Icons.Material.Filled.Chat">Chats</MudNavLink>
+                        </MudTooltip>
+                        <MudTooltip Text="Supporters" Placement="Placement.Right">
+                            <MudNavLink Href="/supporters" Icon="@Icons.Material.Filled.Favorite" IconColor="Color.Error">Supporters</MudNavLink>
+                        </MudTooltip>
+                        <MudTooltip Text="About" Placement="Placement.Right">
+                            <MudNavLink Href="/about" Icon="@Icons.Material.Filled.Info">About</MudNavLink>
+                        </MudTooltip>
+                        <MudTooltip Text="Settings" Placement="Placement.Right">
+                            <MudNavLink Href="/settings" Icon="@Icons.Material.Filled.Settings">Settings</MudNavLink>
+                        </MudTooltip>
+                    </MudNavMenu>
+                </MudDrawer>
+            </MudDrawerContainer>
+        }

        <MudMainContent Class="mud-height-full pt-1">
            <MudContainer Fixed="@true" Class="mud-height-full" Style="margin-left: 5em; width: calc(100% - 5em);">
-                @this.Body
+                @if (!this.performingUpdate && this.IsUpdateAlertVisible)
+                {
+                    <MudAlert NoIcon="@true" Severity="Severity.Info" Variant="Variant.Filled" ShowCloseIcon="@true" Dense="@true" CloseIconClicked="() => this.DismissUpdate()" Class="mt-2 mb-2">
+                        <div class="d-inline-flex align-center">
+                            <MudIcon Icon="@Icons.Material.Filled.Update" Size="Size.Medium" Class="mr-3"/>
+                            An update to version @this.updateToVersion is available.
+                            <MudButton Variant="Variant.Filled" Color="Color.Dark" Size="Size.Small" Class="ml-3" OnClick="() => this.ShowUpdateDialog()">
+                                Show details
+                            </MudButton>
+                        </div>
+                    </MudAlert>
+                }
+
+                @if (!this.performingUpdate)
+                {
+                    <CascadingValue Value="@this" IsFixed="true">
+                        @this.Body
+                    </CascadingValue>
+                }
+
+                <MudOverlay Visible="@this.performingUpdate" DarkBackground="@true" LockScroll="@true">
+                    <MudText Typo="Typo.h3">Please wait for the update to complete...</MudText>
+                    <MudProgressLinear Color="Color.Primary" Indeterminate="@true" Size="Size.Large" Rounded="@true"/>
+                </MudOverlay>
            </MudContainer>
        </MudMainContent>
    </MudLayout>
@@ -1,12 +1,37 @@
+using AIStudio.Components.CommonDialogs;
 using AIStudio.Settings;
+using AIStudio.Tools;
+
 using Microsoft.AspNetCore.Components;

+using DialogOptions = AIStudio.Components.CommonDialogs.DialogOptions;
+
 namespace AIStudio.Components.Layout;

-public partial class MainLayout : LayoutComponentBase
+public partial class MainLayout : LayoutComponentBase, IMessageBusReceiver
 {
    [Inject]
-    private IJSRuntime JsRuntime { get; set; } = null!;
+    private IJSRuntime JsRuntime { get; init; } = null!;
+    
+    [Inject]
+    private SettingsManager SettingsManager { get; init; } = null!;
+    
+    [Inject]
+    private MessageBus MessageBus { get; init; } = null!;
+    
+    [Inject]
+    public IDialogService DialogService { get; init; } = null!;
+    
+    [Inject]
+    public Rust Rust { get; init; } = null!;
+
+    public string AdditionalHeight { get; private set; } = "0em";
+    
+    private bool isUpdateAvailable;
+    private bool performingUpdate;
+    private bool userDismissedUpdate;
+    private string updateToVersion = string.Empty;
+    private UpdateResponse? currentUpdateResponse;
    
    #region Overrides of ComponentBase

@@ -23,8 +48,98 @@ public partial class MainLayout : LayoutComponentBase
        SettingsManager.ConfigDirectory = configDir;
        SettingsManager.DataDirectory = dataDir;
        
+        // Ensure that all settings are loaded:
+        await this.SettingsManager.LoadSettings();
+        
+        // Register this component with the message bus:
+        this.MessageBus.RegisterComponent(this);
+        this.MessageBus.ApplyFilters(this, [], [ Event.UPDATE_AVAILABLE, Event.USER_SEARCH_FOR_UPDATE ]);
+        
+        // Set the js runtime for the update service:
+        UpdateService.SetJsRuntime(this.JsRuntime);
+        
        await base.OnInitializedAsync();
    }

    #endregion
+
+    #region Implementation of IMessageBusReceiver
+
+    public async Task ProcessMessage<T>(ComponentBase? sendingComponent, Event triggeredEvent, T? data)
+    {
+        switch (triggeredEvent)
+        {
+            case Event.USER_SEARCH_FOR_UPDATE:
+                this.userDismissedUpdate = false;
+                break;
+            
+            case Event.UPDATE_AVAILABLE:
+                if (data is UpdateResponse updateResponse)
+                {
+                    this.currentUpdateResponse = updateResponse;
+                    this.isUpdateAvailable = updateResponse.UpdateIsAvailable;
+                    this.updateToVersion = updateResponse.NewVersion;
+                    
+                    await this.InvokeAsync(this.StateHasChanged);
+                    await this.SendMessage<bool>(Event.STATE_HAS_CHANGED);
+                }
+                
+                break;
+        }
+    }
+
+    #endregion
+
+    private async Task DismissUpdate()
+    {
+        this.userDismissedUpdate = true;
+        this.AdditionalHeight = "0em";
+        
+        await this.SendMessage<bool>(Event.STATE_HAS_CHANGED);
+    }
+    
+    private bool IsUpdateAlertVisible
+    {
+        get
+        {
+            var state = this.isUpdateAvailable && !this.userDismissedUpdate;
+            this.AdditionalHeight = state ? "3em" : "0em";
+            
+            return state;
+        }
+    }
+
+    private async Task ShowUpdateDialog()
+    {
+        if(this.currentUpdateResponse is null)
+            return;
+        
+        //
+        // Replace the fir line with `# Changelog`:
+        //
+        var changelog = this.currentUpdateResponse.Value.Changelog;
+        if (!string.IsNullOrWhiteSpace(changelog))
+        {
+            var lines = changelog.Split('\n');
+            if (lines.Length > 0)
+                lines[0] = "# Changelog";
+            
+            changelog = string.Join('\n', lines);
+        }
+        
+        var updatedResponse = this.currentUpdateResponse.Value with { Changelog = changelog };
+        var dialogParameters = new DialogParameters<UpdateDialog>
+        {
+            { x => x.UpdateResponse, updatedResponse }
+        };
+
+        var dialogReference = await this.DialogService.ShowAsync<UpdateDialog>("Update", dialogParameters, DialogOptions.FULLSCREEN_NO_HEADER);
+        var dialogResult = await dialogReference.Result;
+        if (dialogResult.Canceled)
+            return;
+        
+        this.performingUpdate = true;
+        this.StateHasChanged();
+        await this.Rust.InstallUpdate(this.JsRuntime);
+    }
 }