From 9622e9285b7866307eb5e5e7838339b4ea90d2ba Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 10 Aug 2025 10:53:49 +0800 Subject: [PATCH 1/5] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=20GetPreferredTh?= =?UTF-8?q?emeAsync=20=E6=89=A9=E5=B1=95=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Extensions/JSModuleExtensions.cs | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/BootstrapBlazor/Extensions/JSModuleExtensions.cs b/src/BootstrapBlazor/Extensions/JSModuleExtensions.cs index 97f70b823b5..095fd081bd1 100644 --- a/src/BootstrapBlazor/Extensions/JSModuleExtensions.cs +++ b/src/BootstrapBlazor/Extensions/JSModuleExtensions.cs @@ -171,6 +171,13 @@ public static string GetTypeModuleName(this Type type) /// public static ValueTask GetThemeAsync(this JSModule module) => module.InvokeAsync("getTheme"); + /// + /// Get the perferred theme method + /// + /// An instance of + /// + public static ValueTask GetPreferredThemeAsync(this JSModule module) => module.InvokeAsync("getPreferredTheme"); + /// /// Set memorial mode /// From e6eec99319bba9e387ef3c632813a3cd8a70d0a2 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 10 Aug 2025 10:56:58 +0800 Subject: [PATCH 2/5] =?UTF-8?q?doc:=20=E6=9B=B4=E6=96=B0=E4=B8=BB=E9=A2=98?= =?UTF-8?q?=E5=8A=A0=E8=BD=BD=E9=80=BB=E8=BE=91=E9=98=B2=E6=AD=A2=E6=8A=96?= =?UTF-8?q?=E5=8A=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Layout/BaseLayout.razor | 11 ++++--- .../Components/Layout/BaseLayout.razor.cs | 32 +++++++++++++++++++ .../Components/Layout/BaseLayout.razor.js | 6 ++++ 3 files changed, 45 insertions(+), 4 deletions(-) create mode 100644 src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.js diff --git a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor index 2c3286201cf..d31966d483f 100644 --- a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor +++ b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor @@ -1,10 +1,13 @@ @inherits LayoutComponentBase -
-
- @Body -
+ @if (_init) + { +
+
+ @Body +
+ }
diff --git a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.cs b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.cs index 324edf5136a..8a2fcc1d4fd 100644 --- a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.cs @@ -3,6 +3,10 @@ // See the LICENSE file in the project root for more information. // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone +using BootstrapBlazor.Server.Data; +using Microsoft.Extensions.Options; +using Microsoft.JSInterop; + namespace BootstrapBlazor.Server.Components.Layout; /// @@ -10,6 +14,10 @@ namespace BootstrapBlazor.Server.Components.Layout; /// public partial class BaseLayout : IDisposable { + [Inject] + [NotNull] + private IJSRuntime? JSRuntime { get; set; } + [Inject] [NotNull] private IStringLocalizer? Localizer { get; set; } @@ -26,6 +34,10 @@ public partial class BaseLayout : IDisposable [NotNull] private IDispatchService? RebootDispatchService { get; set; } + [Inject] + [NotNull] + private IOptions? WebsiteOption { get; set; } + [NotNull] private string? FlowText { get; set; } @@ -38,6 +50,8 @@ public partial class BaseLayout : IDisposable [NotNull] private string? CancelText { get; set; } + private bool _init = false; + /// /// /// @@ -54,6 +68,24 @@ protected override void OnInitialized() RebootDispatchService.Subscribe(NotifyReboot); } + /// + /// + /// + /// + /// + protected override async Task OnAfterRenderAsync(bool firstRender) + { + await base.OnAfterRenderAsync(firstRender); + + if (firstRender) + { + var module = await JSRuntime.LoadModule($"{WebsiteOption.Value.JSModuleRootPath}Layout/BaseLayout.razor.js"); + await module.InvokeVoidAsync("initTheme"); + _init = true; + StateHasChanged(); + } + } + private async Task NotifyCommit(DispatchEntry payload) { if (payload.CanDispatch()) diff --git a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.js b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.js new file mode 100644 index 00000000000..d99cbe5effa --- /dev/null +++ b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.js @@ -0,0 +1,6 @@ +import { getPreferredTheme, setTheme } from "../../_content/BootstrapBlazor/modules/utility.js" + +export function initTheme() { + const currentTheme = getPreferredTheme(); + setTheme(currentTheme, false); +} From fbfca6a706d0b183cabd04c985dfff8212a64588 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 10 Aug 2025 19:44:37 +0800 Subject: [PATCH 3/5] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=E6=80=A7?= =?UTF-8?q?=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Layout/BaseLayout.razor.cs | 15 +++++---------- 1 file changed, 5 insertions(+), 10 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.cs b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.cs index 8a2fcc1d4fd..1ec51dc3808 100644 --- a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.cs @@ -71,19 +71,14 @@ protected override void OnInitialized() /// /// /// - /// /// - protected override async Task OnAfterRenderAsync(bool firstRender) + protected override async Task OnInitializedAsync() { - await base.OnAfterRenderAsync(firstRender); + await base.OnInitializedAsync(); - if (firstRender) - { - var module = await JSRuntime.LoadModule($"{WebsiteOption.Value.JSModuleRootPath}Layout/BaseLayout.razor.js"); - await module.InvokeVoidAsync("initTheme"); - _init = true; - StateHasChanged(); - } + var module = await JSRuntime.LoadModule($"{WebsiteOption.Value.JSModuleRootPath}Layout/BaseLayout.razor.js"); + await module.InvokeVoidAsync("initTheme"); + _init = true; } private async Task NotifyCommit(DispatchEntry payload) From dbbd3903acee7babc8ef60806de247855d9cd874 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Mon, 11 Aug 2025 12:48:33 +0800 Subject: [PATCH 4/5] =?UTF-8?q?refactor:=20=E7=A7=BB=E9=99=A4=20GetPreferr?= =?UTF-8?q?edThemeAsync=20=E6=89=A9=E5=B1=95=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Extensions/JSModuleExtensions.cs | 7 ------- 1 file changed, 7 deletions(-) diff --git a/src/BootstrapBlazor/Extensions/JSModuleExtensions.cs b/src/BootstrapBlazor/Extensions/JSModuleExtensions.cs index 095fd081bd1..97f70b823b5 100644 --- a/src/BootstrapBlazor/Extensions/JSModuleExtensions.cs +++ b/src/BootstrapBlazor/Extensions/JSModuleExtensions.cs @@ -171,13 +171,6 @@ public static string GetTypeModuleName(this Type type) /// public static ValueTask GetThemeAsync(this JSModule module) => module.InvokeAsync("getTheme"); - /// - /// Get the perferred theme method - /// - /// An instance of - /// - public static ValueTask GetPreferredThemeAsync(this JSModule module) => module.InvokeAsync("getPreferredTheme"); - /// /// Set memorial mode /// From 751b9a58ce878ed7b3abb43ef53b1ba8a37e1b62 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Mon, 11 Aug 2025 12:49:07 +0800 Subject: [PATCH 5/5] =?UTF-8?q?refactor:=20=E5=88=A0=E9=99=A4=20getPreferr?= =?UTF-8?q?edTheme=20=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Components/Pre.razor.js | 4 ++-- .../Components/Layout/BaseLayout.razor.js | 4 ++-- .../Components/ThemeProvider/ThemeProvider.razor.js | 4 ++-- src/BootstrapBlazor/wwwroot/modules/utility.js | 12 +----------- 4 files changed, 7 insertions(+), 17 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Components/Pre.razor.js b/src/BootstrapBlazor.Server/Components/Components/Pre.razor.js index d36a6cbd382..1c4efade929 100644 --- a/src/BootstrapBlazor.Server/Components/Components/Pre.razor.js +++ b/src/BootstrapBlazor.Server/Components/Components/Pre.razor.js @@ -1,4 +1,4 @@ -import { copy, getDescribedElement, addLink, removeLink, addScript, getHeight, getPreferredTheme, registerBootstrapBlazorModule } from "../../_content/BootstrapBlazor/modules/utility.js" +import { copy, getDescribedElement, addLink, removeLink, addScript, getHeight, getTheme, registerBootstrapBlazorModule } from "../../_content/BootstrapBlazor/modules/utility.js" import EventHandler from "../../_content/BootstrapBlazor/modules/event-handler.js" export async function init(id, title, assetRoot) { @@ -9,7 +9,7 @@ export async function init(id, title, assetRoot) { await addScript(`${assetRoot}lib/highlight/highlight.min.js`) await addScript(`${assetRoot}lib/highlight/cshtml-razor.min.js`) - await switchTheme(getPreferredTheme(), assetRoot); + await switchTheme(getTheme(), assetRoot); const preElement = el.querySelector('pre') const code = el.querySelector('pre > code') diff --git a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.js b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.js index d99cbe5effa..6d4599d796a 100644 --- a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.js +++ b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.js @@ -1,6 +1,6 @@ -import { getPreferredTheme, setTheme } from "../../_content/BootstrapBlazor/modules/utility.js" +import { getTheme, setTheme } from "../../_content/BootstrapBlazor/modules/utility.js" export function initTheme() { - const currentTheme = getPreferredTheme(); + const currentTheme = getTheme(); setTheme(currentTheme, false); } diff --git a/src/BootstrapBlazor/Components/ThemeProvider/ThemeProvider.razor.js b/src/BootstrapBlazor/Components/ThemeProvider/ThemeProvider.razor.js index 0e51455a0f6..eb6112fb489 100644 --- a/src/BootstrapBlazor/Components/ThemeProvider/ThemeProvider.razor.js +++ b/src/BootstrapBlazor/Components/ThemeProvider/ThemeProvider.razor.js @@ -1,4 +1,4 @@ -import { getPreferredTheme, setTheme, switchTheme, calcCenterPosition } from "../../modules/utility.js" +import { getTheme, setTheme, switchTheme, calcCenterPosition } from "../../modules/utility.js" import EventHandler from "../../modules/event-handler.js" import Data from "../../modules/data.js" @@ -17,7 +17,7 @@ export function init(id, invoke, themeValue, callback) { let currentTheme = themeValue; if (currentTheme === 'useLocalStorage') { - currentTheme = getPreferredTheme(); + currentTheme = getTheme(); } setTheme(currentTheme, true); theme.currentTheme = currentTheme; diff --git a/src/BootstrapBlazor/wwwroot/modules/utility.js b/src/BootstrapBlazor/wwwroot/modules/utility.js index 8cc314048fe..e01a94c81cc 100644 --- a/src/BootstrapBlazor/wwwroot/modules/utility.js +++ b/src/BootstrapBlazor/wwwroot/modules/utility.js @@ -716,18 +716,8 @@ export function getHtml(options) { return html; } - -export function getPreferredTheme() { - const storedTheme = getTheme() - if (storedTheme) { - return storedTheme - } - - return getAutoThemeValue(); -} - export function getTheme() { - return localStorage.getItem('theme') || document.documentElement.getAttribute('data-bs-theme') || 'light'; + return localStorage.getItem('theme') || document.documentElement.getAttribute('data-bs-theme') || getAutoThemeValue(); } export function saveTheme(theme) {