import { useState, useContext } from "react";
import styles from "./AdminPage.module.css";
import ParticipationChart from "../../components/chart/ParticipationChart.jsx";
import IncompleteEvents from "../../components/IncompleteEvent/IncompleteEvent.jsx";
import PendingMembers from "../../components/PendingMembers/PendingMembers.jsx";
import { AuthContext } from "../../contexts/auth/AuthContext.js";
import { useNavigate } from "react-router";


function AdminPage() {

    const { user } = useContext(AuthContext);
    const navigate = useNavigate();

    const [selected, setSelected] = useState("3");
    const [participationRate] = useState(89);

    if(!user.isAdmin) navigate("/");

    return (
        <div className={styles.container}>
            <ParticipationChart
                selected={selected}
                setSelected={setSelected}
                participationRate={participationRate}
            />
            <div className={styles.rightSection}>
                <IncompleteEvents />
                <PendingMembers />
            </div>
        </div>
    );
}

export default AdminPage;