Worker Activity Dashboard - Copy this React, Tailwind Component to your project

Genera un dashboard para visualizar las horas de actividad del trabajador segun lo obtenido del siguiente endpoint: router.get('/api/saed actividad/:discordId', async (req, res) => { const { discordId } = req.params; const { startDate, endDate } = req.query; try { const connection = await pool.getConnection(); try { const [rows] = await connection.query( `SELECT DATE(registro) as fecha, SUM(tiempoServicio) as horas FROM saed_fichaje WHERE discord = ? AND registro BETWEEN ? AND ? GROUP BY DATE(registro) ORDER BY fecha ASC`, [discordId, startDate, endDate] ); const fechas = []; const actividadSemanal = []; let totalHoras = 0; rows.forEach(row => { fechas.push(row.fecha.toISOString().split('T')[0]); actividadSemanal.push(row.horas); totalHoras += Number(row.horas); }); res.json({ fechas, actividadSemanal, totalHoras: totalHoras / 60 // Convertir a horas }); } finally { connection.release(); } } catch (error) { console.error("Error al consultar la actividad:", error); res.status(500).send("Error al consultar la actividad"); } }); Se debe poder justar los rangos de fecha, indicar que trabajador se visualiza y el listado de registros