import React from 'react';
import { Eye, Edit3, Trash2, LucideIcon } from 'lucide-react';

interface ActionButtonsProps {
    onView?: () => void;
    onEdit?: () => void;
    onDelete?: () => void;
    viewTitle?: string;
    editTitle?: string;
    deleteTitle?: string;
    className?: string;
    size?: 'sm' | 'md' | 'lg';
    showLabels?: boolean;
}

const getSizeClasses = (size: 'sm' | 'md' | 'lg') => {
    switch (size) {
        case 'sm':
            return 'h-3 w-3';
        case 'md':
            return 'h-4 w-4';
        case 'lg':
            return 'h-5 w-5';
        default:
            return 'h-4 w-4';
    }
};

const getTextSizeClasses = (size: 'sm' | 'md' | 'lg') => {
    switch (size) {
        case 'sm':
            return 'text-xs';
        case 'md':
            return 'text-xs';
        case 'lg':
            return 'text-sm';
        default:
            return 'text-xs';
    }
};

export const ActionButtons: React.FC<ActionButtonsProps> = ({
    onView,
    onEdit,
    onDelete,
    viewTitle = 'مشاهده',
    editTitle = 'ویرایش',
    deleteTitle = 'حذف',
    className = '',
    size = 'md',
    showLabels = false,
}) => {
    const iconSize = getSizeClasses(size);
    const textSize = getTextSizeClasses(size);

    return (
        <div className={`flex items-center gap-2 ${className}`}>
            {onView && (
                <button
                    onClick={onView}
                    className="text-blue-600 hover:text-blue-900 dark:text-blue-400 dark:hover:text-blue-300 flex items-center gap-1"
                    title={viewTitle}
                >
                    <Eye className={iconSize} />
                    {showLabels && <span className={textSize}>{viewTitle}</span>}
                </button>
            )}
            {onEdit && (
                <button
                    onClick={onEdit}
                    className="text-indigo-600 hover:text-indigo-900 dark:text-indigo-400 dark:hover:text-indigo-300 flex items-center gap-1"
                    title={editTitle}
                >
                    <Edit3 className={iconSize} />
                    {showLabels && <span className={textSize}>{editTitle}</span>}
                </button>
            )}
            {onDelete && (
                <button
                    onClick={onDelete}
                    className="text-red-600 hover:text-red-900 dark:text-red-400 dark:hover:text-red-300 flex items-center gap-1"
                    title={deleteTitle}
                >
                    <Trash2 className={iconSize} />
                    {showLabels && <span className={textSize}>{deleteTitle}</span>}
                </button>
            )}
        </div>
    );
};

