function MonitorPage({ store, navigate }) { const [now, setNow] = React.useState(Date.now()); const [countdown, setCountdown] = React.useState(10); React.useEffect(() => { const refresh = setInterval(() => { setNow(Date.now()); setCountdown(10); }, 10000); const tick = setInterval(() => setCountdown(c => Math.max(0, c - 1)), 1000); return () => { clearInterval(refresh); clearInterval(tick); }; }, []); const todayStr = new Date(now).toDateString(); const todayAll = store.requests.filter(r => new Date(r.ts).toDateString() === todayStr); const top = todayAll.filter(r => r.status !== "played").sort((a, b) => b.votes - a.votes).slice(0, 5); const played = todayAll.filter(r => r.status === "played").sort((a, b) => b.votes - a.votes); const [confirmReset, setConfirmReset] = React.useState(false); const medals = ["var(--orange)", "#aaaaaa", "#cd7f32"]; const exportCsv = () => { const dateStr = new Date().toLocaleDateString("it-IT"); const q = (s) => `"${String(s).replace(/"/g, '""')}"`; const rows = [["orario", "nome", "artista", "titolo"].map(q).join(",")]; [...top, ...played] .flatMap(r => (r.voteLog || [{ ts: r.ts, requester: r.requester }]).map(v => ({ ...v, title: r.title, artist: r.artist }))) .sort((a, b) => a.ts - b.ts) .forEach(v => { const t = new Date(v.ts).toLocaleTimeString("it-IT", { hour: "2-digit", minute: "2-digit", second: "2-digit" }); rows.push([t, v.requester, v.artist, v.title].map(q).join(",")); }); const blob = new Blob([rows.join("\n")], { type: "text/csv;charset=utf-8" }); const a = Object.assign(document.createElement("a"), { href: URL.createObjectURL(blob), download: `classifica-${dateStr.replace(/\//g, "-")}.csv` }); a.click(); URL.revokeObjectURL(a.href); }; return (
{/* Header */}
● CLASSIFICA DEL GIORNO
Top 5.
{new Date(now).toLocaleTimeString("it-IT", { hour: "2-digit", minute: "2-digit" })}
refresh in {countdown}s
{/* Top 5 */} {top.length === 0 ? (
Nessuna richiesta ancora oggi.
) : (
{top.map((r, i) => (
{i + 1}
{r.title}
{r.artist}
{r.votes}
))}
)} {/* Dialog conferma reset */} {confirmReset && (
Vuoi esportare la classifica?
)} {/* Storico */} {played.length > 0 && (
SUONATE
{played.map(r => (
{r.title}
{r.artist}
{r.votes}v
))}
)}
); } window.MonitorPage = MonitorPage;