"use client";

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

interface ClientActionsProps {
  userId: string;
  userName: string;
  isSuspended: boolean;
}

export default function ClientActions({ userId, userName, isSuspended }: ClientActionsProps) {
  const [isModalOpen, setIsModalOpen] = useState(false);

  const handleSuspend = async (reason: string) => {
    const result = await suspendUser(userId, reason);
    if (result.success) {
      toast.success(`${userName} a été suspendu.`);
    } else {
      toast.error(result.error || "Échec de la suspension");
    }
  };

  const handleUnsuspend = async () => {
    const result = await unsuspendUser(userId);
    if (result.success) {
      toast.success(`${userName} a été réactivé.`);
    } else {
      toast.error(result.error || "Échec de la réactivation");
    }
  };

  if (isSuspended) {
    return (
      <button
        onClick={handleUnsuspend}
        className="flex items-center gap-1.5 px-3 py-1.5 bg-green-500/10 text-green-500 hover:bg-green-500 hover:text-white rounded-lg transition-all text-[10px] font-bold uppercase border border-green-500/20"
      >
        <ShieldCheck className="w-3 h-3" />
        Réactiver
      </button>
    );
  }

  return (
    <>
      <button
        onClick={() => setIsModalOpen(true)}
        className="flex items-center gap-1.5 px-3 py-1.5 bg-rose-500/10 text-rose-500 hover:bg-rose-500 hover:text-white rounded-lg transition-all text-[10px] font-bold uppercase border border-rose-500/20"
      >
        <ShieldAlert className="w-3 h-3" />
        Suspendre
      </button>

      <SuspensionModal
        isOpen={isModalOpen}
        onClose={() => setIsModalOpen(false)}
        onConfirm={handleSuspend}
        title="Suspendre le compte"
        subtitle={`Voulez-vous suspendre le compte de ${userName} ? L'utilisateur sera bloqué et recevra votre message.`}
      />
    </>
  );
}
