...

ET/Web/Layout/NavMenu.razor

@@ -1,4 +1,6 @@
-<div class="top-row ps-3 navbar navbar-dark">
+@inject Web.Services.DocsService DocsService
+
+<div class="top-row ps-3 navbar navbar-dark">
     <div class="container-fluid">
         <a class="navbar-brand" href="">Web</a>
         <button title="Navigation menu" class="navbar-toggler" @onclick="ToggleNavMenu">
@@ -24,16 +26,30 @@
                 <span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Weather
             </NavLink>
         </div>
-        <div class="nav-item px-3">
-            <NavLink class="nav-link" href="docs">
-                <span class="bi bi-file-text-nav-menu" aria-hidden="true"></span> Docs
-            </NavLink>
-        </div>
+
+        <div class="nav-item px-3 nav-section-header">Documentation</div>
+
+        @if (notes == null)
+        {
+            <div class="nav-item px-3"><span class="nav-link text-secondary">Loading...</span></div>
+        }
+        else
+        {
+            @foreach (var note in notes)
+            {
+                <div class="nav-item px-3 nav-item-doc">
+                    <NavLink class="nav-link" href="@($"docs/{note.Slug}")">
+                        @note.Title
+                    </NavLink>
+                </div>
+            }
+        }
     </nav>
 </div>
 
 @code {
     private bool collapseNavMenu = true;
+    private List<Web.Models.NoteInfo>? notes;
 
     private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;
 
@@ -42,4 +58,9 @@
         collapseNavMenu = !collapseNavMenu;
     }
 
-}
+    protected override async Task OnInitializedAsync()
+    {
+        var index = await DocsService.GetIndexAsync();
+        notes = index.Notes.OrderBy(n => n.Title).ToList();
+    }
+}