# CHALLENGE REACT V2
¡Hola DEV! Muchas gracias por participar en nuestro proceso de selección. Este desafío tiene como meta medir tu capacidad de completar y mejorar código ya existente, por lo que no vas a empezar desde cero, vas a tener un repo completo sobre el que vas a trabajar (FRONT + API de prueba, link más abajo). El sistema original es un pequeño CRUD que permite crear, editar, eliminar y visualizar pantallas de publicidad digital.
Hemos clasificado cada punto con un tipo de desafío: **funcional** (mejorar o crear algo a partir de una US), **técnico** (no hay cambios de cara al usuario de la app pero si en el código) y **creativo** (¡sorprendenos!).
Te recomendamos ejecutar, explorar el proyexto y leer todo el documento atentamente antes de iniciar el desarrollo.
## Objetivos:
### 1) Guardar horarios de funcionamiento en las pantallas (desafío funcional)
*US*: **Como** administrador de las pantallas **quiero** poder especificar los horarios de funcionamiento de mis pantallas **para** que solo estén disponibles en los horarios seleccionados.
* CA1: Se debe poder especificar el horario de funcionamiento por día como un rango horario
* CA2: Cada día puede tener más de un rango horario (ej: de 08:00 a 13:00 y de 16:30 a 23:00)
* CA3: Debe ser posible modificar el horario de funcionamiento por cada día independientemente
* CA4: Debe ser posible asignar los horarios de funcionamiento de la pantalla cuando la creo, cuando la edito y deben poder visualizarse cuando veo su detalle.
Los siguientes ejemplos te pueden ayudar a contextualizar el problema:
> "La pantalla 'LED Ingreso Ciudad' está prendida de lunes a viernes de 08.00 a 20.00 y los findes de semana de 10.00 a 15.00 y de 18.00 a 23.59"
> La pantalla "Shopping Abasto" está prendida los lunes de 10.00 a 22.00, de martes a jueves está apagada, y los viernes, sábados y domingos opera de 08.00 a 23.59
El usuario debe poder guardar esta información en el sistema a través de una interfaz que propongas. Queda fuera del scope del desafío que las pantallas solo estén disponibles en este horario, ya que eso es parte del sistema de compra no el de administración.
La API está preparada para recibir un parámetro "rules" de tipo string para guardar esta información. Recomendamos usar JSON guardado como string para manejar los datos.
Ejemplo de cURL que incluye el parámetro rules para crear una pantalla:
```
curl --request POST \
--url http://localhost:3000/display \
--header 'Accept: */*' \
--header 'Accept-Language: es-419,es;q=0.9,en;q=0.8' \
--header 'Authorization: Bearer MS1hZG1pbkBsYXRpbmFkLmNvbQ==' \
--header 'Connection: keep-alive' \
--header 'Content-Type: application/json' \
--header 'Origin: http://localhost:5173' \
--header 'Referer: http://localhost:5173/' \
--header 'Sec-Fetch-Dest: empty' \
--header 'Sec-Fetch-Mode: cors' \
--header 'Sec-Fetch-Site: same-site' \
--header 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/141.0.0.0 Safari/537.36' \
--header 'sec-ch-ua: "Google Chrome";v="141", "Not?A_Brand";v="8", "Chromium";v="141"' \
--header 'sec-ch-ua-mobile: ?0' \
--header 'sec-ch-ua-platform: "macOS"' \
--data '{
"name": "TEST DOCs",
"description": "Soy una descripción",
"price_per_day": 10000,
"resolution_height": 1000,
"resolution_width": 1000,
"type": "indoor",
"rules": "{[]}"
}'
```
### 2) Generar un dashboard de ventas
*US*: **Como** administrador de las pantallas **quiero** ver una dashboard gráfico con mis ventas **para** tomar mejores decisiones de negocio.
* CA1: El dashboard debe incluir una serie de tiempo / histograma de las ventas como este (por día, no mes):
* CA2: El dashboard debe incluir la fecha con menores ventas
* CA3: El dashboard debe incluir la fecha con mayores ventas
* CA4: El dashboard debe incluir el valor promedio de ventas
* CA5: Debo poder flitrar el rango de fechas para visualizar un periodo más corto
Para obtener la información del dashboard podes hacer un GET a /sales:
```
curl --request GET \
--url http://localhost:3000/sales \
--header 'User-Agent: insomnia/11.6.1'
```
La API no recibe ningún filtro, los datos que devuelve son estáticos, por lo que el filtrado se hace en el front.
### 3) Implementar REDUX (desafío técnico)
Enzo, el encargado de este sistema, nos dijo que se está usando Context en lugar de Redux y eso no le gusta, ¿podés mejorarlo implementando Redux?
### 4) Implementar una nueva funcionalidad (desafío creativo opcional)
Juli, nuestra Product Owner, siempre escucha a los desarrolladores en busca de nuevas ideas para la plataforma, ¿Se te ocurre alguna?
Te invitamos a proponer e implementar una nueva funcionalidad, si esa funcionalidad requiere de backend podés mejorar el existente, hacer un mock de los datos, llamar a otra API o cualquier otra solución que se te ocurra. *No se evaluará ningún cambio a la API*.
# Consideraciones generales:
* Evaluamos la calidad del código producido teniendo en cuenta la indentación, nombres de variables/archivos, comentarios útiles y buenas prácticas generales
* Todo lo que no está establecido en este documento queda a criterio del desarrollador/a
* El desafío es incremental, por lo que si por cualquier motivo no podés completar todos los puntos igualmente te invitamos a entregarlo. Valoramos todo el esfuerzo que coloques en el desafío, incluso si no cumple todos los puntos. Preferimos la calidad sobre la cantidad.
* Podés encontrar todo el código de base en [este link](https://gitlab.latinad.com/latinad-public/react-challenge-v2), dentro del repositorio encontrarás dos carpetas, una para el front y otra para la API. Cada README tiene toda la información básica para poder levantar todo el proyecto. Esa es una instancia self hosted de GitHub, no se deben registrar, solo clonar el repo.
* Podés iniciar sesión en el sistema con el email "admin@latinad.com" y la contraseña "1234567890".
* **No es necesario que tengas conocimiento de backend o Node.js, si tenes algun problema para levantar el backend me podes escribir.**
* Todo el código producido solo tiene fines evaluativos y no será utilizado por la organización fuera de este ejercicio.
* Tenés tiempo para completar y entregar el ejercicio hasta el miércoles 29 de octubre a las 23.59 hora de Argentina. La entrega se realiza por email, con el asunto "Entrega desafío LatinAd React - <Tu nombre completo>". Debes proveer el link a un repositorio con el código mejorado.
* En caso de progresar a la última etapa del proceso, vas a tener que defender tu desafío en una llamada con le equipo técnico.
¡Mucha suerte!
# FAQ:
En caso de recibir cualquier pregunta la voy a publicar en esta sección para que todos tengan la misma información.
> Q: ¿Qué significa CA1, CA2? R: Criterio de aceptación
> Q: ¿La API no tiene BD? R: Sí tiene, es una BD SQLite, es un pequeño archivo en el repo que se crea cuando se ejecuta por primera vez
Sign in with Wallet
Connect another wallet