feat: suppression boutique legacy + refonte achievements milestones Clickerz

- Suppression route /boutique + Boutique.jsx, BoutiqueCard.jsx, shop.json, scss associés
  (le GeneratorShop sidebar fait déjà le job)
- Refonte complète achievements : 27 milestones basés sur le GameState réel
  (paliers ressources, générateurs, prestige, évolution, easter eggs humour)
- Suppression ancien système JSON statique + AchievementsCard legacy
- Page achievements : unlocked/locked state-aware, compteur progression
This commit is contained in:
2026-03-20 14:34:48 +01:00
parent 0374602047
commit 0c9170af65
12 changed files with 360 additions and 734 deletions

View File

@@ -1,28 +0,0 @@
import "../scss/components/achievementscard.scss";
import PropTypes from "prop-types";
function AchievementsCard({ name, description, image, key }) {
AchievementsCard.propTypes = {
name: PropTypes.string.isRequired,
description: PropTypes.string.isRequired,
image: PropTypes.string.isRequired,
key: PropTypes.number.isRequired,
};
return (
<div className="achievCardcontainer">
<img
className="achievecardpicture"
key={key}
src={image}
alt="cartes speciales"
/>
<div className="achievetitle">
<p className="achievname">{name}</p>
<p className="achievdescription">{description}</p>
</div>
</div>
);
}
export default AchievementsCard;

View File

@@ -1,65 +0,0 @@
// BoutiqueCard.jsx — Legacy shop card (shop.json boosters)
// TODO: Migrate to economy.ts generator system in a future step
import "../scss/components/boutiquecard.scss";
import "../scss/components/buttons.scss";
import PropTypes from "prop-types";
import { useGameStore } from "../store/useGameStore";
export default function BoutiqueCard({
name,
price,
incrementValue,
description,
image,
type,
}) {
const resources = useGameStore((s) => s.state.resources);
// Legacy shop — disabled for now, generators are in GeneratorShop
const canAfford = resources >= price;
return (
<div className="shopcardcontainer">
<div className="shopcontainer">
<div
className="cardpicture"
style={{ backgroundImage: `url(${image})` }}
alt={`image de ${name}`}
/>
<div>
<div className="titlesection">
<p className="itemname">{name}</p>
<div className="price">
<p className="itemprice">{price}</p>
<div className="priceicon" />
</div>
</div>
<div className="description">
<p className="itemdesc">
<em>
{type} + {incrementValue}
</em>
</p>
<p className="itemdesc">{description}</p>
</div>
</div>
<button
disabled={!canAfford}
className="primary-button"
style={{ opacity: canAfford ? 1 : 0.5 }}
>
Bientôt
</button>
</div>
</div>
);
}
BoutiqueCard.propTypes = {
name: PropTypes.string.isRequired,
price: PropTypes.number.isRequired,
incrementValue: PropTypes.number.isRequired,
description: PropTypes.string.isRequired,
image: PropTypes.string.isRequired,
type: PropTypes.string.isRequired,
};