feat: implement dashboard mockup and route

tickets/2026-01-07-web-interface-feature-expansion.md

@@ -0,0 +1,50 @@
+# 2026-01-07-web-interface-feature-expansion
+
+**Status:** Draft
+**Created:** 2026-01-07
+**Tags:** product-design, feature-request, ui
+
+## 1. Context & User Story
+* **As a:** Bot Administrator
+* **I want to:** have more useful features on the web dashboard
+* **So that:** getting insights into the bot's performance and managing it becomes easier than using text commands.
+
+## 2. Technical Requirements
+### Proposed Features
+1.  **Live Console / Activity Feed:**
+    *   Stream abbreviated logs or important events (e.g., "User X joined", "Command Y executed").
+2.  **Metrics Dashboard:**
+    *   Visual charts for command usage (Top 5 commands).
+    *   Memory usage and CPU load over time.
+    *   API Latency gauge.
+3.  **Command Palette / Control Panel:**
+    *   Buttons to clear cache, reload configuration, or restart specific services.
+4.  **Guild/User Browser:**
+    *   Read-only list of top guilds or users by activity/economy balance.
+
+### Data Model Changes
+- [ ] May require exposing existing Service data to the Web module.
+
+### API / Interface
+- [ ] `GET /api/stats` or `WS` subscription for metrics.
+- [ ] `GET /api/logs` (tail).
+
+## 3. Constraints & Validations (CRITICAL)
+- **Security:** Modifying bot state (Control Panel) requires strict authentication/authorization (Future Ticket). For now, read-only/safe actions only.
+- **Privacy:** Do not expose sensitive user PII in the web logs or dashboard without encryption/masking.
+
+## 4. Acceptance Criteria
+1. [ ] A list of prioritized features is approved.
+2. [ ] UI Mockups (code or image) for the "Dashboard" view.
+3. [ ] Data sources for these features are identified in the codebase.
+
+## 5. Implementation Plan
+- [x] **Phase 1:** Brainstorm & Mockup (This Ticket).
+- [ ] **Phase 2:** Create individual implementation tickets for selected features (e.g., "Implement Metrics Graph").
+
+## Implementation Notes
+- Created `/dashboard` route with a code-based mockup.
+- Implemented responsive CSS Grid layout for the dashboard.
+- Integrated real `AuroraClient` data for Server Count, User Count, and Command Count.
+- Added placeholder UI for "Live Activity" and "Metrics".
+- Next steps: Connect WebSocket "HEARTBEAT" to the dashboard metrics and implement real logger streaming.