Impl change culture for StoryBook

src/Inc.TeamAssistant.Stories/App.razor

@@ -1,6 +1,47 @@
-<BlazingStoryApp
+@implements IAsyncDisposable
+
+@inject IJSRuntime JsRuntime
+
+<BlazingStoryApp
     EnableHotReloading="true"
-    Title="TeamAssistUI docs"
     Assemblies="[typeof(App).Assembly]"
     DefaultLayout="typeof(DefaultLayout)"
-    AvailableColorSchemes="AvailableColorSchemes.Dark"/>
+    AvailableColorSchemes="AvailableColorSchemes.Dark">
+    <BrandLogoArea>
+        UI docs <a href="#" @onclick="ChangeCulture" @onclick:preventDefault="true" class="link_change-culture">
+            @_targetLanguage
+        </a>
+    </BrandLogoArea>
+</BlazingStoryApp>
+
+@code {
+    private string _targetLanguage = LanguageSettings.DefaultLanguageId.Value;
+
+    private IJSObjectReference? _appModule;
+
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (firstRender)
+        {
+            _appModule = await JsRuntime.InvokeAsync<IJSObjectReference>(
+                "import",
+                "./App.razor.js");
+
+            var currentCulture = await _appModule.InvokeAsync<string?>("currentCulture");
+
+            _targetLanguage = currentCulture == "en" ? "ru" : "en";
+        }
+    }
+
+    private async Task ChangeCulture()
+    {
+        if (_appModule is not null)
+            await _appModule.InvokeVoidAsync("changeCulture", _targetLanguage);
+    }
+
+    public async ValueTask DisposeAsync()
+    {
+        if (_appModule is not null)
+            await _appModule.DisposeAsync();
+    }
+}

src/Inc.TeamAssistant.Stories/App.razor.js

@@ -0,0 +1,12 @@
+const cultureKey = "current_culture";
+
+export function changeCulture(culture) {
+    window.localStorage.setItem(cultureKey, culture);
+    window.location.reload();
+}
+
+export function currentCulture() {
+    let culture = window.localStorage.getItem(cultureKey);
+
+    return culture ?? "en";
+}

src/Inc.TeamAssistant.Stories/Properties/launchSettings.json

@@ -1,6 +1,6 @@
 {
   "profiles": {
-    "Inc.TeamAssistant.Stories.EN": {
+    "Inc.TeamAssistant.Stories": {
       "commandName": "Project",
       "dotnetRunMessages": true,
       "launchBrowser": true,
@@ -9,16 +9,6 @@
       "environmentVariables": {
         "ASPNETCORE_ENVIRONMENT": "Development"
       }
-    },
-    "Inc.TeamAssistant.Stories.RU": {
-      "commandName": "Project",
-      "dotnetRunMessages": true,
-      "launchBrowser": true,
-      "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
-      "applicationUrl": "http://localhost:5102",
-      "environmentVariables": {
-        "ASPNETCORE_ENVIRONMENT": "Development"
-      }
     }
   }
 }

src/Inc.TeamAssistant.Stories/_Imports.razor

@@ -8,10 +8,12 @@
 @using Microsoft.JSInterop
 @using BlazingStory.Components
 @using BlazingStory.Types
-@using Inc.TeamAssistant.Stories
-@using Inc.TeamAssistant.Stories.Layouts
-@using Inc.TeamAssistant.Stories.Components
 
+@using Inc.TeamAssistant.Primitives.Languages
 @using Inc.TeamAssistant.WebUI.Components
 @using Inc.TeamAssistant.WebUI.Services.ClientCore
-@using Inc.TeamAssistant.WebUI.Icons
+@using Inc.TeamAssistant.WebUI.Icons
+
+@using Inc.TeamAssistant.Stories
+@using Inc.TeamAssistant.Stories.Layouts
+@using Inc.TeamAssistant.Stories.Components

src/Inc.TeamAssistant.Stories/wwwroot/css/blazor-ui.css

@@ -74,6 +74,16 @@
     content: var(--blazor-load-percentage-text, "Loading");
 }
 
+/* CUSTOM */
+.link_change-culture {
+    float: right;
+    padding-right: 5px;
+}
+.link_change-culture:hover {
+    text-decoration: underline !important;
+}
+/* END CUSTOM */
+
 @media (prefers-color-scheme: dark) {
     .loading-progress {
         background-color: #222425;

src/Inc.TeamAssistant.Stories/wwwroot/iframe.html

@@ -35,10 +35,8 @@
     <script src="leaflet/leaflet.js"></script>
     <script src="_framework/blazor.webassembly.js" autostart="false"></script>
     <script>
-        let env = window.location.port === '5102' || window.location.hostname.includes("ru") ? "ru" : "en";
-
         Blazor.start({
-            environment: env
+            environment: window.localStorage.getItem("current_culture")
         });
     </script>
 </body>