Phase 4: Páginas Dashboard
- Layout completo com Brand Descomplicar:
* Header: logo dourado, sticky, shadow-sm
* Footer: copyright Descomplicar®
* Fonts: Inter (body), Montserrat (display)
* Metadata PT-PT
- DashboardView component (client):
* Fetch sites via /api/sites
* Site selector dropdown
* Fetch metrics via /api/metrics/[siteId]?period=30d
* 4 KPI cards: visitors, sessions, engagement, pageViews
* Chart área: tráfego diário (30d)
* Chart pie: fontes de tráfego (top 10)
* Tabela: Top 20 queries GSC (clicks, impressions, CTR, position)
* Loading states em todos componentes
* Error handling com mensagens PT-PT
* Responsive: mobile/tablet/desktop
- Home page: render DashboardView
Features:
- Auto-select primeiro site na lista
- Comparação período anterior (% change)
- Formatação PT-PT (números, datas, percentagens)
- Brand colors (#cc8d00, #27a50e)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Emanuel Almeida
5c34372d42