62 lines
1.9 KiB
TypeScript
62 lines
1.9 KiB
TypeScript
import { SkillCategory, CategoryEvaluation, SkillLevel } from "@/lib/types";
|
|
import { SkillEvaluationCard } from "./skill-evaluation-card";
|
|
|
|
interface SkillEvaluationGridProps {
|
|
currentCategory: SkillCategory;
|
|
currentEvaluation: CategoryEvaluation;
|
|
onUpdateSkill: (category: string, skillId: string, level: SkillLevel) => void;
|
|
}
|
|
|
|
export function SkillEvaluationGrid({
|
|
currentCategory,
|
|
currentEvaluation,
|
|
onUpdateSkill,
|
|
}: SkillEvaluationGridProps) {
|
|
const getSkillLevel = (skillId: string): SkillLevel => {
|
|
const skillEval = currentEvaluation?.skills.find(
|
|
(s) => s.skillId === skillId
|
|
);
|
|
return skillEval?.level || null;
|
|
};
|
|
|
|
if (!currentEvaluation.selectedSkillIds.length) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
<div className="flex items-center gap-3">
|
|
<h3 className="text-xl font-bold text-white">
|
|
{currentCategory.category}
|
|
</h3>
|
|
<div className="px-3 py-1 rounded-full bg-blue-500/20 border border-blue-500/30">
|
|
<span className="text-xs font-medium text-blue-400">
|
|
{currentEvaluation.selectedSkillIds.length} compétence
|
|
{currentEvaluation.selectedSkillIds.length > 1 ? "s" : ""}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="space-y-2">
|
|
{currentEvaluation.selectedSkillIds.map((skillId) => {
|
|
const skill = currentCategory.skills.find((s) => s.id === skillId);
|
|
if (!skill) return null;
|
|
|
|
const currentLevel = getSkillLevel(skill.id);
|
|
|
|
return (
|
|
<SkillEvaluationCard
|
|
key={skill.id}
|
|
skill={skill}
|
|
currentLevel={currentLevel}
|
|
onUpdateSkill={(skillId, level) =>
|
|
onUpdateSkill(currentCategory.category, skillId, level)
|
|
}
|
|
/>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|