<?php

namespace App\Livewire\Components;

use LivewireUI\Modal\ModalComponent;

/**
 * Modal de confirmación genérico reutilizable.
 * 
 * Este componente permite crear modales de confirmación personalizables
 * para cualquier acción que requiera confirmación del usuario.
 * 
 * Ejemplo de uso desde un componente:
 * 
 * ```php
 * $this->dispatch('openModal',
 *     component: \App\Livewire\Components\ConfirmModal::class,
 *     arguments: [
 *         'itemId' => $itemId,
 *         'itemName' => 'Nombre del elemento',
 *         'title' => 'Confirmar acción',
 *         'message' => '¿Estás seguro?',
 *         'confirmText' => 'Aceptar',
 *         'cancelText' => 'Cancelar',
 *         'eventName' => 'actionConfirmed',
 *         'confirmButtonColor' => 'blue', // red, blue, green, yellow, orange, purple, etc.
 *         'cancelButtonColor' => 'gray',
 *         'additionalData' => ['customKey' => 'customValue']
 *     ]
 * );
 * ```
 * 
 * Colores disponibles para confirmButtonColor:
 * - red, blue, green, yellow, orange, purple, indigo, pink, gray
 * 
 * Colores disponibles para cancelButtonColor:
 * - gray, white, red
 */
class ConfirmModal extends ModalComponent
{
    public string $title = 'Confirmar acción';
    public string $message = '¿Estás seguro de que deseas realizar esta acción?';
    public $itemId = null;
    public string $itemName = '';
    public string $confirmText = 'Confirmar';
    public string $cancelText = 'Cancelar';
    public string $eventName = 'confirmed';
    public ?string $context = null;
    
    // Colores personalizables para los botones
    public string $confirmButtonColor = 'red'; // red, blue, green, yellow, gray, etc.
    public string $cancelButtonColor = 'gray'; // gray, white, etc.
    
    // Datos adicionales que se pueden pasar al evento
    public array $additionalData = [];

    public function mount(
        $itemId = null,
        string $itemName = '',
        ?string $title = null,
        ?string $message = null,
        ?string $confirmText = null,
        ?string $cancelText = null,
        ?string $eventName = null,
        ?string $context = null,
        ?string $confirmButtonColor = null,
        ?string $cancelButtonColor = null,
        array $additionalData = []
    ) {
        $this->itemId = $itemId;
        $this->itemName = $itemName;
        $this->additionalData = $additionalData;
        
        if ($title !== null) {
            $this->title = $title;
        }
        
        if ($message !== null) {
            $this->message = $message;
        }
        
        if ($confirmText !== null) {
            $this->confirmText = $confirmText;
        }
        
        if ($cancelText !== null) {
            $this->cancelText = $cancelText;
        }
        
        if ($eventName !== null) {
            $this->eventName = $eventName;
        }
        
        if ($context !== null) {
            $this->context = $context;
        }
        
        if ($confirmButtonColor !== null) {
            $this->confirmButtonColor = $confirmButtonColor;
        }
        
        if ($cancelButtonColor !== null) {
            $this->cancelButtonColor = $cancelButtonColor;
        }
    }

    public function confirm()
    {
        $eventData = [];
        
        if ($this->itemId !== null) {
            $eventData['itemId'] = $this->itemId;
        }
        
        if ($this->context !== null) {
            $eventData['context'] = $this->context;
        }
        
        if (!empty($this->itemName)) {
            $eventData['itemName'] = $this->itemName;
        }
        
        // Agregar datos adicionales
        if (!empty($this->additionalData)) {
            $eventData = array_merge($eventData, $this->additionalData);
        }
        
        // En Livewire v3, pasar el array como un solo argumento
        $this->dispatch($this->eventName, $eventData);
        $this->closeModal();
    }

    public function getConfirmButtonClasses(): string
    {
        $baseClasses = 'px-4 py-2 rounded-lg text-white transition-colors';
        
        $colorClasses = match($this->confirmButtonColor) {
            'red' => 'bg-red-600 hover:bg-red-700',
            'blue' => 'bg-blue-600 hover:bg-blue-700',
            'green' => 'bg-green-600 hover:bg-green-700',
            'yellow' => 'bg-yellow-600 hover:bg-yellow-700',
            'orange' => 'bg-orange-600 hover:bg-orange-700',
            'purple' => 'bg-purple-600 hover:bg-purple-700',
            'indigo' => 'bg-indigo-600 hover:bg-indigo-700',
            'pink' => 'bg-pink-600 hover:bg-pink-700',
            'gray' => 'bg-gray-600 hover:bg-gray-700',
            default => 'bg-red-600 hover:bg-red-700',
        };
        
        return $baseClasses . ' ' . $colorClasses;
    }

    public function getCancelButtonClasses(): string
    {
        $baseClasses = 'px-4 py-2 rounded-lg border transition-colors';
        
        $colorClasses = match($this->cancelButtonColor) {
            'gray' => 'border-gray-300 text-gray-700 hover:bg-gray-50',
            'white' => 'border-gray-300 text-gray-700 hover:bg-white bg-white',
            'red' => 'border-red-300 text-red-700 hover:bg-red-50',
            default => 'border-gray-300 text-gray-700 hover:bg-gray-50',
        };
        
        return $baseClasses . ' ' . $colorClasses;
    }

    public static function modalMaxWidth(): string
    {
        return 'md';
    }

    public static function closeModalOnEscape(): bool
    {
        return true;
    }

    public static function closeModalOnClickAway(): bool
    {
        return true;
    }

    public function render()
    {
        return view('livewire.components.confirm-modal');
    }
}