diff --git a/src/components/Field.tsx b/src/components/Field.tsx index 11f07d8..b0af0f0 100644 --- a/src/components/Field.tsx +++ b/src/components/Field.tsx @@ -256,6 +256,7 @@ const FieldComponent: React.FC = () => { plant, water, harvest, + remove, assignCrop, gameSpeed, setGameSpeed, @@ -288,6 +289,9 @@ const FieldComponent: React.FC = () => { case 'harvest': harvest(row, col) break + case 'remove': + remove(row, col) + break case 'inspect': setInspectedPlot({ plot: plots[row][col], row, col }) break @@ -317,6 +321,7 @@ const FieldComponent: React.FC = () => { { id: 'plant', label: 'Plant', icon: '🌱' }, { id: 'water', label: 'Water', icon: '💧' }, { id: 'harvest', label: 'Harvest', icon: '✂️' }, + { id: 'remove', label: 'Remove', icon: '🗑️' }, { id: 'inspect', label: 'Inspect', icon: '🔍' }, ] diff --git a/src/components/Market.tsx b/src/components/Market.tsx index 9bb2a92..fae9870 100644 --- a/src/components/Market.tsx +++ b/src/components/Market.tsx @@ -1,6 +1,6 @@ import React, { useRef } from 'react' import { useGameStore } from '../store/useGameStore' -import { MARKET_ITEMS, MarketItem } from '../constants' +import { ITEMS, Item } from '../constants' import FloatingMessage, { FloatingMessagesHandle } from './FloatingMessages' import { styled } from '@linaria/react' @@ -75,7 +75,7 @@ const MarketComponent: React.FC = () => { const { inventory, cash, buyItem, sellItem, landPurchases } = useGameStore() const floatingMessagesRef = useRef(null) - const getItemPrice = (item: MarketItem) => { + const getItemPrice = (item: Item) => { if (item.id === 'additional_land') { return Math.floor(100 * Math.pow(1.5, landPurchases)) } @@ -83,7 +83,7 @@ const MarketComponent: React.FC = () => { } const handleBuy = (itemId: string, e: React.MouseEvent) => { - const item = MARKET_ITEMS[itemId] + const item = ITEMS[itemId] const price = getItemPrice(item) if (!item || price === null || cash < price) return @@ -99,7 +99,7 @@ const MarketComponent: React.FC = () => { } const handleSell = (itemId: string, e: React.MouseEvent) => { - const item = MARKET_ITEMS[itemId] + const item = ITEMS[itemId] if ( !item || item.sellPrice === null || @@ -119,14 +119,14 @@ const MarketComponent: React.FC = () => { ) } - const sellableItems = Object.entries(MARKET_ITEMS) + const sellableItems = Object.entries(ITEMS) .filter( ([_, item]) => item.sellPrice !== null && inventory[item.id] && inventory[item.id] > 0, ) .map(([_, item]) => item) - const buyableItems = Object.entries(MARKET_ITEMS) + const buyableItems = Object.entries(ITEMS) .filter(([_, item]) => item.buyPrice !== null) .map(([_, item]) => item) @@ -174,37 +174,41 @@ const MarketComponent: React.FC = () => { )} - Buy Items - - - - Item - Buy Price - Action - - - - {buyableItems.map((item) => ( - - - {item.emoji} - {item.name} - - ${getItemPrice(item)} - - handleBuy(item.id, e)} - disabled={ - getItemPrice(item) ? cash < getItemPrice(item)! : true - } - > - Buy - - - - ))} - - + {buyableItems.length > 0 && ( + <> + Buy Items + + + + Item + Buy Price + Action + + + + {buyableItems.map((item) => ( + + + {item.emoji} + {item.name} + + ${getItemPrice(item)} + + handleBuy(item.id, e)} + disabled={ + getItemPrice(item) ? cash < getItemPrice(item)! : true + } + > + Buy + + + + ))} + + + + )} diff --git a/src/components/Warehouse.tsx b/src/components/Warehouse.tsx index fd435d2..aa992f5 100644 --- a/src/components/Warehouse.tsx +++ b/src/components/Warehouse.tsx @@ -1,6 +1,6 @@ import React from 'react' import { useGameStore } from '../store/useGameStore' -import { CROPS } from '../constants' +import { ITEMS } from '../constants' const warehouseContainerStyle: React.CSSProperties = { padding: '1rem', @@ -65,25 +65,11 @@ const itemNameStyle: React.CSSProperties = { } const formatItemName = (id: string) => { - if (id.endsWith('_seed')) { - const cropId = id.replace('_seed', '') - return `${CROPS[cropId]?.name || cropId} Seeds` - } - - return CROPS[id]?.name || id + return ITEMS[id]?.name || id } const getItemIcon = (id: string) => { - if (id.endsWith('_seed')) { - return '🌰' - } - - const cropIcons: Record = { - celery: '🥬', - corn: '🌽', - } - - return cropIcons[id] || '📦' + return ITEMS[id]?.emoji || '📦' } const WarehouseComponent: React.FC = () => { diff --git a/src/constants/index.ts b/src/constants/index.ts index ef03e23..42b39b8 100644 --- a/src/constants/index.ts +++ b/src/constants/index.ts @@ -108,7 +108,7 @@ export const UPGRADES: Record = { }, } -export interface MarketItem { +export interface Item { id: string name: string emoji: string @@ -116,7 +116,7 @@ export interface MarketItem { sellPrice: number | null // null means not sellable } -export const MARKET_ITEMS: Record = { +export const ITEMS: Record = { additional_land: { id: 'additional_land', name: 'Additional Land', diff --git a/src/store/useGameStore.ts b/src/store/useGameStore.ts index e7d695a..8cce085 100644 --- a/src/store/useGameStore.ts +++ b/src/store/useGameStore.ts @@ -8,7 +8,7 @@ import { CROPS, INITIAL_GAME_SPEED, COOLDOWN_DURATION, - MARKET_ITEMS, + ITEMS, UPGRADES, } from '../constants' import { GameState, PlotState } from '../types' @@ -100,6 +100,7 @@ export const useGameStore = create< plant: (row: number, col: number) => void water: (row: number, col: number) => void harvest: (row: number, col: number) => void + remove: (row: number, col: number) => void tick: () => void assignCrop: (row: number, col: number, cropId: string) => void upgradeField: () => void @@ -265,6 +266,24 @@ export const useGameStore = create< } }, + remove: (row, col) => { + const { plots, actionCooldown } = get() + + if (actionCooldown > 0) { + return + } + + const plot = plots[row][col] + if (plot.current) { + set( + produce((state) => { + state.plots[row][col].current = undefined + state.actionCooldown = COOLDOWN_DURATION + }), + ) + } + }, + tick: () => { set( produce((state) => { @@ -368,7 +387,7 @@ export const useGameStore = create< buyItem: (itemId) => { const { cash, landPurchases, plots, fieldSize } = get() - const item = MARKET_ITEMS[itemId] + const item = ITEMS[itemId] if (!item || item.buyPrice === null || item.buyPrice === undefined) { return @@ -424,7 +443,7 @@ export const useGameStore = create< sellItem: (itemId) => { const { inventory } = get() - const item = MARKET_ITEMS[itemId] + const item = ITEMS[itemId] if ( !item || diff --git a/src/types/index.ts b/src/types/index.ts index 3c8e243..4cfa08b 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -31,7 +31,7 @@ export interface InventoryItem { count: number } -export type FieldTool = 'mark' | 'plant' | 'water' | 'harvest' | 'inspect' +export type FieldTool = 'mark' | 'plant' | 'water' | 'harvest' | 'inspect' | 'remove' export interface ConsoleMessage { id: string