import { useTranslation } from 'react-i18next';
import { EffectBadge } from '../game/EffectBadge';

interface ItemStatBadgesProps {
    item: any;
}

/**
 * Reusable component that renders all stat badges for an item.
 * Used in tooltips, inventory cards, combat inventory, etc.
 */
export const ItemStatBadges = ({ item }: ItemStatBadgesProps) => {
    const { t } = useTranslation();

    const stats = item.unique_stats || item.stats || {};
    const effects = item.effects || {};

    return (
        <div className="stat-badges-container">
            {/* Capacity */}
            {(stats.weight_capacity) && (
                <span className="stat-badge capacity">
                    ⚖️ +{stats.weight_capacity}kg
                </span>
            )}
            {(stats.volume_capacity) && (
                <span className="stat-badge capacity">
                    📦 +{stats.volume_capacity}L
                </span>
            )}

            {/* Combat */}
            {(stats.damage_min) && (
                <span className="stat-badge damage">
                    ⚔️ {stats.damage_min}-{stats.damage_max}
                </span>
            )}
            {(stats.armor) && (
                <span className="stat-badge armor">
                    🛡️ +{stats.armor}
                </span>
            )}
            {(stats.armor_penetration) && (
                <span className="stat-badge penetration">
                    💔 +{stats.armor_penetration} {t('stats.pen')}
                </span>
            )}
            {(stats.crit_chance) && (
                <span className="stat-badge crit">
                    🎯 +{Math.round(stats.crit_chance * 100)}% {t('stats.crit')}
                </span>
            )}
            {(stats.accuracy) && (
                <span className="stat-badge accuracy">
                    👁️ +{Math.round(stats.accuracy * 100)}% {t('stats.acc')}
                </span>
            )}
            {(stats.dodge_chance) && (
                <span className="stat-badge dodge">
                    💨 +{Math.round(stats.dodge_chance * 100)}% Dodge
                </span>
            )}
            {(stats.lifesteal) && (
                <span className="stat-badge lifesteal">
                    🧛 +{Math.round(stats.lifesteal * 100)}% {t('stats.life')}
                </span>
            )}

            {/* Attributes */}
            {(stats.strength_bonus) && (
                <span className="stat-badge strength">
                    💪 +{stats.strength_bonus} {t('stats.str')}
                </span>
            )}
            {(stats.agility_bonus) && (
                <span className="stat-badge agility">
                    🏃 +{stats.agility_bonus} {t('stats.agi')}
                </span>
            )}
            {(stats.endurance_bonus) && (
                <span className="stat-badge endurance">
                    🏋️ +{stats.endurance_bonus} {t('stats.end')}
                </span>
            )}
            {(stats.hp_bonus) && (
                <span className="stat-badge health">
                    ❤️ +{stats.hp_bonus} {t('stats.hpMax')}
                </span>
            )}
            {(stats.stamina_bonus) && (
                <span className="stat-badge stamina">
                    ⚡ +{stats.stamina_bonus} {t('stats.stmMax')}
                </span>
            )}

            {/* Consumables */}
            {(item.hp_restore || effects.hp_restore) && (
                <span className="stat-badge health">
                    ❤️ +{item.hp_restore || effects.hp_restore} HP
                </span>
            )}
            {(item.stamina_restore || effects.stamina_restore) && (
                <span className="stat-badge stamina">
                    ⚡ +{item.stamina_restore || effects.stamina_restore} Stm
                </span>
            )}

            {/* Status Effects */}
            {effects.status_effect && (
                <EffectBadge effect={effects.status_effect} />
            )}

            {effects.cures && effects.cures.length > 0 && (
                <span className="stat-badge cure">
                    💊 {t('game.cures')}: {effects.cures.map((c: string) => t(`game.effects.${c}`, c)).join(', ')}
                </span>
            )}
        </div>
    );
};
