Task 10(2f): Add Activity Log to SpireModeUI
Build and Publish Mana Loop Docker Image / build-and-publish (push) Successful in 20m15s
Build and Publish Mana Loop Docker Image / build-and-publish (push) Successful in 20m15s
- Added ActivityLogEntry type to game types - Added activityLog state to GameState interface - Added addActivityLogEntry helper function in store.ts - Added addActivityLog action to GameStore - Hooked into combat events: damage_dealt, enemy_defeated, floor_cleared, floor_transition - Hooked into special effects: dodge, armor_proc, special_effect (First Strike, Combo Master, etc.) - Hooked into golem attacks and puzzle solving - Updated SpireTab (tabs/SpireTab.tsx) to display activity log with colored entries - Latest entries first, scrollable list with event type-based styling
This commit is contained in:
@@ -8,7 +8,8 @@ import { ScrollArea } from '@/components/ui/scroll-area';
|
||||
import { Separator } from '@/components/ui/separator';
|
||||
import { TooltipProvider, Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
|
||||
import { BookOpen, ChevronUp, ChevronDown, RotateCcw, X, Mountain, Skull, Zap, Wind, Shield } from 'lucide-react';
|
||||
import type { GameStore } from '@/lib/game/types';
|
||||
import type { ActivityLogEntry } from '@/lib/game/types';
|
||||
import type { GameStore } from '@/lib/game/store';
|
||||
import { ELEMENTS, GUARDIANS, SPELLS_DEF, SKILLS_DEF, ROOM_TYPE_LABELS } from '@/lib/game/constants';
|
||||
import { GOLEMS_DEF, getGolemDamage, getGolemAttackSpeed } from '@/lib/game/data/golems';
|
||||
import { fmt, fmtDec, getFloorElement, canAffordSpellCost, getEnemyName } from '@/lib/game/store';
|
||||
@@ -490,6 +491,61 @@ export function SpireTab({ store, simpleMode = false }: SpireTabProps) {
|
||||
</Card>
|
||||
)}
|
||||
|
||||
{/* Activity Log - Show in Spire Mode (simpleMode) */}
|
||||
{simpleMode && (
|
||||
<Card className="bg-gray-900/80 border-gray-700 lg:col-span-2">
|
||||
<CardHeader className="pb-2">
|
||||
<CardTitle className="text-amber-400 game-panel-title text-xs">Activity Log</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<ScrollArea className="h-48">
|
||||
<div className="space-y-1">
|
||||
{(store.activityLog || []).slice(0, 50).map((entry: ActivityLogEntry, i) => {
|
||||
// Style based on event type
|
||||
const getEventStyle = (eventType: string) => {
|
||||
switch (eventType) {
|
||||
case 'enemy_defeated':
|
||||
case 'floor_cleared':
|
||||
return 'text-green-400';
|
||||
case 'damage_dealt':
|
||||
return 'text-red-400';
|
||||
case 'dodge':
|
||||
return 'text-yellow-400';
|
||||
case 'armor_proc':
|
||||
return 'text-blue-400';
|
||||
case 'special_effect':
|
||||
return 'text-purple-400';
|
||||
case 'floor_transition':
|
||||
return 'text-cyan-400';
|
||||
case 'spell_cast':
|
||||
return 'text-amber-400';
|
||||
case 'golem_attack':
|
||||
return 'text-orange-400';
|
||||
case 'puzzle_solved':
|
||||
return 'text-pink-400';
|
||||
default:
|
||||
return 'text-gray-300';
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
key={entry.id}
|
||||
className={`text-xs ${i === 0 ? 'text-gray-200 font-semibold' : getEventStyle(entry.eventType)}`}
|
||||
>
|
||||
{entry.message}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
{(store.activityLog || []).length === 0 && (
|
||||
<div className="text-xs text-gray-500 italic">No activity yet...</div>
|
||||
)}
|
||||
</div>
|
||||
</ScrollArea>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
|
||||
{/* Crafting Progress (if any) - Only show in normal mode */}
|
||||
{!simpleMode && (store.designProgress || store.preparationProgress || store.applicationProgress) && (
|
||||
<Card className="bg-gray-900/80 border-cyan-600/50 lg:col-span-2">
|
||||
|
||||
@@ -2,7 +2,8 @@
|
||||
|
||||
import { create } from 'zustand';
|
||||
import { persist } from 'zustand/middleware';
|
||||
import type { GameState, GameAction, StudyTarget, SpellCost, SkillUpgradeChoice, EquipmentSlot, EquipmentInstance, EnchantmentDesign, DesignEffect, AttunementState, FloorState, EnemyState, RoomType, EquipmentSpellState, ActivityLogEntry } from './types';
|
||||
import type { GameState, GameAction, StudyTarget, SpellCost, SkillUpgradeChoice, EquipmentInstance, EnchantmentDesign, DesignEffect, AttunementState, FloorState, EnemyState, RoomType, EquipmentSpellState, ActivityLogEntry } from './types';
|
||||
import type { EquipmentSlot } from './data/equipment';
|
||||
import {
|
||||
ELEMENTS,
|
||||
GUARDIANS,
|
||||
|
||||
Reference in New Issue
Block a user