import React, { useState } from "react";
import styles from "./StatPage.module.css";
import ParticipationChart from "../../components/chart/ParticipationChart.jsx";
import IncompleteEvents from "../../components/IncompleteEvent/IncompleteEvent.jsx";
import PendingMembers from "../../components/PendingMembers/PendingMembers.jsx";

function StatPage() {
  const [selected, setSelected] = useState("3");
  const [participationRate, setParticipationRate] = useState(89);

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

export default StatPage;