source: frontend/web3-eDnevnik_Frontend/src/pages/PredmetenNastavnikPages/PredmetenNastavnik_StudentsView/PredmetenNastavnik_StudentsView.jsx

import { useState, useEffect } from "react";

import { Link, useParams, useNavigate } from "react-router-dom";
import axios from "axios";
import NavbarKlasen from "../../../components/navbarKlasen/NavbarKlasen.jsx";

const PredmetenNastavnik_StudentsView = () => {
  const { classId } = useParams();
  const navigate = useNavigate();
  const [students, setStudents] = useState([]);
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    const fetchStudentsAndParents = async () => {
      try {
        setLoading(true);

        const response = await axios.get(
          `http://localhost:8080/api/klas/${classId}/students`,
          { withCredentials: true }
        );
        const studentsData = response.data;

        const studentsWithParents = await Promise.all(
          studentsData.map(async (student) => {
            if (student.staratelId) {
              try {
                const parentRes = await axios.get(
                  `http://localhost:8080/api/users/roditeli/${student.staratelId}`,
                  { withCredentials: true }
                );

                return { ...student, parentInfo: parentRes.data };
              } catch (err) {
                console.error(`Грешка за родител ${student.staratelId}:`, err);
                return { ...student, parentInfo: null };
              }
            }
            return { ...student, parentInfo: null };
          })
        );

        setStudents(studentsWithParents);
      } catch (err) {
        console.error("Грешка при вчитување податоци:", err);
      } finally {
        setLoading(false);
      }
    };

    if (classId) fetchStudentsAndParents();
  }, [classId]);

  if (loading)
    return (
      <div>
        <NavbarKlasen />
        <div>Вчитување на учениците...</div>
      </div>
    );

  return (
    <div>
      <div>
        <NavbarKlasen />
        <div className="navbar navbar-expand-lg bg-secondary justify-content-start ">
          <ul className="navbar-nav">
            <li className="nav-item active">
              <Link className="nav-link text-white fs-4">
                {" "}
                Соопштенија за класот{" "}
              </Link>
            </li>

            <li className="nav-item">
              <Link
                className="nav-link text-white fs-4"
                to={`/predmetenNastavnikDashboard/klas/${classId}/weeklyPlan`}
              >
                {" "}
                Неделни активности
              </Link>
            </li>
            <li className="nav-item">
              <Link
                className="nav-link text-white fs-4"
                to={`/predmetenNastavnikDashboard/klas/${classId}/schedule`}
              >
                {" "}
                Распоред
              </Link>
            </li>
            <li className="nav-item">
              <Link
                className="nav-link text-white fs-4"
                to={`/predmetenNastavnikDashboard/klas/${classId}/students`}
              >
                {" "}
                Студенти
              </Link>
            </li>
            <li className="nav-item">
              <Link
                className="nav-link text-white fs-4"
                to={`/predmetenNastavnikDashboard/klas/${classId}/subjects`}
              >
                {" "}
                Види слушани предмети
              </Link>
            </li>
          </ul>
        </div>

        <h1>Ученици</h1>

        <div>
          <table className="table table-striped">
            <thead>
              <tr>
                <th>Р. број</th>
                <th>Име</th>
                <th>Презиме</th>
                <th>Пол</th>
                <th>Старател</th>
                <th>Адреса</th>
                <th>Телефонски број</th>
                <th>Акции</th>
              </tr>
            </thead>
            <tbody>
              {students.map((student, index) => (
                <tr key={student.id}>
                  <td>{index + 1}.</td>
                  <td>{student.ime}</td>
                  <td>{student.prezime}</td>
                  <td>{student.pol === "Masko" ? "Машко" : "Женско"}</td>
                  <td>
                    {student.parentInfo
                      ? `${student.parentInfo.ime} ${student.parentInfo.prezime}`
                      : "Нема податок"}
                  </td>
                  <td>{student.adresa}</td>
                  <td>{student.mobilenTelefon}</td>
                  <td>
                    {console.log(classId)}
                    <button
                      onClick={() =>
                        navigate(
                          `/predmetenNastavnikDashboard/klas/${classId}/student/${student.id}/grades`
                        )
                      }
                    >
                      види оценки
                    </button>
                    <button
                      onClick={() =>
                        navigate(
                          `/predmetenNastavnikDashboard/klas/${classId}/student/${student.id}/attendance`
                        )
                      }
                    >
                      види присуства
                    </button>
                  </td>
                </tr>
              ))}
            </tbody>
          </table>
          {students.length === 0 && <p>Нема запишани ученици во овој клас.</p>}
        </div>
      </div>
    </div>
  );
};

export default PredmetenNastavnik_StudentsView;