Add mentor and learning status updates to skill evaluation

- Introduced `updateSkillMentorStatus` and `updateSkillLearningStatus` functions to manage mentor and learning preferences for skills.
- Updated `SkillEvaluationCard` to include buttons for toggling mentor and learning statuses with corresponding icons.
- Enhanced `SkillEvaluationGrid` and `SkillEvaluation` components to pass new status update handlers.
- Modified `SkillEvaluation` type to accommodate new properties for mentor and learning status.

components/evaluation/skill-evaluation-card.tsx

@@ -1,16 +1,18 @@
-import { ExternalLink, Info, X } from "lucide-react";
+import { ExternalLink, Info, X, UserCheck, GraduationCap } from "lucide-react";
 import {
   Tooltip,
   TooltipContent,
   TooltipTrigger,
 } from "@/components/ui/tooltip";
-import { Skill, SkillLevel, SKILL_LEVELS } from "@/lib/types";
+import { Skill, SkillLevel, SKILL_LEVELS, SkillEvaluation } from "@/lib/types";
 import { TechIcon } from "@/components/icons/tech-icon";
 
 interface SkillEvaluationCardProps {
   skill: Skill;
-  currentLevel: SkillLevel;
+  skillEvaluation: SkillEvaluation;
   onUpdateSkill: (skillId: string, level: SkillLevel) => void;
+  onUpdateMentorStatus: (skillId: string, canMentor: boolean) => void;
+  onUpdateLearningStatus: (skillId: string, wantsToLearn: boolean) => void;
   onRemoveSkill: (skillId: string) => void;
 }
 
