import { useEffect } from "react";
import { useAuth } from "@/context/AuthContext";
import { useNavigate } from "react-router-dom";
import { FaSpinner } from "react-icons/fa";

export default function LogoutPage() {
  const { logout } = useAuth();
  const navigate = useNavigate();

  useEffect(() => {
    async function performLogout() {
      await logout();
      navigate("/");
    }
    performLogout();
  }, [logout, navigate]);

  return (
    <div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-gray-50 to-gray-100">
      <div className="bg-white rounded-lg shadow-xl p-8 text-center">
        <FaSpinner className="text-blue-500 text-5xl mx-auto mb-4 animate-spin" />
        <h1 className="text-2xl font-bold text-gray-800">Odhlašování...</h1>
      </div>
    </div>
  );
}