[Data/UI] Integrate Knowledge Stats into Profile Pill-Nodes #28

Open
opened 2026-05-09 17:43:44 +00:00 by mjasin · 0 comments
Owner

Context: The profile page needs to display dynamic learning metrics in a visually striking way.
Role: Full-Stack Blazor Developer.
Task: Implement the "Stats Grid" using data extracted from the application's SQLite/KnowledgeService.
Requirements:

  1. UI Components: Create a row of three floating "Pill-Nodes" just below the User Identity section:
  • Books Read
  • Concepts Mapped
  • Quiz Mastery
  1. Styling: Style them identically to the Graph Nodes: dark background, neon border, rounded corners (border-radius: 20px), and a subtle hover lift effect (transform: translateY(-2px)).
  2. Data Binding: Inject IKnowledgeService and IQuizStateService to fetch real values for "Concepts Mapped" and calculate "Quiz Mastery" (correct answers / total answers taken).
**Context:** The profile page needs to display dynamic learning metrics in a visually striking way. **Role:** Full-Stack Blazor Developer. **Task:** Implement the "Stats Grid" using data extracted from the application's SQLite/KnowledgeService. **Requirements:** 1. **UI Components:** Create a row of three floating "Pill-Nodes" just below the User Identity section: * Books Read * Concepts Mapped * Quiz Mastery 2. **Styling:** Style them identically to the Graph Nodes: dark background, neon border, rounded corners (`border-radius: 20px`), and a subtle hover lift effect (`transform: translateY(-2px)`). 3. **Data Binding:** Inject `IKnowledgeService` and `IQuizStateService` to fetch real values for "Concepts Mapped" and calculate "Quiz Mastery" (correct answers / total answers taken).
Sign in to join this conversation.
No Label
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: mjasin/Nexus.Reader#28