@@ -42,10 +44,13 @@ function getLevelColorBorder(level: Exclude<SkillLevel, null>) {
 
 export function SkillEvaluationCard({
   skill,
-  currentLevel,
+  skillEvaluation,
   onUpdateSkill,
+  onUpdateMentorStatus,
+  onUpdateLearningStatus,
   onRemoveSkill,
 }: SkillEvaluationCardProps) {
+  const currentLevel = skillEvaluation.level;
   return (
     <div className="group relative bg-white/5 backdrop-blur-sm border border-white/10 rounded-xl p-3 hover:bg-white/10 hover:border-white/20 transition-all duration-300 hover:shadow-lg hover:shadow-blue-500/10">
       <div className="flex items-center justify-between">
@@ -135,6 +140,62 @@ export function SkillEvaluationCard({
             );
           })}
 
+          {/* Mentor and Learning Status Icons */}
+          <div className="flex items-center gap-1.5 ml-2 border-l border-white/10 pl-2">
+            {/* Mentor Icon */}
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <button
+                  onClick={() =>
+                    onUpdateMentorStatus(skill.id, !skillEvaluation.canMentor)
+                  }
+                  className={`p-1 rounded-md transition-all hover:scale-110 ${
+                    skillEvaluation.canMentor
+                      ? "bg-green-500/20 text-green-400 hover:bg-green-500/30"
+                      : "text-slate-400 hover:text-green-400 hover:bg-green-500/10"
+                  }`}
+                >
+                  <UserCheck className="h-4 w-4" />
+                </button>
+              </TooltipTrigger>
+              <TooltipContent>
+                <p className="text-xs">
+                  {skillEvaluation.canMentor
+                    ? "Peut mentorer"
+                    : "Peut mentorer"}
+                </p>
+              </TooltipContent>
+            </Tooltip>
+
+            {/* Learning Icon */}
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <button
+                  onClick={() =>
+                    onUpdateLearningStatus(
+                      skill.id,
+                      !skillEvaluation.wantsToLearn
+                    )
+                  }
+                  className={`p-1 rounded-md transition-all hover:scale-110 ${
+                    skillEvaluation.wantsToLearn
+                      ? "bg-blue-500/20 text-blue-400 hover:bg-blue-500/30"
+                      : "text-slate-400 hover:text-blue-400 hover:bg-blue-500/10"
+                  }`}
+                >
+                  <GraduationCap className="h-4 w-4" />
+                </button>
+              </TooltipTrigger>
+              <TooltipContent>
+                <p className="text-xs">
+                  {skillEvaluation.wantsToLearn
+                    ? "Veut apprendre"
+                    : "J'aimerais apprendre"}
+                </p>
+              </TooltipContent>
+            </Tooltip>
+          </div>
+
           {/* Remove button */}
           <div className="flex items-center ml-2 border-l border-white/10 pl-2">
             <Tooltip>

components/evaluation/skill-evaluation-grid.tsx

@@ -5,6 +5,16 @@ interface SkillEvaluationGridProps {
   currentCategory: SkillCategory;
   currentEvaluation: CategoryEvaluation;
   onUpdateSkill: (category: string, skillId: string, level: SkillLevel) => void;
+  onUpdateMentorStatus: (
+    category: string,
+    skillId: string,
+    canMentor: boolean
+  ) => void;
+  onUpdateLearningStatus: (
+    category: string,
+    skillId: string,
+    wantsToLearn: boolean
+  ) => void;
   onRemoveSkill: (category: string, skillId: string) => void;
 }
 
@@ -12,13 +22,22 @@ export function SkillEvaluationGrid({
   currentCategory,
   currentEvaluation,
   onUpdateSkill,
+  onUpdateMentorStatus,
+  onUpdateLearningStatus,
   onRemoveSkill,
 }: SkillEvaluationGridProps) {
-  const getSkillLevel = (skillId: string): SkillLevel => {
+  const getSkillEvaluation = (skillId: string) => {
     const skillEval = currentEvaluation?.skills.find(
       (s) => s.skillId === skillId
     );
-    return skillEval?.level || null;
+    return (
+      skillEval || {
+        skillId,
+        level: null,
+        canMentor: false,
+        wantsToLearn: false,
+      }
+    );
   };
 
   if (!currentEvaluation.selectedSkillIds.length) {
@@ -44,16 +63,30 @@ export function SkillEvaluationGrid({
           const skill = currentCategory.skills.find((s) => s.id === skillId);
           if (!skill) return null;
 
-          const currentLevel = getSkillLevel(skill.id);
+          const skillEvaluation = getSkillEvaluation(skill.id);
 
           return (
             <SkillEvaluationCard
               key={skill.id}
               skill={skill}
-              currentLevel={currentLevel}
+              skillEvaluation={skillEvaluation}
               onUpdateSkill={(skillId, level) =>
                 onUpdateSkill(currentCategory.category, skillId, level)
               }
+              onUpdateMentorStatus={(skillId, canMentor) =>
+                onUpdateMentorStatus(
+                  currentCategory.category,
+                  skillId,
+                  canMentor
+                )
+              }
+              onUpdateLearningStatus={(skillId, wantsToLearn) =>
+                onUpdateLearningStatus(
+                  currentCategory.category,
+                  skillId,
+                  wantsToLearn
+                )
+              }
               onRemoveSkill={(skillId) =>
                 onRemoveSkill(currentCategory.category, skillId)
               }

components/skill-evaluation.tsx

@@ -16,6 +16,16 @@ interface SkillEvaluationProps {
   categories: SkillCategory[];
   evaluations: CategoryEvaluation[];
   onUpdateSkill: (category: string, skillId: string, level: SkillLevel) => void;
+  onUpdateMentorStatus: (
+    category: string,
+    skillId: string,
+    canMentor: boolean
+  ) => void;
+  onUpdateLearningStatus: (
+    category: string,
+    skillId: string,
+    wantsToLearn: boolean
+  ) => void;
   onAddSkill: (category: string, skillId: string) => void;
   onRemoveSkill: (category: string, skillId: string) => void;
 }
@@ -24,6 +34,8 @@ export function SkillEvaluation({
   categories,
   evaluations,
   onUpdateSkill,
+  onUpdateMentorStatus,
+  onUpdateLearningStatus,
   onAddSkill,
   onRemoveSkill,
 }: SkillEvaluationProps) {
@@ -94,6 +106,8 @@ export function SkillEvaluation({
                 currentCategory={currentCategory}
                 currentEvaluation={currentEvaluation}
                 onUpdateSkill={onUpdateSkill}
+                onUpdateMentorStatus={onUpdateMentorStatus}
+                onUpdateLearningStatus={onUpdateLearningStatus}
                 onRemoveSkill={onRemoveSkill}
               />
             )}