"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 ModerationSuspensionButtonProps {
  userId: string;
  userName: string;
  isSuspended: boolean;
}

export default function ModerationSuspensionButton({
  userId,
  userName,
  isSuspended
}: ModerationSuspensionButtonProps) {
  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");
    }
  };

  if (isSuspended) {
    return (
      <button
        onClick={() => unsuspendUser(userId)}
        className="flex items-center gap-1.5 px-3 py-2 bg-green-500/10 text-green-500 hover:bg-green-500 hover:text-white rounded-lg transition-all text-xs font-bold"
      >
        <ShieldCheck className="w-4 h-4" />
        Réactiver le compte de l'auteur
      </button>
    );
  }

  return (
    <>
      <button
        onClick={() => setIsModalOpen(true)}
        className="flex items-center gap-1.5 px-3 py-2 bg-rose-500/10 text-rose-500 hover:bg-rose-500 hover:text-white rounded-lg transition-all text-xs font-bold"
      >
        <ShieldAlert className="w-4 h-4" />
        Suspendre l'auteur du message
      </button>

      <SuspensionModal
        isOpen={isModalOpen}
        onClose={() => setIsModalOpen(false)}
        onConfirm={handleSuspend}
        title="Suspendre l'auteur"
        subtitle={`Voulez-vous suspendre le compte de ${userName} pour ce message non conforme ?`}
      />
    </>
  );
}