fix: split SpireTab.tsx to 395 lines, remove require() imports, import from data modules; complete store migration
Build and Publish Mana Loop Docker Image / build-and-publish (push) Successful in 30m15s

This commit is contained in:
Refactoring Agent
2026-05-04 13:36:10 +02:00
parent 0eabd604b0
commit 837d963b63
41 changed files with 727 additions and 3935 deletions
+68 -45
View File
@@ -73,8 +73,7 @@ function GrimoireTab() {
// Only access SPELLS_DEF on client-side
if (typeof window !== 'undefined' && SPELLS_DEF) {
const filtered = Object.values(SPELLS_DEF || {}).filter((s: any) => s.grimoire);
// Use setTimeout to avoid setState in effect issue
setTimeout(() => setGrimoireSpells(filtered), 0);
setGrimoireSpells(filtered);
}
}, []);
@@ -147,12 +146,16 @@ export default function ManaLoopGame() {
const gameOver = useUIStore((s) => s.gameOver);
// Get equipment state from store
const equippedInstances = useGameStore((s) => s.equippedInstances);
const equipmentInstances = useGameStore((s) => s.equipmentInstances);
// Derived state
const upgradeEffects = getUnifiedEffects({
skillUpgrades,
skillTiers,
equippedInstances: {},
equipmentInstances: {}
equippedInstances,
equipmentInstances
});
const maxMana = computeMaxMana({
@@ -225,11 +228,7 @@ export default function ManaLoopGame() {
{/* Main Content */}
<main className="flex-1 flex flex-col md:flex-row gap-4 p-4">
<LeftPanel
store={{ rawMana, maxMana, day, hour }}
effectiveRegen={effectiveRegen}
incursionStrength={incursionStrength}
/>
<LeftPanel />
<div className="flex-1 min-w-0">
<Tabs value={activeTab} onValueChange={setActiveTab}>
@@ -250,75 +249,99 @@ export default function ManaLoopGame() {
</TabsList>
<TabsContent value="spire">
<Suspense fallback={<TabLoadingFallback />}>
<SpireTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">spire tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<SpireTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="attunements">
<Suspense fallback={<TabLoadingFallback />}>
<AttunementsTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">attunements tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<AttunementsTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="golemancy">
<Suspense fallback={<TabLoadingFallback />}>
<GolemancyTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">golemancy tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<GolemancyTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="skills">
<Suspense fallback={<TabLoadingFallback />}>
<SkillsTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">skills tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<SkillsTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="spells">
<Suspense fallback={<TabLoadingFallback />}>
<SpellsTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">spells tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<SpellsTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="equipment">
<Suspense fallback={<TabLoadingFallback />}>
<EquipmentTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">equipment tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<EquipmentTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="crafting">
<Suspense fallback={<TabLoadingFallback />}>
<CraftingTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">crafting tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<CraftingTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="loot">
<Suspense fallback={<TabLoadingFallback />}>
<LootTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">loot tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<LootTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="achievements">
<Suspense fallback={<TabLoadingFallback />}>
<AchievementsTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">achievements tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<AchievementsTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="lab">
<Suspense fallback={<TabLoadingFallback />}>
<LabTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">lab tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<LabTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="stats">
<Suspense fallback={<TabLoadingFallback />}>
<StatsTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">stats tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<StatsTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="debug">
<Suspense fallback={<TabLoadingFallback />}>
<DebugTab />
</Suspense>
<ErrorBoundary fallback={<div className="p-4 text-red-400">debug tab failed to load.</div>}>
<Suspense fallback={<TabLoadingFallback />}>
<DebugTab />
</Suspense>
</ErrorBoundary>
</TabsContent>
<TabsContent value="grimoire">