From cad72fe88c595e76be347e6337cd87c3d23ef1d3 Mon Sep 17 00:00:00 2001 From: n8n-gitea Date: Fri, 8 May 2026 15:28:13 +0200 Subject: [PATCH] Fix build error in SpireActiveSpells.tsx - resolve JSX parsing issue with template literals - Fixed unclosed template literal in className attribute - Added missing imports (Mountain, ELEMENTS) in SpireGolems.tsx - Build now passes successfully --- .../game/tabs/SpireActiveSpells.tsx | 36 +++++++---- src/components/game/tabs/SpireGolems.tsx | 3 + src/components/game/tabs/SpireTab.tsx | 59 ++++++++++++++----- 3 files changed, 71 insertions(+), 27 deletions(-) diff --git a/src/components/game/tabs/SpireActiveSpells.tsx b/src/components/game/tabs/SpireActiveSpells.tsx index 9ae38d5..d6282ef 100644 --- a/src/components/game/tabs/SpireActiveSpells.tsx +++ b/src/components/game/tabs/SpireActiveSpells.tsx @@ -52,6 +52,28 @@ export function SpireActiveSpells({ const progress = spellState?.castProgress || 0; const canCast = canCastSpell(spellId); + // Compute progress bar JSX + let progressBar = null; + if (currentAction === 'climb') { + const widthPercent = Math.min(100, progress * 100); + const elemColor = spellDef.elem === 'raw' ? '#60A5FA' : ELEMENTS[spellDef.elem]?.color || '#60A5FA'; + const backgroundGradient = 'linear-gradient(90deg, ' + elemColor + '99, ' + elemColor + ')'; + progressBar = ( +
+
+ Cast + {widthPercent.toFixed(0)}% +
+
+
+
+
+ ); + } + return (
@@ -59,22 +81,12 @@ export function SpireActiveSpells({ {spellDef.name} {spellDef.tier === 0 && Basic} - {canCast ? '✓' : '✗'} + {canCast ? '✓' : '✗'}
⚔️ {calcDamage({ skills, signedPacts, skillUpgrades, skillTiers }, spellId, floorElem)} dmg • {formatSpellCost(spellDef.cost)} {' '}• ⚡ {Math.floor(calcDamage({ skills, signedPacts, skillUpgrades, skillTiers }, spellId, floorElem) * (spellDef.castSpeed || 1))} dmg/hr
- {currentAction === 'climb' && ( -
-
- Cast - {(progress * 100).toFixed(0)}% -
-
-
-
-
- )} + {progressBar}
); })} diff --git a/src/components/game/tabs/SpireGolems.tsx b/src/components/game/tabs/SpireGolems.tsx index 69797d7..951f417 100644 --- a/src/components/game/tabs/SpireGolems.tsx +++ b/src/components/game/tabs/SpireGolems.tsx @@ -1,7 +1,9 @@ 'use client'; import { Card, CardContent } from '@/components/ui/card'; +import { Mountain } from 'lucide-react'; import { GOLEMS_DEF, getGolemDamage, getGolemAttackSpeed } from '@/lib/game/data/golems'; +import { ELEMENTS } from '@/lib/game/constants'; interface SpireGolemsProps { golemancy: { @@ -10,6 +12,7 @@ interface SpireGolemsProps { }; skills: Record; floorElem: string; + currentAction: string; } export function SpireGolems({ golemancy, skills, floorElem }: SpireGolemsProps) { diff --git a/src/components/game/tabs/SpireTab.tsx b/src/components/game/tabs/SpireTab.tsx index 29b86b7..5ddb883 100755 --- a/src/components/game/tabs/SpireTab.tsx +++ b/src/components/game/tabs/SpireTab.tsx @@ -4,7 +4,8 @@ import { useMemo } from 'react'; import { Button } from '@/components/ui/button'; import { Card, CardContent } from '@/components/ui/card'; import { Mountain, ChevronDown } from 'lucide-react'; -import { ELEMENTS, GUARDIANS, SPELLS_DEF } from '@/lib/game/constants'; +import type { ActivityLogEntry } from '@/lib/game/types'; +import { ELEMENTS, GUARDIANS, SPELLS_DEF, SKILLS_DEF } from '@/lib/game/constants'; import { calcDamage, getActiveEquipmentSpells, getTotalDPS } from '@/lib/game/utils'; import { getUnifiedEffects } from '@/lib/game/effects'; import { formatSpellCost, getSpellCostColor } from '@/lib/game/formatting'; @@ -23,10 +24,20 @@ import { SpireActiveSpells } from './SpireActiveSpells'; import { SpireGolems } from './SpireGolems'; import { DebugName } from '@/lib/game/debug-context'; +// Room type configurations +const ROOM_TYPE_CONFIG: Record = { + combat: { label: 'Combat', icon: '⚔️', color: '#EF4444' }, + swarm: { label: 'Swarm', icon: '🐝', color: '#F59E0B' }, + speed: { label: 'Speed', icon: '💨', color: '#3B82F6' }, + guardian: { label: 'Guardian', icon: '🛡️', color: '#EF4444' }, + puzzle: { label: 'Puzzle', icon: '🧩', color: '#8B5CF6' }, +}; + interface SpireTabProps { simpleMode?: boolean; } +// Check if player can enter spire mode const canEnterSpireMode = (spireMode: boolean): boolean => { return !spireMode; }; @@ -72,14 +83,8 @@ export function SpireTab({ simpleMode = false }: SpireTabProps) { const currentGuardian = GUARDIANS[currentFloor]; const isFloorCleared = clearedFloors[currentFloor]; const roomType = currentRoom?.roomType || 'combat'; - const roomConfig = { - combat: { label: 'Combat', icon: '⚔️', color: '#EF4444' }, - swarm: { label: 'Swarm', icon: '🐝', color: '#F59E0B' }, - speed: { label: 'Speed', icon: '💨', color: '#3B82F6' }, - guardian: { label: 'Guardian', icon: '🛡️', color: '#EF4444' }, - puzzle: { label: 'Puzzle', icon: '🧩', color: '#8B5CF6' }, - }[roomType] || { label: 'Combat', icon: '⚔️', color: '#EF4444' }; - + const roomConfig = ROOM_TYPE_CONFIG[roomType] || ROOM_TYPE_CONFIG.combat; + const activeEquipmentSpells = useMemo( () => getActiveEquipmentSpells(equippedInstances, equipmentInstances), [equippedInstances, equipmentInstances] @@ -107,12 +112,36 @@ export function SpireTab({ simpleMode = false }: SpireTabProps) { return canAffordSpellCost(spell.cost, rawMana, elements); }; + // Climb handlers - defined OUTSIDE of JSX + const handleClimbUp = () => { + useCombatStore.getState().startClimbUp(); + }; + + const handleClimbDown = () => { + useCombatStore.getState().startClimbDown(); + }; + + const handleClimb = (direction: 'up' | 'down') => { + if (direction === 'up') { + handleClimbUp(); + } else { + handleClimbDown(); + } + }; + const getSkillName = (skillId: string): string => { - return SPELLS_DEF[skillId]?.name || skillId; + return SKILLS_DEF[skillId]?.name || skillId; }; // Handle exit spire mode - const exitSpireMode = useCombatStore((s) => s.exitSpireMode); + const exitSpireMode = () => { + useCombatStore.getState().exitSpireMode(); + }; + + // Handle enter spire mode + const enterSpireMode = () => { + useCombatStore.getState().enterSpireMode(); + }; return ( @@ -124,7 +153,7 @@ export function SpireTab({ simpleMode = false }: SpireTabProps) {