import { BossLevel, usePlayer } from '../providers/PlayerProvider';
import styles from '../styles/Background.module.css';

export const bossLevelToClass: Record<BossLevel, string> = {
  0: styles.boss0,
  1: styles.boss1,
  2: styles.boss2,
  3: styles.boss3,
  4: styles.boss4,
  5: styles.boss5,
  6: styles.boss6,
}

const Boss = () => {
  const { battleWithBoss, boss } = usePlayer();
  const variant = boss?.variants[boss.level] ?? 0;
  return <div onClick={battleWithBoss} className={`
    ${styles.boss} 
    ${bossLevelToClass[variant]}
    ${styles.background_asset}
  `} />
}

export default Boss