Files
muzak/frontend/src/app/post-game/page.tsx
T
2025-08-22 12:20:11 +02:00

61 lines
1.9 KiB
TypeScript

"use client";
import { useEffect, useState } from "react";
import { api } from "muzak/data/fetcher";
import { useSession } from "muzak/contexts/SessionContext";
import { Nunito } from "next/font/google";
const nunito = Nunito({
weight: "900",
subsets: ["latin"],
});
export default function PostGame() {
const { sessionId, setSessionId } = useSession();
const [trackCount, setTrackCount] = useState(0);
const [voteCount, setVoteCount] = useState(0);
const [averageVote, setAverageVote] = useState(0);
async function getInfo() {
const { data: info } = await api.sessions.info({ session_id: sessionId });
console.log(info);
setTrackCount(info["track_count"]);
setVoteCount(info["vote_count"]);
setAverageVote(info["average_vote"]);
}
useEffect(() => {
getInfo();
}, []);
return (
<main className="flex min-h-screen flex-col items-center justify-between p-24">
<p
className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
>
Bedankt voor het stemmen!
</p>
<div className="flex flex-col text-center">
<p
className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
>
Jullie hebben {voteCount} stemmen uitgebracht op {trackCount} nummers.
</p>
<p
className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
>
Gemiddeld vonden jullie {(averageVote * 100).toFixed(0)}% van de
nummers best oké.
</p>
<p
className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
>
Applaus voor jezelf!
</p>
</div>
<p
className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
>
Tot HDcon!
</p>
</main>
);
}