"use client";

import { useAuth } from "@/contexts/AuthContext";
import { useRouter } from "next/navigation";
import { useEffect, useState } from "react";
import { getServerUrl } from "@/lib/config";
import styles from "./admin.module.css";

export default function AdminPage() {
    const { user, isAuthenticated, isLoading } = useAuth();
    const router = useRouter();
    const [adminUrl, setAdminUrl] = useState<string>('');

    useEffect(() => {
        // Définir l'URL de l'admin selon l'environnement
        setAdminUrl(`${getServerUrl()}/admin`);
    }, []);

    useEffect(() => {
        // Rediriger si non authentifié ou pas admin
        if (!isLoading && (!isAuthenticated || !user?.roles.includes("ROLE_ADMIN"))) {
            router.push("/");
        }
    }, [isAuthenticated, user, isLoading, router]);

    // Afficher un loader pendant la vérification
    if (isLoading) {
        return <div className={styles.loading}>Chargement...</div>
    }

    // Ne rien afficher si pas admin (pendant la redirection)
    if (!user?.roles.includes("ROLE_ADMIN")) {
        return null;
    }
{}
    return (
        <div className={styles.container}>
            <h1 className={styles.title}>Panel d'administration</h1>
            {adminUrl ? (
                <iframe src={adminUrl} className={styles.iframe} title="EasyAdmin Panel"/>
            ) : (
                <div className={styles.loading}>Chargement du panel...</div>
            )}
        </div>
    )
}