From 94cc9a179acd3ea8aaa9cbbd972f80a15f2f0687 Mon Sep 17 00:00:00 2001 From: Z User Date: Wed, 1 Apr 2026 11:28:01 +0000 Subject: [PATCH] Move Loot/Achievements to separate tabs, add skill debug options, fix enchanting system - Move LootInventoryDisplay to new LootTab (better mobile UX) - Move AchievementsDisplay to new AchievementsTab (better mobile UX) - Add skill research debug options to DebugTab (level up skills, enchanting skills) - Fix enchanting: disenchant only possible in Prepare stage - Fix enchanting: cannot apply enchantments to already enchanted gear - Remove recover buttons from Apply stage (disenchant is only in Prepare stage now) --- src/app/page.tsx | 45 ++- src/components/game/tabs/AchievementsTab.tsx | 43 +++ src/components/game/tabs/CraftingTab.tsx | 188 +++++++------ src/components/game/tabs/DebugTab.tsx | 281 ++++++++++++++++++- src/components/game/tabs/LootTab.tsx | 46 +++ src/components/game/tabs/index.ts | 2 + 6 files changed, 485 insertions(+), 120 deletions(-) create mode 100644 src/components/game/tabs/AchievementsTab.tsx create mode 100644 src/components/game/tabs/LootTab.tsx diff --git a/src/app/page.tsx b/src/app/page.tsx index 84dc89e..bb4ee11 100755 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -13,10 +13,9 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Badge } from '@/components/ui/badge'; import { RotateCcw } from 'lucide-react'; -import { CraftingTab, SpireTab, SpellsTab, LabTab, SkillsTab, StatsTab, EquipmentTab, AttunementsTab, DebugTab } from '@/components/game/tabs'; +import { CraftingTab, SpireTab, SpellsTab, LabTab, SkillsTab, StatsTab, EquipmentTab, AttunementsTab, DebugTab, LootTab, AchievementsTab } from '@/components/game/tabs'; import { ActionButtons, CalendarDisplay, ManaDisplay, TimeDisplay } from '@/components/game'; -import { LootInventoryDisplay } from '@/components/game/LootInventory'; -import { AchievementsDisplay } from '@/components/game/AchievementsDisplay'; +// Loot and Achievements moved to separate tabs import { DebugName } from '@/lib/game/debug-context'; export default function ManaLoopGame() { @@ -210,31 +209,7 @@ export default function ManaLoopGame() { /> - {/* Loot Inventory */} - - - - - {/* Achievements */} - - - + {/* Loot and Achievements moved to tabs */} {/* Right Panel - Tabs */} @@ -247,6 +222,8 @@ export default function ManaLoopGame() { 🔮 Spells 🛡️ Gear 🔧 Craft + 💎 Loot + 🏆 Achieve 🔬 Lab 📊 Stats 🔧 Debug @@ -289,6 +266,18 @@ export default function ManaLoopGame() { + + + + + + + + + + + + diff --git a/src/components/game/tabs/AchievementsTab.tsx b/src/components/game/tabs/AchievementsTab.tsx new file mode 100644 index 0000000..e5a7e48 --- /dev/null +++ b/src/components/game/tabs/AchievementsTab.tsx @@ -0,0 +1,43 @@ +'use client'; + +import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; +import { Badge } from '@/components/ui/badge'; +import type { GameStore } from '@/lib/game/store'; +import { AchievementsDisplay } from '@/components/game/AchievementsDisplay'; + +export interface AchievementsTabProps { + store: GameStore; +} + +export function AchievementsTab({ store }: AchievementsTabProps) { + const achievements = store.achievements; + const unlockedCount = achievements.unlocked.length; + + return ( +
+ + + + 🏆 Achievements + + {unlockedCount} unlocked + + + + + + + +
+ ); +} diff --git a/src/components/game/tabs/CraftingTab.tsx b/src/components/game/tabs/CraftingTab.tsx index 5d50879..2fb6e2e 100755 --- a/src/components/game/tabs/CraftingTab.tsx +++ b/src/components/game/tabs/CraftingTab.tsx @@ -383,7 +383,7 @@ export function CraftingTab({ store }: CraftingTabProps) { {/* Equipment Selection */} - Select Equipment to Prepare + Select Equipment to Prepare or Disenchant {preparationProgress ? ( @@ -401,28 +401,36 @@ export function CraftingTab({ store }: CraftingTabProps) { ) : (
- {equippedItems.map(({ slot, instance }) => ( -
setSelectedEquipmentInstance(instance.instanceId)} - > -
-
-
{instance.name}
-
{SLOT_NAMES[slot]}
-
-
-
{instance.usedCapacity}/{instance.totalCapacity} cap
-
{instance.enchantments.length} enchants
+ {equippedItems.map(({ slot, instance }) => { + const hasEnchantments = instance.enchantments.length > 0; + return ( +
setSelectedEquipmentInstance(instance.instanceId)} + > +
+
+
{instance.name}
+
{SLOT_NAMES[slot]}
+ {hasEnchantments && ( +
+ ⚠️ {instance.enchantments.length} enchantments - Disenchant to apply new +
+ )} +
+
+
{instance.usedCapacity}/{instance.totalCapacity} cap
+
{instance.enchantments.length} enchants
+
-
- ))} + ); + })} {equippedItems.length === 0 && (
No equipped items
)} @@ -440,43 +448,79 @@ export function CraftingTab({ store }: CraftingTabProps) { {!selectedEquipmentInstance ? (
- Select equipment to prepare + Select equipment to prepare or disenchant
) : preparationProgress ? (
Preparation in progress...
) : ( (() => { const instance = equipmentInstances[selectedEquipmentInstance]; + const hasEnchantments = instance.enchantments.length > 0; const prepTime = 2 + Math.floor(instance.totalCapacity / 50); const manaCost = instance.totalCapacity * 10; + // Calculate disenchant recovery + const disenchantLevel = skills.disenchanting || 0; + const recoveryRate = 0.1 + disenchantLevel * 0.2; + const totalRecoverable = instance.enchantments.reduce( + (sum, e) => sum + Math.floor(e.actualCost * recoveryRate), + 0 + ); + return (
{instance.name}
-
-
- Capacity: - {instance.usedCapacity}/{instance.totalCapacity} + + {/* Disenchant option for enchanted gear */} + {hasEnchantments && ( +
+
⚠️ Equipment has enchantments
+
+ You must disenchant before applying new enchantments. +
+
+ Recoverable Mana: + {fmt(totalRecoverable)} +
+
-
- Prep Time: - {prepTime}h -
-
- Mana Cost: - - {fmt(manaCost)} - -
-
- + )} + + {/* Prepare option for non-enchanted gear */} + {!hasEnchantments && ( + <> +
+
+ Capacity: + {instance.usedCapacity}/{instance.totalCapacity} +
+
+ Prep Time: + {prepTime}h +
+
+ Mana Cost: + + {fmt(manaCost)} + +
+
+ + + )}
); })() @@ -517,10 +561,12 @@ export function CraftingTab({ store }: CraftingTabProps) { ) : (
-
Equipment:
+
Equipment (without enchantments):
- {equippedItems.map(({ slot, instance }) => ( + {equippedItems + .filter(({ instance }) => instance.enchantments.length === 0) + .map(({ slot, instance }) => (
))} + {equippedItems.filter(({ instance }) => instance.enchantments.length === 0).length === 0 && ( +
+ No unenchanted equipment available. Disenchant in Prepare stage first. +
+ )}
@@ -632,51 +683,6 @@ export function CraftingTab({ store }: CraftingTabProps) { )} - - {/* Disenchant Section */} - - - Disenchant Equipment - - -
- {equippedItems - .filter(({ instance }) => instance.enchantments.length > 0) - .map(({ slot, instance }) => { - const disenchantLevel = skills.disenchanting || 0; - const recoveryRate = 0.1 + disenchantLevel * 0.2; - const totalRecoverable = instance.enchantments.reduce( - (sum, e) => sum + Math.floor(e.actualCost * recoveryRate), - 0 - ); - - return ( -
-
-
-
{instance.name}
-
{instance.enchantments.length} enchantments
-
- -
-
- ); - })} - {equippedItems.filter(({ instance }) => instance.enchantments.length > 0).length === 0 && ( -
- No enchanted equipment to disenchant -
- )} -
- -
); diff --git a/src/components/game/tabs/DebugTab.tsx b/src/components/game/tabs/DebugTab.tsx index e3599d7..7b563f6 100755 --- a/src/components/game/tabs/DebugTab.tsx +++ b/src/components/game/tabs/DebugTab.tsx @@ -9,7 +9,7 @@ import { Switch } from '@/components/ui/switch'; import { Label } from '@/components/ui/label'; import { RotateCcw, Bug, Plus, Minus, Lock, Unlock, Zap, - Clock, Star, AlertTriangle, Sparkles, Settings, Eye + Clock, Star, AlertTriangle, Sparkles, Settings, Eye, BookOpen } from 'lucide-react'; import type { GameStore } from '@/lib/game/types'; import { ATTUNEMENTS_DEF } from '@/lib/game/data/attunements'; @@ -415,6 +415,285 @@ export function DebugTab({ store }: DebugTabProps) {
+ + {/* Skill Research Debug */} + + + + + Skill Research Debug + + + +
+ {/* Enchanting Skills */} +
+
Enchanting Skills:
+
+ + +
+
+ + {/* Mana Skills */} +
+
Mana Skills:
+
+ + +
+
+ + {/* Study Skills */} +
+
Study Skills:
+
+ + +
+
+ + {/* Crafting Skills */} +
+
Crafting Skills:
+
+ + +
+
+ + {/* Research Effects */} +
+
Research Effects:
+
+ + +
+
+ + {/* Max All */} + +
+ +
+
+ +
); diff --git a/src/components/game/tabs/LootTab.tsx b/src/components/game/tabs/LootTab.tsx new file mode 100644 index 0000000..ce1eb5d --- /dev/null +++ b/src/components/game/tabs/LootTab.tsx @@ -0,0 +1,46 @@ +'use client'; + +import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; +import { Badge } from '@/components/ui/badge'; +import type { GameStore } from '@/lib/game/store'; +import { LootInventoryDisplay } from '@/components/game/LootInventory'; + +export interface LootTabProps { + store: GameStore; +} + +export function LootTab({ store }: LootTabProps) { + const inventory = store.lootInventory; + const elements = store.elements; + const equipmentInstances = store.equipmentInstances; + + // Count items for badge + const materialCount = Object.values(inventory.materials).reduce((a, b) => a + b, 0); + const blueprintCount = inventory.blueprints.length; + const equipmentCount = Object.keys(equipmentInstances).length; + const totalItems = materialCount + blueprintCount + equipmentCount; + + return ( +
+ + + + 💎 Loot Inventory + + {totalItems} items + + + + + + + +
+ ); +} diff --git a/src/components/game/tabs/index.ts b/src/components/game/tabs/index.ts index 6315760..64384ec 100755 --- a/src/components/game/tabs/index.ts +++ b/src/components/game/tabs/index.ts @@ -10,3 +10,5 @@ export { StatsTab } from './StatsTab'; export { EquipmentTab } from './EquipmentTab'; export { AttunementsTab } from './AttunementsTab'; export { DebugTab } from './DebugTab'; +export { LootTab } from './LootTab'; +export { AchievementsTab } from './AchievementsTab';