"use client";

import React, { useState } from 'react';
import { ShieldAlert, ShieldCheck, ShoppingBag, User } from 'lucide-react';
import { suspendUser, unsuspendUser, suspendBusiness, unsuspendBusiness } from '@/app/actions/suspension';
import { toast } from 'react-hot-toast';
import SuspensionModal from './SuspensionModal';

interface EntrepreneurActionsProps {
  businessId: string;
  businessName: string;
  userId: string;
  userName: string;
  isBusinessSuspended: boolean;
  isUserSuspended: boolean;
}

export default function EntrepreneurActions({
  businessId,
  businessName,
  userId,
  userName,
  isBusinessSuspended,
  isUserSuspended
}: EntrepreneurActionsProps) {
  const [modalType, setModalType] = useState<'USER' | 'BUSINESS' | null>(null);

  const handleConfirm = async (reason: string) => {
    if (modalType === 'USER') {
      const result = await suspendUser(userId, reason);
      if (result.success) toast.success(`Compte de ${userName} suspendu.`);
      else toast.error(result.error || "Erreur");
    } else if (modalType === 'BUSINESS') {
      const result = await suspendBusiness(businessId, reason);
      if (result.success) toast.success(`Boutique ${businessName} suspendue.`);
      else toast.error(result.error || "Erreur");
    }
    setModalType(null);
  };

  return (
    <div className="flex flex-col gap-2">
      <div className="flex gap-2 justify-end">
        {/* User Suspension */}
        {isUserSuspended ? (
          <button
            onClick={() => unsuspendUser(userId)}
            className="btn-action bg-green-500/10 text-green-500 hover:bg-green-500 hover:text-white"
            title="Activer le compte"
          >
            <ShieldCheck className="w-4 h-4" />
            <span className="text-[10px] uppercase font-bold">Compte</span>
          </button>
        ) : (
          <button
            onClick={() => setModalType('USER')}
            className="btn-action bg-rose-500/10 text-rose-500 hover:bg-rose-500 hover:text-white"
            title="Suspendre le compte complet"
          >
            <User className="w-4 h-4" />
            <span className="text-[10px] uppercase font-bold">Compte</span>
          </button>
        )}

        {/* Business Suspension */}
        {isBusinessSuspended ? (
          <button
            onClick={() => unsuspendBusiness(businessId)}
            className="btn-action bg-emerald-500/10 text-emerald-500 hover:bg-emerald-500 hover:text-white"
            title="Activer la boutique"
          >
            <ShieldCheck className="w-4 h-4" />
            <span className="text-[10px] uppercase font-bold">Shop</span>
          </button>
        ) : (
          <button
            onClick={() => setModalType('BUSINESS')}
            className="btn-action bg-orange-500/10 text-orange-500 hover:bg-orange-500 hover:text-white"
            title="Suspendre uniquement la boutique"
          >
            <ShoppingBag className="w-4 h-4" />
            <span className="text-[10px] uppercase font-bold">Shop</span>
          </button>
        )}
      </div>

      <SuspensionModal
        isOpen={modalType !== null}
        onClose={() => setModalType(null)}
        onConfirm={handleConfirm}
        title={modalType === 'USER' ? "Suspendre l'utilisateur" : "Suspendre la boutique"}
        subtitle={modalType === 'USER' 
          ? `Voulez-vous suspendre TOUT le compte de ${userName} ? Sa boutique sera également masquée.` 
          : `Voulez-vous masquer la boutique "${businessName}" ? L'entrepreneur gardera l'accès à son compte.`}
      />
    </div>
  );
}
