import { useNavigate, Link } from "react-router-dom";
import axios from "axios";
import NavbarStyles from "./NavbarKlasenStyles.module.css";

function NavbarKlasen() {
  const navigate = useNavigate();

  const handleLogout = async (e) => {
    e.preventDefault();

    try {
      await axios.post(
        "http://localhost:8080/api/auth/logout",
        {},
        { withCredentials: true }
      );

      navigate("/login");
    } catch (err) {
      console.error("Грешка при одјавување:", err);

      navigate("/login");
    }
  };

  return (
    <nav className={NavbarStyles.navbar}>
      {/* lev del */}
      <div className={NavbarStyles.brandSection}>
        <h1 className={NavbarStyles.brandTitle}>ВебЗ-Е Дневник</h1>
        <span className={NavbarStyles.brandSubtitle}>
          СОУ Орце Николов - Скопје
        </span>
      </div>

      <ul className={NavbarStyles.navLinks}>
        <li>
          <Link to="/dashboard" className={NavbarStyles.navItem}>
            Почетна
          </Link>
        </li>
        <li>
          <Link to="/statistika" className={`${NavbarStyles.navItem} `}>
            Опции
          </Link>
        </li>
        <li>
          <Link to="/stats" className={NavbarStyles.navItem}>
            Профил
          </Link>
        </li>
        <li>
          <a
            href="/logout"
            onClick={handleLogout}
            className={NavbarStyles.navItem}
          >
            Одјави се
          </a>
        </li>
      </ul>
    </nav>
  );
}

export default NavbarKlasen;