// src/components/PrivateRoute.tsx
import { useEffect, useState } from "react";
import { Navigate, Outlet } from "react-router-dom";
import ApiClient from "../api/Client";
import { motion } from "framer-motion";

export default function PrivateRoute() {
  // 🔹 Lokální stav pro sledování stavu autentizace a načítání
  // isAuthenticated: true → uživatel přihlášen
  // isAuthenticated: false → uživatel nepřihlášen
  // loading: true → stále probíhá kontrola (zobrazí se spinner)
  const [loading, setLoading] = useState(true);
  const [isAuthenticated, setIsAuthenticated] = useState<boolean | null>(null);

  // 🔹 useEffect se spustí po prvním renderu komponenty (na klientu)
  // Uvnitř nelze použít "await" přímo v komponentě, protože React komponenty
  // musí být **čisté** (pure functions) — nesmí vracet Promise.
  // Proto se asynchronní operace (např. volání API) musí provádět uvnitř useEffect.
  useEffect(() => {
    const checkAuth = async () => {
      try {
        // 🧠 Tady voláme API klienta, který ověří, jestli má uživatel platný token / session
        const result = await ApiClient.checkAuth();
        setIsAuthenticated(result); // uložíme výsledek do stavu
      } catch (err) {
        console.error("Auth check failed:", err);
        setIsAuthenticated(false);
      } finally {
        // ✅ Až je hotovo (ať už úspěch nebo chyba), vypneme spinner
        setLoading(false);
      }
    };
    checkAuth();
  }, []); // prázdné pole → spustí se jen při načtení komponenty

  // 🔹 Zobrazí se spinner, dokud se čeká na odpověď z API
  if (loading) {
    return (
      <div className="flex items-center justify-center h-screen">
        <motion.div
          className="w-16 h-16 border-4 border-white border-t-transparent rounded-full"
          animate={{ rotate: 360 }}
          transition={{ repeat: Infinity, duration: 1, ease: "linear" }}
        />
      </div>
    );
  }

  // 🔹 Pokud je uživatel ověřený → propustíme ho dál do vnořených rout
  if (isAuthenticated) {
    return <Outlet />;
  }

  // 🔹 Pokud ověřený není → přesměrujeme ho na login
  return <Navigate to="/login" replace />;
}
