76 lines
2.6 KiB
Markdown
76 lines
2.6 KiB
Markdown
# TASK-059-historical-leaderboards-timeframe-tabs-ui
|
|
|
|
## Goal
|
|
Ampliar la sección de tops de la página histórica para permitir alternar entre rankings semanales y mensuales dentro de la misma zona visual, manteniendo también las pestañas por métrica.
|
|
|
|
## Context
|
|
La sección de tops ya tiene pestañas por métrica:
|
|
- Top kills
|
|
- Top muertes
|
|
- Partidas 100+ kills
|
|
- Soporte
|
|
|
|
Ahora se quiere añadir una segunda capa de navegación temporal dentro de esa misma sección para consultar:
|
|
- semanal
|
|
- mensual
|
|
|
|
La experiencia debe seguir siendo clara, rápida y coherente con el estilo actual de la página.
|
|
|
|
## Steps
|
|
1. Revisar la UI actual de la sección de leaderboards.
|
|
2. Revisar la nueva API mensual y cómo convive con la semanal.
|
|
3. Diseñar una navegación clara para el marco temporal, por ejemplo:
|
|
- Semanal
|
|
- Mensual
|
|
4. Mantener las pestañas de métricas ya existentes dentro de ese marco temporal.
|
|
5. Hacer que la UI pueda alternar entre:
|
|
- semanal + kills
|
|
- semanal + muertes
|
|
- semanal + 100+ kills
|
|
- semanal + soporte
|
|
- mensual + kills
|
|
- mensual + muertes
|
|
- mensual + 100+ kills
|
|
- mensual + soporte
|
|
6. Mostrar el rango temporal real usado de forma clara y natural.
|
|
7. Mantener estados de loading, empty y error.
|
|
8. Mantener el rendimiento percibido razonable y compatible con la estrategia actual de snapshots.
|
|
9. No crear una nueva página; la ampliación debe quedar dentro de la sección actual de tops.
|
|
10. Al completar la implementación:
|
|
- dejar el repositorio consistente
|
|
- hacer commit
|
|
- hacer push al remoto si el entorno lo permite
|
|
|
|
## Files to Read First
|
|
- AGENTS.md
|
|
- frontend/historico.html
|
|
- frontend/assets/js/historico.js
|
|
- frontend/assets/css/historico.css
|
|
- backend/app/routes.py
|
|
- backend/app/payloads.py
|
|
- backend/README.md
|
|
|
|
## Expected Files to Modify
|
|
- frontend/historico.html
|
|
- frontend/assets/js/historico.js
|
|
- frontend/assets/css/historico.css
|
|
- opcionalmente backend docs mínimas si cambia el contrato visible de uso
|
|
|
|
## Constraints
|
|
- No romper el flujo actual semanal.
|
|
- No introducir frameworks nuevos.
|
|
- No crear páginas nuevas.
|
|
- No hacer cambios destructivos.
|
|
- Mantener el trabajo centrado en la navegación temporal dentro de los tops.
|
|
|
|
## Validation
|
|
- La sección de tops permite alternar entre semanal y mensual.
|
|
- Siguen funcionando las métricas actuales.
|
|
- El rango temporal mostrado es claro.
|
|
- La UI sigue siendo coherente con el resto de la página histórica.
|
|
- Los cambios quedan committeados y se hace push si el entorno lo permite.
|
|
|
|
## Change Budget
|
|
- Preferir menos de 5 archivos modificados.
|
|
- Preferir menos de 220 líneas cambiadas.
|