-
{design.effects.map(eff => (
- - {ENCHANTMENT_EFFECTS[eff.effectId]?.name} x{eff.stacks} + {ENCHANTMENT_EFFECT_S[eff.effectId]?.name} x{eff.stacks} ))}
diff --git a/src/components/game/tabs/AchievementsTab.tsx b/src/components/game/tabs/AchievementsTab.tsx
index f840a06..39ca513 100755
--- a/src/components/game/tabs/AchievementsTab.tsx
+++ b/src/components/game/tabs/AchievementsTab.tsx
@@ -1,26 +1,28 @@
'use client';
-import type { GameStore } from '@/lib/game/store';
import { AchievementsDisplay } from '@/components/game/AchievementsDisplay';
+import { useGameStore } from '@/lib/game/stores';
-export interface AchievementsTabProps {
- store: GameStore;
-}
+export function AchievementsTab() {
+ const achievements = useGameStore((s) => s.achievements);
+ const maxFloorReached = useGameStore((s) => s.maxFloorReached);
+ const totalManaGathered = useGameStore((s) => s.totalManaGathered);
+ const signedPacts = useGameStore((s) => s.signedPacts);
+ const totalSpellsCast = useGameStore((s) => s.totalSpellsCast);
+ const totalDamageDealt = useGameStore((s) => s.totalDamageDealt);
+ const totalCraftsCompleted = useGameStore((s) => s.totalCraftsCompleted);
-export function AchievementsTab({ store }: AchievementsTabProps) {
- const achievements = store.achievements;
-
return (
;
+ skillUpgrades: Record;
+ skillTiers: Record;
+ prestigeUpgrades: Record;
studySpeedMult: number;
- upgradeEffects: ComputedEffects;
+ upgradeEffects: any;
currentStudyTarget: any;
onStartStudying: (skillId: string) => void;
onParallelStudy: (skillId: string) => void;
@@ -36,17 +30,13 @@ interface CategorySkillsListProps {
setPendingSelections: (selections: string[]) => void;
}
-// Type guard for element skill costs
-function isElementCost(cost?: SkillCost | null): cost is SkillCost & { type: 'element'; element: string } {
- return cost !== null && typeof cost !== 'undefined' && cost.type === 'element' && typeof cost.element === 'string';
-}
-
export function CategorySkillsList({
- category,
- availableCategories,
- isCollapsed,
- onToggleCategory,
- store,
+ categoryId,
+ categoryName,
+ skills,
+ skillUpgrades,
+ skillTiers,
+ prestigeUpgrades,
studySpeedMult,
upgradeEffects,
currentStudyTarget,
@@ -58,164 +48,72 @@ export function CategorySkillsList({
pendingSelections,
setPendingSelections,
}: CategorySkillsListProps) {
- const showToast = useGameToast();
+ const [collapsed, setCollapsed] = useState(false);
- // Skip if category not available
- if (!availableCategories.includes(category.id)) return null;
+ const categorySkills = Object.entries(SKILLS_DEF || {})
+ .filter(([, def]) => def.category === categoryId)
+ .sort((a, b) => (a[1].tier || 0) - (b[1].tier || 0));
- const skillsInCat = Object.entries(SKILLS_DEF).filter(([, def]) => def.cat === category.id);
- if (skillsInCat.length === 0) return null;
-
- const handleCancelStudyInternal = () => {
- onCancelStudy();
- };
+ const toggleCollapse = () => setCollapsed(!collapsed);
return (
-
- onToggleCategory(category.id)}
- />
- {!isCollapsed && (
-
- {}}
selectedEffects={[]}
@@ -136,14 +131,12 @@ export function CraftingTab({ store }: CraftingTabProps) {
)}
{enchantStage === 'prepare' && (
{}}
/>
)}
{enchantStage === 'apply' && (
{}}
selectedDesign={null}
@@ -183,7 +176,7 @@ export function CraftingTab({ store }: CraftingTabProps) {
store.cancelDesign()}>
+ useGameStore.getState().cancelDesign()}>
Cancel
}
@@ -205,7 +198,7 @@ export function CraftingTab({ store }: CraftingTabProps) {
store.cancelPreparation()}>
+ useGameStore.getState().cancelPreparation()}>
Cancel
}
@@ -237,7 +230,7 @@ export function CraftingTab({ store }: CraftingTabProps) {
<>
Pause
{
- store.cancelApplication();
+ useGameStore.getState().cancelApplication();
showToast('warning', 'Enchantment Cancelled', 'The enchantment application was cancelled.');
}}>Cancel
diff --git a/src/components/game/tabs/EquipmentTab.tsx b/src/components/game/tabs/EquipmentTab.tsx
index 22dbbe5..81ba1b9 100755
--- a/src/components/game/tabs/EquipmentTab.tsx
+++ b/src/components/game/tabs/EquipmentTab.tsx
@@ -122,7 +122,7 @@ export function EquipmentTab() {
// Use modular store directly - MUST be called before any conditional returns
const equippedInstances = useCombatStore((s) => s.equippedInstances);
const equipmentInstances = useCombatStore((s) => s.equipmentInstances);
-
+
// Get unequipped items - hooks must be called before conditional returns
const equippedIds = useMemo(() =>
new Set(Object.values(equippedInstances || {}).filter(Boolean)),
@@ -230,8 +230,8 @@ export function EquipmentTab() {
// Get unified effects for equipment stats - move hook before conditional
const equipmentInstancesForEffects = useCombatStore((s) => s.equipmentInstances);
const equippedInstancesForEffects = useCombatStore((s) => s.equippedInstances);
-
- const unifiedEffects = equipmentInstancesForEffects && equippedInstancesForEffects
+
+ const unifiedEffects = equipmentInstancesForEffects && equippedInstancesForEffects
? getUnifiedEffects({ equipmentInstances, equippedInstances })
: null;
@@ -329,10 +329,10 @@ export function EquipmentTab() {
const enchantPower = effects.enchantmentPowerMultiplier || 1;
return (
<>
- 1 ? "success" : "default"}
+ highlight={enchantPower > 1 ? 'success' : 'default'}
/>
- {skillsInCat.map(([id, def]) => {
- // GATE MANA CAPACITY SKILLS BY UNLOCKED ELEMENT
- if (isElementCost(def.cost)) {
- const element = store.elements[def.cost.element];
- if (!element?.unlocked) return null;
- }
+
);
}
diff --git a/src/components/game/tabs/CraftingTab.tsx b/src/components/game/tabs/CraftingTab.tsx
index b3f2fb8..eeade5a 100755
--- a/src/components/game/tabs/CraftingTab.tsx
+++ b/src/components/game/tabs/CraftingTab.tsx
@@ -6,29 +6,25 @@ import { GameCard } from '@/components/ui/game-card';
import { SectionHeader } from '@/components/ui/section-header';
import { ActionButton } from '@/components/ui/action-button';
import { Scroll, Hammer, Sparkles, Anvil } from 'lucide-react';
-import type { EquipmentInstance, EnchantmentDesign, DesignEffect, AppliedEnchantment, LootInventory, EquipmentCraftingProgress } from '@/lib/game/types';
-import { fmt, type GameStore } from '@/lib/game/store';
+import { fmt } from '@/lib/game/stores';
import {
EnchantmentDesigner,
EnchantmentPreparer,
EnchantmentApplier,
EquipmentCrafter,
} from '@/components/game/crafting';
+import { useGameStore } from '@/lib/game/stores';
import { useGameToast } from '@/components/game/GameToast';
-export interface CraftingTabProps {
- store: GameStore;
-}
-
-export function CraftingTab({ store }: CraftingTabProps) {
+export function CraftingTab() {
const showToast = useGameToast();
- const currentAction = store.currentAction;
- const designProgress = store.designProgress;
- const preparationProgress = store.preparationProgress;
- const applicationProgress = store.applicationProgress;
- const equipmentCraftingProgress = store.equipmentCraftingProgress;
- const pauseApplication = store.pauseApplication;
- const resumeApplication = store.resumeApplication;
+ const currentAction = useGameStore((s) => s.currentAction);
+ const designProgress = useGameStore((s) => s.designProgress);
+ const preparationProgress = useGameStore((s) => s.preparationProgress);
+ const applicationProgress = useGameStore((s) => s.applicationProgress);
+ const equipmentCraftingProgress = useGameStore((s) => s.equipmentCraftingProgress);
+ const pauseApplication = useGameStore((s) => s.pauseApplication);
+ const resumeApplication = useGameStore((s) => s.resumeApplication);
const [activeTab, setActiveTab] = useState<'fabricate' | 'enchant'>('fabricate');
const [enchantStage, setEnchantStage] = useState<'design' | 'prepare' | 'apply'>('design');
@@ -81,7 +77,7 @@ export function CraftingTab({ store }: CraftingTabProps) {
{/* Fabricate Content: EquipmentCrafter */}
{activeTab === 'fabricate' && (
-
+
)}
-
+
+
+ {categoryName} ({categorySkills.length})
+
+
+ {collapsed ? '▼' : '▶'}
+
+
- // Get tier info
- const currentTier = store.skillTiers?.[id] || 1;
- const tieredSkillId = currentTier > 1 ? `${id}_t${currentTier}` : id;
- const tierMultiplier = getTierMultiplier(tieredSkillId);
+ {!collapsed && (
+
+ {categorySkills.map(([skillId, def]) => {
+ const skillLevel = skills[skillId] || 0;
+ const tier = skillTiers[skillId] || 0;
+ const tierMult = getTierMultiplier(skillId)(tier);
+ const isStudying = currentStudyTarget?.id === skillId;
+ const isParallel = currentStudyTarget?.type === 'parallel' && currentStudyTarget?.id === skillId;
- // Get the actual level from the tiered skill
- const level = store.skills[tieredSkillId] || store.skills[id] || 0;
- const maxed = level >= def.max;
+ // Get upgrade choices for this skill
+ const store = useGameStore.getState();
+ const { available, selected } = store.getSkillUpgradeChoices(skillId, tier as 5 | 10);
- // Check if studying this skill
- const isStudying =
- (store.currentStudyTarget?.id === id || store.currentStudyTarget?.id === tieredSkillId) &&
- store.currentStudyTarget?.type === 'skill';
-
- // Get tier name for display
- const tierDef = SKILL_EVOLUTION_PATHS[id]?.tiers.find((t) => t.tier === currentTier);
- const skillDisplayName = tierDef?.name || def.name;
-
- // Check prerequisites
- let prereqMet = true;
- if (def.req) {
- for (const [r, rl] of Object.entries(def.req)) {
- if ((store.skills[r] || 0) < rl) {
- prereqMet = false;
- break;
+ return (
+ {
+ if (pendingSelections.includes(upgradeId)) {
+ setPendingSelections(pendingSelections.filter(id => id !== upgradeId));
+ } else {
+ setPendingSelections([...pendingSelections, upgradeId]);
}
- }
- }
-
- // Apply skill modifiers
- const costMult = getStudyCostMultiplier(store.skills);
- const speedMult = getStudySpeedMultiplier(store.skills);
- const studyEffects = getUnifiedEffects(store);
- const effectiveSpeedMult = speedMult * studyEffects.studySpeedMultiplier;
-
- // Study time scales with tier
- const tierStudyTime = def.studyTime * currentTier;
- const effectiveStudyTime = tierStudyTime / effectiveSpeedMult;
-
- // Cost scales with tier
- const baseCost = def.base * (level + 1) * currentTier;
- const cost = Math.floor(baseCost * costMult);
-
- // Additional cost (element mana) - only pass element costs
- const additionalCost = isElementCost(def.cost)
- ? { type: 'element' as const, element: def.cost.element, amount: def.cost.amount }
- : undefined;
-
- // Can start studying?
- let canStudy = !maxed && prereqMet && store.rawMana >= cost && !isStudying;
-
- // Check additional cost (element mana)
- if (isElementCost(def.cost)) {
- const element = store.elements[def.cost.element];
- if (!element || element.current < def.cost.amount) {
- canStudy = false;
- }
- }
-
- // Check for milestone upgrades
- const milestoneInfo = hasMilestoneUpgrade(
- tieredSkillId,
- level,
- store.skillTiers || {},
- store.skillUpgrades
- );
-
- // Check for tier up
- const nextTierSkill = getNextTierSkill(tieredSkillId);
- const canTierUp = Boolean(maxed && nextTierSkill);
-
- // Get selected upgrades
- const selectedUpgrades = store.skillUpgrades[tieredSkillId] || [];
- const selectedL5 = selectedUpgrades.filter((u) => u.includes('_l5'));
- const selectedL10 = selectedUpgrades.filter((u) => u.includes('_l10'));
-
- // Check if insufficient mana for toast
- const hasInsufficientMana = !isStudying && !maxed && store.rawMana < cost;
-
- // Check for parallel study eligibility
- const isParallelStudy =
- store.currentStudyTarget?.id === tieredSkillId &&
- store.currentStudyTarget?.type === 'skill';
- const canParallelStudy: boolean =
- hasSpecial(studyEffects, SPECIAL_EFFECTS.PARALLEL_STUDY) &&
- !!store.currentStudyTarget &&
- store.currentStudyTarget.id !== tieredSkillId &&
- !isStudying;
-
- return (
-
-
+ }}
+ onStartStudying={() => onStartStudying(skillId)}
+ onParallelStudy={() => onParallelStudy(skillId)}
+ onTierUp={() => onTierUp(skillId)}
+ onOpenUpgradeDialog={(milestone) => onOpenUpgradeDialog(skillId, milestone)}
+ />
+ );
+ })}
+
Increases the power of all enchantments by {(enchantPower - 1) * 100}%. Multiplier applied to all enchantment effects.
@@ -353,11 +353,11 @@ export function EquipmentTab() {
return No active effects;
}
const effectEntries = Object.entries(effects.equipmentEffects).filter(([, v]) => v > 0);
-
+
if (effectEntries.length === 0) {
return No active effects;
}
-
+
return effectEntries.map(([stat, value]) => (
{golem.description}
- +Summon Cost:
{golem.summonCost.map((cost, idx) => {
const elem = getElementInfo(cost.element || '');
- const available = cost.type === 'raw'
- ? store.rawMana
+ const available = cost.type === 'raw'
+ ? rawMana
: elements[cost.element || '']?.current || 0;
const canAfford = available >= cost.amount;
-
+
return (
-
@@ -170,7 +167,7 @@ export function GolemancyTab({ store }: GolemancyTabProps) {
})}
Maintenance/hr:
@@ -185,7 +182,7 @@ export function GolemancyTab({ store }: GolemancyTabProps) {
})}
@@ -197,7 +194,7 @@ export function GolemancyTab({ store }: GolemancyTabProps) {
);
};
-
+
return (
0 ? 'success' : undefined}
/>
-
{/* Header */}
@@ -216,26 +213,26 @@ export function GolemancyTab({ store }: GolemancyTabProps) {
) : (
<>
- Golems are automatically summoned at the start of each combat floor. They cost mana to maintain and will be dismissed if you run out. @@ -244,7 +241,7 @@ export function GolemancyTab({ store }: GolemancyTabProps) { )}