- Add LoadingState with table, card, list, and text skeleton patterns - Add EmptyState with customizable icon, title, description, and action slot - Add FilterBar with search input, clear button, and custom filter slot - Add DataTable with TanStack Table integration, sorting, and row click - Create barrel export index.ts for common components - Install tanstack-table-8-svelte-5 for Svelte 5 compatibility - Sync auth spec with authenticated user redirect requirements - Archive p03-dashboard-enhancement Refs: openspec/changes/p04-content-patterns Closes: p04-content-patterns
1.4 KiB
1.4 KiB
Proposal: Dashboard Enhancement
Overview
Transform the dashboard page into a data-rich overview with KPI stat cards and allocation preview, using the new layout components.
Goals
- Create PageHeader component for consistent page titles
- Create StatCard component for KPI display
- Enhance dashboard with team/project/ utilization KPIs
- Add quick links to common actions
- Polish login page for consistency
Non-Goals
- Allocation matrix component (done in p04)
- Other page implementations (done in p05)
Priority
MEDIUM - First "real" page using new layout
Scope
PageHeader Component
- Page title
- Optional description
- Action buttons slot
- Consistent styling
StatCard Component
- Value display
- Label
- Trend indicator (up/down)
- Icon support
- DaisyUI stat styling
Dashboard Enhancement
- Row of 4 stat cards (Active Projects, Team Members, Current Month Allocations, Avg Utilization)
- Quick actions section
- Recent activity placeholder
Login Polish
- Center card vertically
- Add app logo/branding
- Improve form styling
Success Criteria
- PageHeader component created
- StatCard component created
- Dashboard shows 4 KPI cards
- Login page polished
- All tests pass
Estimated Effort
2-3 hours
Dependencies
- p02-app-layout
Blocks
- p04-content-patterns (can start in parallel)
- p05-page-migrations