"use client";

import type { ReactNode } from "react";
import { useIsPluginEnabled } from "@/lib/plugins/client";

/**
 * Composant client : affiche `children` uniquement si le plugin est activé.
 * Le `<PluginProvider>` doit être présent en amont (layout) avec la liste
 * des plugins activés calculée côté serveur.
 *
 * Usage :
 *   <IfPluginEnabled plugin="landing-hero">
 *     <HeroSection />
 *   </IfPluginEnabled>
 *
 *   <IfPluginEnabled plugin="seasonality" fallback={<DefaultBanner />}>
 *     <SeasonBanner />
 *   </IfPluginEnabled>
 */
export function IfPluginEnabled({
  plugin,
  fallback = null,
  children,
}: {
  plugin: string;
  fallback?: ReactNode;
  children: ReactNode;
}) {
  const enabled = useIsPluginEnabled(plugin);
  return <>{enabled ? children : fallback}</>;
}