🏠 Dashboard (/)
Pagina de start: privire de ansamblu peste biblioteca, scan-uri recente, recomandări și acțiuni rapide.
🎯 Ce vezi aici
- Statistici rapide despre biblioteca ta
- Recent scans (ultimii 10) — ce s-a indexat recent
- Recommended playlists (smart playlists generate automat)
- Quick actions — shortcut-uri către cele mai folosite module
🧱 Shell-ul din jurul paginii (2026-09)
Dashboard-ul (ca orice pagină) e randat în AppShell din @mmo/ui:
- Desktop: sidebar colapsabil (stare partajată prin
sidebar-context), header de pagină (PageHeader), lățime de conținutcontent-lg, centrare pe ultra-wide. - Mobil:
MobileHeader(cu safe-area sub notch) + bottom tab bar cu 5 sloturi și sheet „More”, mini-player deasupra; în aplicația instalată (PWA / Capacitor / Tauri)<html>primeștedata-standaloneși shell-ul respectă--safe-*. - Încărcare: fiecare rută are
loading.tsxcu skeleton de aceeași geometrie (fără CLS) — nu spinner. Stările goale / „nu ești logat” / „fără companion” folosescEmptyState. - Navigare: tranziții de rută cu React 19.3
<ViewTransition>(app/template.tsx); paleta de comenzi (⌘K/Ctrl+K) și overlay-ul de scurtături sunt globale.
🖼️ Layout
┌────────────────────────────────────────────────┐
│ 👋 Bun venit, DJ Vlad │
├────────────────────────────────────────────────┤
│ 📊 Stats │
│ ┌──────────┬──────────┬──────────┬─────────┐ │
│ │ Tracks │ Playlists│ BPM range│ Avg key │ │
│ │ 4,287 │ 23 │ 60-180 │ 8A │ │
│ └──────────┴──────────┴──────────┴─────────┘ │
│ Energy distribution: │
│ ▁▃▅▇▇▅▃▁ (1 → 10) │
├────────────────────────────────────────────────┤
│ 📥 Recent Scans │
│ • H:\Music\Inbox — 12 noi 2h ago │
│ • E:\Downloads — 3 noi 5h ago │
│ • H:\Music\DJ\Techno — 8 noi yesterday │
│ ... (până la 10) │
├────────────────────────────────────────────────┤
│ ⚡ Recommended Playlists │
│ [card] High Energy 128-132 BPM (47 tracks) │
│ [card] Late Night Deep (32 tracks) │
│ [card] Recently Added (last 30 zile) │
├────────────────────────────────────────────────┤
│ 🚀 Quick Actions │
│ [📚 Library] [🎚️ Mixer] [⬇ Download] [🔍 Scan]│
└────────────────────────────────────────────────┘
⌨️ Acțiuni
| Click | Te duce la |
|---|---|
| Stats card | /library cu filtru aplicat |
| Recent scan | /library cu filter "Recently added" |
| Playlist card | /playlists cu playlist-ul deschis |
| Quick action | Direct către modul |
| Energy bar | Filtrează library după energy band |
🔌 Sub capotă
| Aspect | Implementare |
|---|---|
| Server Actions | getDashboardStats(), getRecentScans(10), getRecommendedPlaylists() |
| Cache | "use cache" cu revalidate 5 min — refresh automat |
| Stats query | COUNT/AVG/MIN/MAX agregate Drizzle |
| Energy distribution | Histogram pe energy field din tracks |
💡 Tips
- Quick start după install: dacă dashboard arată gol, mergi la
/scannersau/settings→ Music Root - Daily workflow: după ce pui muzică nouă în Inbox, deschide dashboard pentru a vedea instant ce s-a indexat
- Recomandările se updatează după ce asculți / mixezi mai mult — sistemul învață ce-ți place
🔮 Roadmap
- "What's new" feed (anunțuri update + features noi)
- Listening insights (hours played, top genres, peaks)
- Goal tracker (ex: "indexează 5,000 tracks", "fă 10 mix-uri lună")
- Calendar event-uri (gig-uri viitoare cu prep playlist)