import { Navigate } from 'react-router-dom';
import useAuth from '@/hooks/useAuth';

interface RouteGuardProps {
  children: JSX.Element;
}

/**
 * Protège les routes qui nécessitent une authentification
 * 
 * Règles:
 * 1. Si l'utilisateur n'est pas authentifié, redirection vers /auth/login
 * 2. Si l'utilisateur est authentifié, affiche le composant enfant
 */
export const ProtectedRoute = ({ children }: RouteGuardProps): JSX.Element => {
  const { isAuthenticated, isLoading } = useAuth();

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

  // Rediriger vers login si non authentifié
  if (!isAuthenticated) {
    return <Navigate to="/auth/login" replace />;
  }

  return children;
};

/**
 * Protège les routes d'authentification (login, register)
 * 
 * Règles:
 * 1. Si l'utilisateur est déjà authentifié, redirection vers /recipes
 * 2. Si l'utilisateur n'est pas authentifié, affiche le composant enfant
 */
export const AuthRoute = ({ children }: RouteGuardProps): JSX.Element => {
  const { isAuthenticated, isLoading } = useAuth();

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

  // Rediriger vers recipes si déjà authentifié
  if (isAuthenticated) {
    return <Navigate to="/recipes" replace />;
  }

  return children;
};