feat: implement dynamic knowledge graph updates and state management services

src/NexusReader.UI.Shared/Components/Organisms/ReaderCanvas.razor

@@ -8,6 +8,7 @@
 @inject IThemeService ThemeService
 @inject IFocusModeService FocusMode
 @inject IReaderNavigationService NavigationService
+@inject KnowledgeCoordinator Coordinator
 
 <div class="reader-canvas @(ThemeService.IsLightMode ? "theme-light" : "theme-dark")">
     @if (ViewModel == null)
@@ -59,6 +60,31 @@
     {
         await LoadChapterAsync(NavigationService.CurrentChapterIndex);
         StateHasChanged();
+        await InitializeObserverAsync();
+    }
+
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (firstRender)
+        {
+            await InitializeObserverAsync();
+        }
+    }
+
+    private async Task InitializeObserverAsync()
+    {
+        try
+        {
+            var module = await JS.InvokeAsync<IJSObjectReference>("import", "./_content/NexusReader.UI.Shared/js/readerObserver.js");
+            await module.InvokeVoidAsync("initObserver", DotNetObjectReference.Create(this), ".reader-flow-container", ".block-wrapper");
+        }
+        catch { }
+    }
+
+    [JSInvokable]
+    public void HandleBlockReached(string blockId, string content)
+    {
+        Coordinator.OnBlockReached(blockId, content);
     }
 
     private async Task LoadChapterAsync(int index)