feat: handling SSR on evaluation

components/skill-evaluation.tsx

@@ -5,6 +5,7 @@ import { useSearchParams, useRouter } from "next/navigation";
 import { TooltipProvider } from "@/components/ui/tooltip";
 import { SkillCategory, SkillLevel, CategoryEvaluation } from "@/lib/types";
 import { SkillSelector } from "./skill-selector";
+import { useEvaluationContext } from "./evaluation";
 import {
   EvaluationHeader,
   SkillLevelLegend,
@@ -15,30 +16,19 @@ import {
 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;
 }
 
 export function SkillEvaluation({
   categories,
   evaluations,
-  onUpdateSkill,
-  onUpdateMentorStatus,
-  onUpdateLearningStatus,
-  onAddSkill,
-  onRemoveSkill,
 }: SkillEvaluationProps) {
+  const {
+    updateSkillLevel,
+    updateSkillMentorStatus,
+    updateSkillLearningStatus,
+    addSkillToEvaluation,
+    removeSkillFromEvaluation,
+  } = useEvaluationContext();
   const searchParams = useSearchParams();
   const router = useRouter();
   const categoryParam = searchParams.get("category");
@@ -97,18 +87,18 @@ export function SkillEvaluation({
               categories={categories}
               evaluations={evaluations}
               selectedCategory={selectedCategory}
-              onAddSkill={onAddSkill}
-              onRemoveSkill={onRemoveSkill}
+              onAddSkill={addSkillToEvaluation}
+              onRemoveSkill={removeSkillFromEvaluation}
             />
 
             {currentEvaluation && (
               <SkillEvaluationGrid
                 currentCategory={currentCategory}
                 currentEvaluation={currentEvaluation}
-                onUpdateSkill={onUpdateSkill}
-                onUpdateMentorStatus={onUpdateMentorStatus}
-                onUpdateLearningStatus={onUpdateLearningStatus}
-                onRemoveSkill={onRemoveSkill}
+                onUpdateSkill={updateSkillLevel}
+                onUpdateMentorStatus={updateSkillMentorStatus}
+                onUpdateLearningStatus={updateSkillLearningStatus}
+                onRemoveSkill={removeSkillFromEvaluation}
               />
             )}
           </div>