import React from 'react';
import { Tag } from 'antd';

export interface PriorityConfig {
    color: string;
    label: string;
    icon?: React.ReactNode;
}

interface PriorityBadgeProps {
    priority: string;
    priorityConfig?: Record<string, PriorityConfig>;
    showIcon?: boolean;
    className?: string;
}

/**
 * Configuração padrão de prioridades
 */
const defaultPriorityConfig: Record<string, PriorityConfig> = {
    baixa: {
        color: 'default',
        label: 'Baixa',
    },
    media: {
        color: 'blue',
        label: 'Média',
    },
    alta: {
        color: 'orange',
        label: 'Alta',
    },
    critica: {
        color: 'red',
        label: 'Crítica',
    },
};

/**
 * Componente para exibir badges de prioridade
 *
 * @example
 * ```tsx
 * <PriorityBadge priority="alta" />
 *
 * // Com configuração customizada
 * const customConfig = {
 *   baixa: { color: 'green', label: 'Baixa Prioridade' },
 * };
 * <PriorityBadge priority="baixa" priorityConfig={customConfig} />
 * ```
 */
export function PriorityBadge({
    priority,
    priorityConfig = defaultPriorityConfig,
    showIcon = false,
    className = '',
}: PriorityBadgeProps) {
    const config = priorityConfig[priority?.toLowerCase()] || {
        color: 'default',
        label: priority || 'N/A',
        icon: null,
    };

    return (
        <Tag color={config.color} className={className}>
            {showIcon && config.icon && <span style={{ marginRight: 4 }}>{config.icon}</span>}
            {config.label}
        </Tag>
    );
}

export default PriorityBadge;