VdcScoreLive/docs/07-progress-tracker.md

07 — Progress Tracker

Atualizar este ficheiro no início e fim de cada sessão de desenvolvimento.

---

Estado Geral

Fase	Estado	Progresso
Fase 0: Planeamento	✅ Completo	100%
Fase 1: Setup e Fundação	✅ Completo	100%
Fase 2: Módulo de Jogos (Live)	🔄 Em Progresso	0%
Fase 3: Módulo de Gestão	⏳ Pendente	0%
Fase 4: Estatísticas	⏳ Pendente	0%
Fase 5: Polish e Deploy	⏳ Pendente	0%

---

Próximo Passo Imediato

⏭️ Fase 1 — Setup inicial do projeto

1. npm create vite@latest football-admin -- --template react-ts
2. Instalar dependências (ver docs/02-tech-stack.md)
3. Configurar Firebase (criar .env.local com as credenciais)
4. Implementar autenticação básica
5. Criar layout base (sidebar + header)

---

Log de Sessões

Sessão 1 — [Data]

O que foi feito:

• Planeamento completo do projeto
• Documentação: project plan, tech stack, arquitetura, design system, features, handoff guide, progress tracker, firebase schema
• Mockup interativo (HTML)
• Criação do zip com toda a documentação

Próxima sessão deve começar em:

• Fase 1: Setup do projeto

---

Checklist Detalhada

Fase 1: Setup e Fundação

• Projeto Vite criado
• TypeScript configurado
• Firebase SDK instalado e configurado
• .env.local com credenciais Firebase
• React Router configurado
• Zustand store inicial (auth)
• Firebase Auth implementado
  • Página de login
  • Hook useAuth
  • ProtectedRoute component
  • Redirect lógica
• Layout base
  • Sidebar component
  • Header component
  • Layout wrapper component
• Design tokens (CSS variables)
• Tailwind configurado com tema custom
• shadcn/ui configurado
• Rota /dashboard funcional (placeholder)

Fase 2: Módulo de Jogos

• Firebase hook useGames
• Página /games — listagem
  • Filtro por jornada
  • Filtro por estado
  • Game cards
• Formulário criar jogo (/games/new)
• Formulário editar jogo (/games/:id/edit)
• Live Score Editor (/games/:id/live) ⭐
  • Layout do ecrã
  • Cronómetro
  • Botões de golo (casa e fora)
  • Modal de golo (jogador + minuto + tipo)
  • Modal de cartão
  • Lista de eventos
  • Botão intervalo
  • Botão terminar jogo
  • Firebase transaction para golo
  • Recálculo automático de standings
  • Optimistic updates
  • Undo último evento (30s)

Fase 3: Módulo de Gestão

• Firebase hook useClubs
• Página /clubs — listagem
• Formulário criar/editar clube
• Detalhe do clube (/clubs/:id)
• Firebase hook usePlayers
• Página /players — listagem + filtros
• Formulário criar/editar jogador
• Gestão de jornadas (/rounds)
• Classificação (/standings)
  • Tabela completa
  • Edição manual
  • Recalcular manualmente

Fase 4: Estatísticas

• Artilheiros (/scorers)
• Tabela de cartões
• Dashboard overview
  • Widget jogo live
  • Próximos jogos
  • Últimos resultados
  • Métricas rápidas

Fase 5: Polish e Deploy

• Testes (hooks críticos)
• Error boundaries
• Loading states em todos os componentes
• Empty states em todas as listas
• Responsividade (tablet para Live Editor)
• Firebase Security Rules finais
• firebase.json configurado
• npm run deploy funcional
• Domínio configurado (se aplicável)

---

Problemas Conhecidos / Technical Debt

Nenhum ainda — projeto em fase de planeamento

---

Decisões Tomadas e Razões

Decisão	Razão
Firebase como único backend	App cliente já usa Firebase; consistência
Dark theme como padrão	Usado durante jogos (ambientes escuros)
Optimistic updates no Live Editor	UX responsiva sem esperar pela Firebase
shadcn/ui em vez de Material/Chakra	Mais customizável, sem vendor lock-in
Zustand em vez de Redux	Menor complexidade para este tamanho