Changed the update notification to use the default notification system (#386)

app/MindWork AI Studio/Components/InnerScrolling.razor.cs

@@ -1,5 +1,3 @@
-using AIStudio.Layout;
-
 using Microsoft.AspNetCore.Components;
 
 namespace AIStudio.Components;
@@ -30,9 +28,6 @@ public partial class InnerScrolling : MSGComponentBase
     [Parameter]
     public string Style { get; set; } = string.Empty;
     
-    [CascadingParameter]
-    private MainLayout MainLayout { get; set; } = null!;
-    
     [Inject]
     private IJSRuntime JsRuntime { get; init; } = null!;
     

app/MindWork AI Studio/Layout/MainLayout.razor

@@ -45,26 +45,11 @@
 
         <MudMainContent Class="mud-height-full pt-1" Style="@this.PaddingLeft">
             <MudContainer MaxWidth="MaxWidth.ExtraExtraLarge" Class="mud-height-full" Style="margin-left: 5em; width: calc(100% - 5em);">
-                @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
-                        @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"/>

app/MindWork AI Studio/Layout/MainLayout.razor.cs

@@ -37,8 +37,6 @@ public partial class MainLayout : LayoutComponentBase, IMessageBusReceiver, IDis
     
     [Inject]
     private MudTheme ColorTheme { get; init; } = null!;
-
-    public string AdditionalHeight { get; private set; } = "0em";
     
     private string PaddingLeft => this.navBarOpen ? $"padding-left: {NAVBAR_EXPANDED_WIDTH_INT - NAVBAR_COLLAPSED_WIDTH_INT}em;" : "padding-left: 0em;";
     
@@ -48,10 +46,7 @@ public partial class MainLayout : LayoutComponentBase, IMessageBusReceiver, IDis
     private static readonly string NAVBAR_EXPANDED_WIDTH = $"{NAVBAR_EXPANDED_WIDTH_INT}em";
     
     private bool navBarOpen;
-    private bool isUpdateAvailable;
     private bool performingUpdate;
-    private bool userDismissedUpdate;
-    private string updateToVersion = string.Empty;
     private UpdateResponse? currentUpdateResponse;
     private MudThemeProvider themeProvider = null!;
     private bool useDarkMode;
@@ -107,7 +102,7 @@ public partial class MainLayout : LayoutComponentBase, IMessageBusReceiver, IDis
         
         // Register this component with the message bus:
         this.MessageBus.RegisterComponent(this);
-        this.MessageBus.ApplyFilters(this, [], [ Event.UPDATE_AVAILABLE, Event.USER_SEARCH_FOR_UPDATE, Event.CONFIGURATION_CHANGED, Event.COLOR_THEME_CHANGED, Event.SHOW_ERROR ]);
+        this.MessageBus.ApplyFilters(this, [], [ Event.UPDATE_AVAILABLE, Event.CONFIGURATION_CHANGED, Event.COLOR_THEME_CHANGED, Event.SHOW_ERROR ]);
         
         // Set the snackbar for the update service:
         UpdateService.SetBlazorDependencies(this.Snackbar);
@@ -142,19 +137,24 @@ public partial class MainLayout : LayoutComponentBase, IMessageBusReceiver, IDis
     {
         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.Snackbar.Add($"An update to version {updateResponse.NewVersion} is available.", Severity.Info, config =>
-                    this.updateToVersion = updateResponse.NewVersion;
+                    {
-                    
+                        config.Icon = Icons.Material.Filled.Update;
-                    await this.InvokeAsync(this.StateHasChanged);
+                        config.IconSize = Size.Large;
-                    await this.SendMessage<bool>(Event.STATE_HAS_CHANGED);
+                        config.HideTransitionDuration = 600;
+                        config.VisibleStateDuration = 32_000;
+                        config.OnClick = async _ =>
+                        {
+                            await this.ShowUpdateDialog();
+                        };
+                        config.Action = "Show details";
+                        config.ActionVariant = Variant.Filled;
+                        config.ActionColor = Color.Dark;
+                    });
                 }
                 
                 break;
@@ -207,25 +207,6 @@ public partial class MainLayout : LayoutComponentBase, IMessageBusReceiver, IDis
         yield return new("About", Icons.Material.Filled.Info, palette.DarkLighten, palette.GrayLight, Routes.ABOUT, false);
         yield return new("Settings", Icons.Material.Filled.Settings, palette.DarkLighten, palette.GrayLight, Routes.SETTINGS, false);
     }
-    
-    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()
     {

app/MindWork AI Studio/wwwroot/app.css

@@ -6,6 +6,7 @@
     font-weight: 300;
     src: url('fonts/roboto-v30-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
 }
+
 /* roboto-regular - latin */
 @font-face {
     font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
@@ -14,6 +15,7 @@
     font-weight: 400;
     src: url('fonts/roboto-v30-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
 }
+
 /* roboto-500 - latin */
 @font-face {
     font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
@@ -22,6 +24,7 @@
     font-weight: 500;
     src: url('fonts/roboto-v30-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
 }
+
 /* roboto-700 - latin */
 @font-face {
     font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */

app/MindWork AI Studio/wwwroot/changelog/v0.9.39.md

@@ -5,6 +5,7 @@
 - Added the plugin overview page. This page shows all installed plugins and allows you to enable or disable them. It is only available when the plugin preview feature is enabled.
 - Added hot reloading for plugins. When any plugin is changed, the app will automatically reload the plugin without needing to restart the app.
 - Added an API for streaming arbitrary local files to the embedding process. Thanks Nils `nilskruthoff` for this great contribution.
+- Changed the update notification to use the default notification system at the bottom instead of the custom alert bar at the top.
 - Fixed the preview tooltip component not showing the correct position when used inside a scrollable container.
 - Upgraded to Rust v1.86.0
 - Upgraded to MudBlazor v8.5.1