<script lang="ts">
	import { game } from '$lib/stores/game.svelte';
	import { getClickBreakdown } from '$lib/core/economy';
	import { formatNumber } from '$lib/utils/formatNumber';

	let cb = $derived(getClickBreakdown(game.state));
	// Expected value per click = total × (1 + doubleChance + critChance × 9)
	let expectedPerClick = $derived(cb.total * (1 + cb.doubleChance + cb.critChance * 9));
</script>

<div class="gp">
	<div class="grid grid-cols-5 gap-0.5 px-1">
		<div class="gp-stat" title="Production passive par seconde (generateurs)">
			<span class="gp-label">Passif</span>
			<span class="gp-value gp-accent-green text-[0.8rem]!">{formatNumber(game.productionPerSecond)}/s</span>
		</div>
		<div class="gp-stat" title="Valeur attendue par clic (double + crit inclus)">
			<span class="gp-label">Clic</span>
			<span class="gp-value gp-accent-amber text-[0.8rem]!">{formatNumber(expectedPerClick)}</span>
		</div>
		<div class="gp-stat" title="Multiplicateur global (prestige)">
			<span class="gp-label">Mult</span>
			<span class="gp-value text-[0.8rem]!">x{game.state.prestigeMultiplier.toFixed(1)}</span>
		</div>
		<div class="gp-stat" title="ADN Ancestral">
			<span class="gp-label">ADN</span>
			<span class="gp-value gp-accent-purple text-[0.8rem]!">{game.state.ancestralDna}</span>
		</div>
		<div class="gp-stat" title="Nombre de prestiges">
			<span class="gp-label">Gen.</span>
			<span class="gp-value text-[0.8rem]!">{game.state.prestigeCount}</span>
		</div>
	</div>
</div>
