source: frontend/web3-eDnevnik_Frontend/src/pages/RoditelPages/Roditel_ViewOcenki/Roditel_ViewOcenki.jsx

import React, { useState, useEffect } from "react";
import axios from "axios";
import { useParams, useNavigate } from "react-router-dom";
import styles from "./Roditel_ViewOcenkiStyles.module.css";
import NavbarRoditel from "../../../components/NavbarRoditel/NavbarRoditel.jsx";

const Roditel_ViewOcenki = () => {
  const { studentId } = useParams();
  const navigate = useNavigate();
  const [data, setData] = useState(null);
  const [loading, setLoading] = useState(true);
  const [teachersMap, setTeachersMap] = useState({});

  useEffect(() => {
    const fetchFullData = async () => {
      try {
        setLoading(true);
        const response = await axios.get(
          `http://localhost:8080/api/users/ucenici/${studentId}/ocenki`,
          { withCredentials: true }
        );

        const gradesData = response.data;

        if (!gradesData || !gradesData.predmeti) {
          setData(gradesData);
          setLoading(false);
          return;
        }

        setData(gradesData);

        const teacherIds = new Set();

        gradesData.predmeti.forEach((predmet) => {
          (predmet.usniOcenki || []).forEach((o) =>
            teacherIds.add(o.vnesena_Od)
          );
          (predmet.pismeniOcenki || []).forEach((o) =>
            teacherIds.add(o.vnesena_Od)
          );
          (predmet.krajniOcenki || []).forEach((o) =>
            teacherIds.add(o.vnesena_Od)
          );
        });

        const teacherMap = {};
        await Promise.all(
          Array.from(teacherIds).map(async (tId) => {
            if (!tId) return;
            try {
              const tRes = await axios.get(
                `http://localhost:8080/api/users/nastavnici/${tId}`,
                { withCredentials: true }
              );
              teacherMap[tId] = `${tRes.data.ime} ${tRes.data.prezime}`;
            } catch (e) {
              console.warn(`Наставникот со ID ${tId} не е најден.`);
              teacherMap[tId] = "Непознат наставник";
            }
          })
        );

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

    if (studentId) fetchFullData();
  }, [studentId]);

  if (loading) return <div className={styles.loader}>Вчитување...</div>;
  if (!data)
    return <div className={styles.error}>Нема податоци за овој ученик.</div>;

  const handleVnesiUsnaOcenka = () => {
    navigate("insertUsnaOcenka");
  };

  return (
    <div className={styles.pageWrapper}>
      <NavbarRoditel />

      <div className={styles.mainContainer}>
        <div className={styles.contentHeader}>
          <h1>
            Оценки за {data.ime} {data.prezime}
          </h1>
        </div>

        {data.predmeti.map((predmet) => (
          <div key={predmet.predmetId} className={styles.subjectSection}>
            <h2 className={styles.subjectTitle}>
              Предмет: {predmet.predmetIme}
            </h2>

           
            <div className={styles.gradeBox}>
              <h3 className={styles.boxTitle}>Усни оценки</h3>
              <table className={styles.gradeTable}>
                <thead>
                  <tr>
                    <th>Оценка</th>
                    <th>датум</th>
                    <th>Забелешка</th>
                    <th>Тема</th>
                    <th>Освоени поени/Мах поени</th>
                    <th>вид</th>
                    <th>Внесена од</th>
                  </tr>
                </thead>
                <tbody>
                  {predmet.usniOcenki.length > 0 ? (
                    predmet.usniOcenki.map((o) => (
                      <tr key={o.id}>
                        <td className={styles.gradeNum}>{o.ocenka}</td>
                        <td>{o.datum}</td>
                        <td>{o.zabeleska}</td>
                        <td>{o.tema}</td>
                        <td>
                          {o.osvoeni_poeni}/{o.max_poeni}
                        </td>
                        <td>{o.vid_isprasuvanje}</td>
                        <td className={styles.teacherName}>
                          {teachersMap[o.vnesena_Od]}
                        </td>
                      </tr>
                    ))
                  ) : (
                    <tr>
                      <td colSpan="7" className={styles.noGrades}>
                        Нема усни оценки
                      </td>
                    </tr>
                  )}
                </tbody>
              </table>
            </div>

            <div className={styles.gradeBox}>
              <h3 className={styles.boxTitle}>Писмени оценки</h3>
              <table className={styles.gradeTable}>
                <thead>
                  <tr>
                    <th>Оценка</th>
                    <th>датум</th>
                    <th>Забелешка</th>
                    <th>Тема</th>
                    <th>Освоени поени/Мах поени</th>
                    <th>вид</th>
                    <th>Внесена од</th>
                  </tr>
                </thead>
                <tbody>
                  {predmet.pismeniOcenki.length > 0 ? (
                    predmet.pismeniOcenki.map((o) => (
                      <tr key={o.id}>
                        <td className={styles.gradeNum}>{o.ocenka}</td>
                        <td>{o.datum}</td>
                        <td>{o.zabeleska}</td>
                        <td>{o.tema}</td>
                        <td>
                          {o.osvoeni_poeni}/{o.max_poeni}
                        </td>
                        <td>{o.vid}</td>
                        <td className={styles.teacherName}>
                          {teachersMap[o.vnesena_Od]}
                        </td>
                      </tr>
                    ))
                  ) : (
                    <tr>
                      <td colSpan="7" className={styles.noGrades}>
                        Нема писмени оценки
                      </td>
                    </tr>
                  )}
                </tbody>
              </table>
            </div>

            <div className={styles.gradeBox}>
              <h3 className={styles.boxTitle}>Крајни Оценки</h3>
              <table className={styles.gradeTable}>
                <thead>
                  <tr>
                    <th>Оценка</th>
                    <th>датум</th>
                    <th>Забелешка</th>
                    <th>вид</th>
                    <th>Внесена од</th>
                  </tr>
                </thead>
                <tbody>
                  {predmet.krajniOcenki.length > 0 ? (
                    predmet.krajniOcenki.map((o) => (
                      <tr key={o.id}>
                        <td className={styles.gradeNumBold}>{o.ocenka}</td>
                        <td>{o.datum}</td>
                        <td>{o.zabeleska}</td>
                        <td>{o.tip}</td>
                        <td className={styles.teacherName}>
                          {teachersMap[o.vnesena_Od]}
                        </td>
                      </tr>
                    ))
                  ) : (
                    <tr>
                      <td colSpan="5" className={styles.noGrades}>
                        Нема крајни оценки
                      </td>
                    </tr>
                  )}
                </tbody>
              </table>
            </div>
          </div>
        ))}
      </div>
    </div>
  );
};

export default Roditel_ViewOcenki;