zhipu
2ca5d8b7f8
Build and Publish Mana Loop Docker Image / build-and-publish (push) Successful in 3m4s
Store refactoring (2138 → 1651 lines, 23% reduction): - Extract computed-stats.ts with 18 utility functions - Extract navigation-slice.ts for floor navigation actions - Extract study-slice.ts for study-related actions - Move fmt/fmtDec to computed-stats, re-export from formatting Page refactoring (2554 → 1695 lines, 34% reduction): - Use existing SpireTab component instead of inline render - Extract ActionButtons component - Extract CalendarDisplay component - Extract CraftingProgress component - Extract StudyProgress component - Extract ManaDisplay component - Extract TimeDisplay component - Create tabs/index.ts for cleaner exports This improves code organization and makes the codebase more maintainable.
58 lines
1.9 KiB
TypeScript
58 lines
1.9 KiB
TypeScript
'use client';
|
|
|
|
import { Button } from '@/components/ui/button';
|
|
import { Progress } from '@/components/ui/progress';
|
|
import { BookOpen, X } from 'lucide-react';
|
|
import { SKILLS_DEF, SPELLS_DEF } from '@/lib/game/constants';
|
|
import { formatStudyTime } from '@/lib/game/formatting';
|
|
import type { StudyTarget } from '@/lib/game/types';
|
|
|
|
interface StudyProgressProps {
|
|
currentStudyTarget: StudyTarget | null;
|
|
skills: Record<string, number>;
|
|
studySpeedMult: number;
|
|
cancelStudy: () => void;
|
|
}
|
|
|
|
export function StudyProgress({
|
|
currentStudyTarget,
|
|
skills,
|
|
studySpeedMult,
|
|
cancelStudy,
|
|
}: StudyProgressProps) {
|
|
if (!currentStudyTarget) return null;
|
|
|
|
const target = currentStudyTarget;
|
|
const progressPct = Math.min(100, (target.progress / target.required) * 100);
|
|
const isSkill = target.type === 'skill';
|
|
const def = isSkill ? SKILLS_DEF[target.id] : SPELLS_DEF[target.id];
|
|
const currentLevel = isSkill ? (skills[target.id] || 0) : 0;
|
|
|
|
return (
|
|
<div className="p-3 rounded border border-purple-600/50 bg-purple-900/20">
|
|
<div className="flex items-center justify-between mb-2">
|
|
<div className="flex items-center gap-2">
|
|
<BookOpen className="w-4 h-4 text-purple-400" />
|
|
<span className="text-sm font-semibold text-purple-300">
|
|
{def?.name}
|
|
{isSkill && ` Lv.${currentLevel + 1}`}
|
|
</span>
|
|
</div>
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
className="h-6 w-6 p-0 text-gray-400 hover:text-white"
|
|
onClick={cancelStudy}
|
|
>
|
|
<X className="w-4 h-4" />
|
|
</Button>
|
|
</div>
|
|
<Progress value={progressPct} className="h-2 bg-gray-800" />
|
|
<div className="flex justify-between text-xs text-gray-400 mt-1">
|
|
<span>{formatStudyTime(target.progress)} / {formatStudyTime(target.required)}</span>
|
|
<span>{studySpeedMult.toFixed(1)}x speed</span>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|