updated milestones

This commit is contained in:
Arjun S
2025-08-04 08:14:53 +00:00
parent cd2f49af9a
commit 5898f04950
5 changed files with 103 additions and 68 deletions

View File

@@ -1,10 +1,10 @@
import React from 'react';
import { UPGRADES } from '../config/upgrades';
import { GameState, MascotTier } from '../types'; // Import MascotTier
import { GameState, MascotTier, UserState } from '../types'; // Import MascotTier
interface UpgradeShopProps {
gameState: GameState;
totalClicks: number; // Changed from userClicks
userState: UserState | null;
onPurchase: (upgradeId: string) => void;
}
@@ -22,7 +22,13 @@ const getMascotName = (imageSrc: string): string => {
.join(' ');
};
export function UpgradeShop({ gameState, totalClicks, onPurchase }: UpgradeShopProps) { // Changed from userClicks
export function UpgradeShop({ gameState, userState, onPurchase }: UpgradeShopProps) { // Changed from userClicks
if (!userState) {
return null; // Or a loading/signed-out state
}
const { clicks: userClicks, upgrades: userUpgrades } = userState;
return (
<div className="bg-gradient-to-b from-purple-800 to-pink-600 p-6 rounded-xl border-4 border-cyan-400 shadow-2xl">
<h2 className="text-3xl font-bold text-yellow-300 mb-6 text-center" style={{ fontFamily: 'Comic Sans MS, cursive' }}>
@@ -31,9 +37,9 @@ export function UpgradeShop({ gameState, totalClicks, onPurchase }: UpgradeShopP
<div className="space-y-4">
{UPGRADES.map((upgrade) => {
const owned = gameState.upgrades[upgrade.id]?.owned || 0;
const cost = gameState.upgrades[upgrade.id]?.cost || upgrade.baseCost;
const canAfford = totalClicks >= cost; // Changed from userClicks
const owned = userUpgrades[upgrade.id]?.owned || 0;
const cost = userUpgrades[upgrade.id]?.cost || upgrade.baseCost;
const canAfford = userClicks >= cost;
// If it's a one-time upgrade and already owned, don't display it
if (upgrade.oneTime && owned > 0) {
@@ -93,7 +99,7 @@ export function UpgradeShop({ gameState, totalClicks, onPurchase }: UpgradeShopP
<div className="mt-6 text-center">
<div className="text-2xl font-bold text-yellow-300">
Total Clicks: {totalClicks.toLocaleString()}
Your Clicks: {userClicks.toLocaleString()}
</div>
</div>
</div>