feat(ui): Hub Navigation, Profile Dashboard and Auth Stability Fixes (#31)

This PR implements the Hub Navigation system and the Profile Dashboard, while resolving critical session synchronization issues. ### Key Changes - **Hub Navigation**: Introduced `MainHubLayout` with a premium glassmorphism sidebar, providing access to Dashboard, Library, Concepts Map, and Profile. - **Profile Dashboard**: Implemented a high-fidelity Profile page (#27) with learning metrics, AI token usage tracking, and system rank visualization. - **Stability Fixes**: - Resolved an infinite network loop on the `/profile` page by implementing request deduplication and in-memory caching in `IdentityService`. - Added environment-aware guards to prevent illegal JavaScript interop calls during server-side prerendering. - Implemented automatic session invalidation on `401 Unauthorized` responses to handle stale authentication states gracefully. - **Reader Integration**: Added a "Return to Dashboard" option in the reader toolbar (#26). Closes #26 Closes #27 Reviewed-on: #31 Co-authored-by: Marek Jasiński <jasins.marek@gmail.com> Co-committed-by: Marek Jasiński <jasins.marek@gmail.com>
2026-05-10 17:36:35 +00:00
parent 34794db209
commit 2e23a032d3
56 changed files with 4292 additions and 481 deletions
@@ -0,0 +1,106 @@
+@inherits LayoutComponentBase
+@using NexusReader.UI.Shared.Components.Molecules
+@using NexusReader.UI.Shared.Components.Atoms
+@using NexusReader.Application.Abstractions.Services
+@using NexusReader.UI.Shared.Services
+
+<div class="hub-container">
+    <AuthorizeView>
+        <Authorized>
+            <aside class="hub-sidebar">
+                <div class="sidebar-header">
+                    <div class="logo">
+                        <NexusIcon Name="diamond" Size="24" Class="logo-icon" />
+                        <span class="logo-text">Nexus</span>
+                    </div>
+                </div>
+                
+                <nav class="sidebar-nav">
+                    <NavLink class="nav-item" href="/" Match="NavLinkMatch.All">
+                        <div class="nav-icon">
+                            <NexusIcon Name="home" Size="18" />
+                        </div>
+                        <span class="nav-text">Dashboard</span>
+                    </NavLink>
+                    <NavLink class="nav-item" href="/library">
+                        <div class="nav-icon">
+                            <NexusIcon Name="book-open" Size="18" />
+                        </div>
+                        <span class="nav-text">Library</span>
+                    </NavLink>
+                    <NavLink class="nav-item" href="/concepts-map">
+                        <div class="nav-icon">
+                            <NexusIcon Name="map" Size="18" />
+                        </div>
+                        <span class="nav-text">Concepts Map</span>
+                    </NavLink>
+                    <NavLink class="nav-item" href="/profile">
+                        <div class="nav-icon">
+                            <NexusIcon Name="message-square" Size="18" />
+                        </div>
+                        <span class="nav-text">Profile</span>
+                    </NavLink>
+                    <NavLink class="nav-item" href="/settings">
+                        <div class="nav-icon">
+                            <NexusIcon Name="settings" Size="18" />
+                        </div>
+                        <span class="nav-text">Settings</span>
+                    </NavLink>
+                    <NavLink class="nav-item" href="/concenters">
+                        <div class="nav-icon">
+                            <NexusIcon Name="target" Size="18" />
+                        </div>
+                        <span class="nav-text">Concenters</span>
+                    </NavLink>
+                </nav>
+
+                <div class="sidebar-footer">
+                    <div class="user-brief">
+                        <div class="user-avatar">
+                            @context.User.Identity?.Name?[0].ToString().ToUpper()
+                        </div>
+                        <div class="user-details">
+                            <span class="user-name">@context.User.Identity?.Name</span>
+                        </div>
+                    </div>
+                    <button class="logout-btn" @onclick="HandleLogout" title="Logout">
+                        <NexusIcon Name="log-out" Size="18" />
+                    </button>
+                </div>
+            </aside>
+        </Authorized>
+    </AuthorizeView>
+
+    <main class="hub-main">
+        <div class="hub-content">
+            @Body
+        </div>
+    </main>
+</div>
+
+@code {
+    [Inject] private AuthenticationStateProvider AuthStateProvider { get; set; } = default!;
+    [Inject] private IIdentityService IdentityService { get; set; } = default!;
+    [Inject] private NavigationManager NavigationManager { get; set; } = default!;
+
+    private bool _isSyncing = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        if (_isSyncing) return;
+        
+        var authState = await AuthStateProvider.GetAuthenticationStateAsync();
+        if (!authState.User.Identity?.IsAuthenticated ?? true)
+        {
+            _isSyncing = true;
+            // Try to sync with server cookie
+            await IdentityService.GetProfileAsync();
+        }
+    }
+
+    private async Task HandleLogout()
+    {
+        await IdentityService.LogoutAsync();
+        NavigationManager.NavigateTo("/", true);
+    }
+}