"use client";
import { useEffect, useState } from "react";
import { api } from "muzak/data/fetcher";
import { useSession } from "muzak/contexts/SessionContext";

export default function PostGame() {
  const { sessionId, setSessionId } = useSession();
  const [trackCount, setTrackCount] = useState(0);
  const [voteCount, setVoteCount] = 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"]);
  }
  useEffect(() => {
    getInfo();
  }, []);

  return (
    <main className="flex min-h-screen flex-col items-center justify-between p-24">
      <h1>Post-game</h1>
      <p>Bedankt voor het stemmen!</p>
      <p>;)</p>
      <p>Piemels</p>
      <p>{trackCount} tracks</p>
      <p>{voteCount} votes</p>
    </main>
  );
}
