diff --git a/apps/frontend/src/routes/_dashboardLayout/assessment/index.lazy.tsx b/apps/frontend/src/routes/_dashboardLayout/assessment/index.lazy.tsx
index 5ef8086..c1d0494 100644
--- a/apps/frontend/src/routes/_dashboardLayout/assessment/index.lazy.tsx
+++ b/apps/frontend/src/routes/_dashboardLayout/assessment/index.lazy.tsx
@@ -60,6 +60,7 @@ export default function AssessmentPage() {
   }>({});
   const fileInputRef = useRef<HTMLInputElement>(null);
   const [modalOpen, setModalOpen] = useState(false);
+  const [selectedAspectId, setSelectedAspectId] = useState<string | null>(null);
   const [selectedSubAspectId, setSelectedSubAspectId] = useState<string | null>(null);
   const [assessmentId, setAssessmentId] = useState<string | null>(null);
   const [answers, setAnswers] = useState<{ [key: string]: string }>({});
@@ -99,10 +100,13 @@ export default function AssessmentPage() {
 
         if (firstMatchingSubAspect) {
           setSelectedSubAspectId(firstMatchingSubAspect.id);
+          setSelectedAspectId(aspectsQuery.data.data.find(aspect => 
+            aspect.subAspects.some(sub => sub.id === firstMatchingSubAspect.id)
+          )?.id || null); // Set selectedAspectId based on the found sub-aspect
         }
       }
     }
-  }, [aspectsQuery.data, selectedSubAspectId, data?.data]);
+  }, [aspectsQuery.data, selectedSubAspectId, data?.data])
 
   const handleConfirmFinish = () => {
     if (assessmentId) {
@@ -124,14 +128,21 @@ export default function AssessmentPage() {
     }));
   };
 
-  // Fetch average scores berdasarkan assessmentId yang diambil dari URL
-  const averageScoreQuery = useQuery(
-    getAverageScoreQueryOptions(assessmentId || "")
+  // Fetch average scores by aspect
+  const averageScoreQuery = useQuery(getAverageScoreQueryOptions(assessmentId || ""));
+
+  // Fetch average scores by sub-aspect
+  const averageScoreSubAspectQuery = useQuery(getAverageScoreSubAspectQueryOptions(assessmentId || ""));
+
+  // Filter average score aspect berdasarkan sub-aspect yang dipilih
+  const filteredAverageScores = averageScoreQuery.data?.aspects?.filter(aspect =>
+    aspect.subAspects.some(subAspect => subAspect.subAspectId === selectedSubAspectId)
   );
 
-  // Fetch average scores for sub-aspects
-  const averageScoreSubAspectQuery = useQuery(
-    getAverageScoreSubAspectQueryOptions(assessmentId || "")
+  // Filter average scores for the selected sub-aspect
+  const averageScoresForSelectedSubAspect = averageScoreSubAspectQuery.data?.subAspects?.filter(
+    (subAspect) => 
+      subAspect.aspectId === selectedAspectId // Use the appropriate property for filtering
   );
 
   // Mutation function to toggle flag
@@ -519,42 +530,46 @@ export default function AssessmentPage() {
             <div className="mt-4">
               <Card shadow="sm" p="md" radius="md" withBorder>
                 <Stack>
-                  {averageScores && averageScores.length > 0 ? (
-                    averageScores.map((aspect: any) => (
-                      <div key={aspect.AspectId} className="flex justify-between items-center">
-                        <Text className="text-xl text-gray-400">
-                          {aspect.AspectName}
-                        </Text>
-                        <Text className="text-xl font-bold">
-                          {parseFloat(aspect.averageScore).toFixed(1)}
-                        </Text>
-                      </div>
-                    ))
-                  ) : (
-                    <Text>Tidak ada data skor.</Text>
-                  )}
+                  {/* Skor Aspek */}
+                  <div>
+                    {filteredAverageScores && filteredAverageScores.length > 0 ? (
+                      filteredAverageScores.map((aspect) => (
+                        <div key={aspect.aspectId} className="flex justify-between items-center">
+                          <Text className="text-xl text-gray-400">
+                            {aspect.aspectName}
+                          </Text>
+                          <Text className="text-xl font-bold">
+                            {parseFloat(aspect.averageScore).toFixed(2)}
+                          </Text>
+                        </div>
+                      ))
+                    ) : (
+                      <Text className="text-lg text-gray-400">Data aspek kosong</Text>
+                    )}
+                  </div>
 
                   {/* Garis pembatas */}
                   <div>
                     <hr className="border-t-2 border-gray-300 w-full mx-auto" />
                   </div>
 
-                  {averageScoresSubAspect && averageScoresSubAspect.length > 0 && (
-                    <Stack>
-                      {averageScoresSubAspect.map((subAspects: any) => {
-                        return (
-                          <div key={subAspects.subAspectId} className="flex justify-between items-center">
-                            <Text className="text-lg text-gray-400">
-                              {subAspects.subAspectName}
-                            </Text>
-                            <Text className="text-lg font-bold">
-                              {parseFloat(subAspects.averageScore).toFixed(1)}
-                            </Text>
-                          </div>
-                        );
-                      })}
-                    </Stack>
-                  )}
+                  {/* Skor Sub-Aspek */}
+                  <div>
+                  {averageScoresForSelectedSubAspect?.length ? (
+                      averageScoresForSelectedSubAspect.map((subAspect) => (
+                        <div key={subAspect.aspectId} className="flex justify-between items-center">
+                          <Text className="text-lg text-gray-400">
+                            {subAspect.subAspectName}
+                          </Text>
+                          <Text className="text-lg font-bold">
+                            {parseFloat(subAspect.averageScore).toFixed(2)}
+                          </Text>
+                        </div>
+                      ))
+                    ) : (
+                      <Text className="text-lg text-gray-400">Data sub aspek kosong</Text>
+                    )}
+                  </div>
                 </Stack>
 
                 {/* Tombol Selesai */}