Initial commit: NexusArchitect Professional Workstation Overhaul

2026-04-24 20:27:22 +02:00
commit f3e94c4f42
193 changed files with 5809 additions and 0 deletions
@@ -0,0 +1,87 @@
+# 📑 Project Backlog: Nexus AI E-Reader (Mockup Implementation)
+**Architecture Framework:** .NET 10 | Blazor Component Model | CQRS with MediatR | FluentResult | Mapster
+
+---
+
+## 🟢 PHASE 1: Infrastructure & Design Tokens
+*Goal: Prepare the clean architecture foundation and the visual DNA.*
+
+### [TASK-01] Solution & Directory Structure Setup
+- **Action:** Create the folder structure: `/src` for projects, `/tests` for unit/integration tests.
+- **Details:** Initialize `NexusReader.Web` (Blazor), `NexusReader.Application`, `NexusReader.Domain`, and `NexusReader.Infrastructure`.
+- **DoD:** Solution compiles with strict folder separation.
+
+### [TASK-02] Core Library Integration
+- **Action:** Install and configure LuckyPennySoftware.MediatR, Mapster, and FluentResult.
+- **Details:** - Setup `MappingConfig` for Mapster in the Application layer.
+    - Implement a `BaseHandler` that returns `Result<T>`.
+- **DoD:** A sample Query returns a `Success` Result via MediatR.
+
+### [TASK-03] Nexus Neon Design System
+- **Action:** Implement global CSS variables in `app.css` and base Atoms.
+- **Details:** - Variables: `--nexus-neon: #00ff99`, `--nexus-bg: #121212`, `--nexus-card: #1e1e1e`.
+    - Components: `NexusButton.razor`, `NexusTypography.razor` (handling Serif for ebook, Sans for UI).
+- **DoD:** Variables are accessible via all scoped CSS files.
+
+---
+
+## 🔵 PHASE 2: Seamless Reader & AI Assistant (Left Side / Inline)
+*Goal: Implement the ebook reading logic and the "Vertical Flow" AI injection.*
+
+### [TASK-04] ReaderCanvas & Dynamic Content Injection
+- **Action:** Create `ReaderCanvas.razor` to render ebook text.
+- **Details:** - Logic to split text into blocks.
+    - Implementation of an "Injection Point" system where `AiAssistantBubble.razor` can be rendered inline between paragraphs.
+- **Mockup Match:** Text must use the high-contrast Serif font from the mockup.
+
+### [TASK-05] AiAssistantBubble Component
+- **Action:** Implement the AI chat bubble with a robot avatar.
+- **Details:** - Scoped CSS for the glowing border and dark glassmorphism background.
+    - Parameters for `DialogueText` and `ActionButtons` ("Pokaż więcej", "Rozwiąż quiz").
+    - Integration with Semantic Kernel for streaming text.
+- **DoD:** Bubble appears smoothly in the text flow without absolute positioning.
+
+---
+
+## 🟡 PHASE 3: Knowledge Graph & Brain (Right Side / Flow)
+*Goal: Implement the D3.js graph and the "You are here" logic.*
+
+### [TASK-06] D3.js Knowledge Graph Bridge
+- **Action:** Implement `KnowledgeGraph.razor` with JS Interop.
+- **Details:** - ES6 Module `knowledgeGraph.js` using D3.js v7.
+    - SVG ViewBox scaling for portrait orientation.
+    - Implementation of the "TU JESTEŚ" (You Are Here) pulsing label on the active node.
+- **DoD:** Clicking a node in JS triggers a C# EventCallback via `DotNetObjectReference`.
+
+### [TASK-07] Semantic Mapping Service
+- **Action:** Create the `GetKnowledgeGraphQuery` (CQRS).
+- **Details:** - Service uses Semantic Kernel to extract nodes from the current chapter.
+    - Mapster maps the AI raw response to the `GraphViewModel`.
+- **DoD:** Graph updates dynamically when the reader moves to a new chapter.
+
+---
+
+## 🟠 PHASE 4: Verification & Mobile Polish
+*Goal: Implement the quiz module and cross-platform readiness.*
+
+### [TASK-08] KnowledgeCheck (Quiz) Module
+- **Action:** Implement the `SubmitAnswerCommand` using MediatR.
+- **Details:** - UI: `KnowledgeCheck.razor` with radio buttons and a "Wyślij" (Submit) button.
+    - Logic: Handler returns `Result` (Success/Failure) via FluentResult.
+    - Mapster: Map `QuizDto` to `QuizViewModel`.
+- **Mockup Match:** Neon highlight on the selected/correct answer.
+
+### [TASK-09] Persistence & Cross-Platform (Hybrid)
+- **Action:** Implement `IPlatformService` for Android/iOS support.
+- **Details:** - Safe-area-insets implementation for notches.
+    - `BrowserStorage` implementation of `AppState` to save progress.
+    - Haptic feedback abstraction (trigger vibration on correct answer).
+- **DoD:** App maintains graph state after a manual refresh.
+
+---
+
+## 🛠️ Instructions for NexusArchitect
+1. **Vertical Flow Priority:** Ensure that the AI assistant and the Graph never overlay text. Use `Flexbox` or `Grid` for a single, continuous scrollable column in portrait mode.
+2. **Result Pattern:** Every single Mediator Handler **must** return `FluentResults.Result`.
+3. **Mapster:** Perform all DTO-to-UI mappings in the Query/Command Handlers, not in the Razor components.
+4. **Isolated Styles:** All specific CSS for the Neon effect must be in `.razor.css` files.