Pull Request branch dev-clone to main #1

Merged
gitea merged 429 commits from dev-clone into main 2024-12-23 09:31:34 +00:00
Showing only changes of commit 4cff4fd759 - Show all commits

View File

@ -60,6 +60,7 @@ export default function AssessmentPage() {
}>({}); }>({});
const fileInputRef = useRef<HTMLInputElement>(null); const fileInputRef = useRef<HTMLInputElement>(null);
const [modalOpen, setModalOpen] = useState(false); const [modalOpen, setModalOpen] = useState(false);
const [selectedAspectId, setSelectedAspectId] = useState<string | null>(null);
const [selectedSubAspectId, setSelectedSubAspectId] = useState<string | null>(null); const [selectedSubAspectId, setSelectedSubAspectId] = useState<string | null>(null);
const [assessmentId, setAssessmentId] = useState<string | null>(null); const [assessmentId, setAssessmentId] = useState<string | null>(null);
const [answers, setAnswers] = useState<{ [key: string]: string }>({}); const [answers, setAnswers] = useState<{ [key: string]: string }>({});
@ -85,26 +86,48 @@ export default function AssessmentPage() {
const id = getQueryParam("id"); const id = getQueryParam("id");
if (!id) { if (!id) {
// Handle if no ID found
setAssessmentId(null); setAssessmentId(null);
} else { } else {
setAssessmentId(id); setAssessmentId(id);
} }
// Check if aspectsQuery.data and aspectsQuery.data.data are defined // Check if aspectsQuery.data is defined
if (aspectsQuery.data?.data && aspectsQuery.data.data.length > 0) { if (aspectsQuery.data?.data && aspectsQuery.data.data.length > 0) {
// If no sub-aspect is selected, find a suitable default // If no sub-aspect is selected, find a suitable default
if (selectedSubAspectId === null) { if (selectedSubAspectId === null) {
const firstMatchingSubAspect = aspectsQuery.data.data const firstMatchingSubAspect = aspectsQuery.data.data
.flatMap(aspect => aspect.subAspects) // Get all sub-aspects .flatMap((aspect) => aspect.subAspects) // Get all sub-aspects
.find(subAspect => data?.data.some(question => question.subAspectId === subAspect.id)); // Filter based on available questions .find((subAspect) =>
data?.data.some((question) => question.subAspectId === subAspect.id)
);
if (firstMatchingSubAspect) { if (firstMatchingSubAspect) {
setSelectedSubAspectId(firstMatchingSubAspect.id); setSelectedSubAspectId(firstMatchingSubAspect.id);
// Find the parent aspect and set its id as the selectedAspectId
const parentAspect = aspectsQuery.data.data.find(aspect =>
aspect.subAspects.some(sub => sub.id === firstMatchingSubAspect.id)
);
if (parentAspect) {
setSelectedAspectId(parentAspect.id); // Use `id` from the parent aspect
}
}
} else {
// Update the aspectId based on the selected sub-aspect
const matchingAspect = aspectsQuery.data.data.find((aspect) =>
aspect.subAspects.some((subAspect) => subAspect.id === selectedSubAspectId)
);
if (matchingAspect) {
setSelectedAspectId(matchingAspect.id); // Use `id` from the matching aspect
} else {
console.warn("No matching aspect found for selected sub-aspect.");
setSelectedAspectId(null);
} }
} }
} }
}, [aspectsQuery.data, selectedSubAspectId, data?.data]) }, [aspectsQuery.data, selectedSubAspectId, data?.data]);
const handleConfirmFinish = () => { const handleConfirmFinish = () => {
if (assessmentId) { if (assessmentId) {
@ -128,11 +151,16 @@ export default function AssessmentPage() {
// Fetch average scores by aspect // Fetch average scores by aspect
const averageScoreQuery = useQuery(getAverageScoreQueryOptions(assessmentId || "")); const averageScoreQuery = useQuery(getAverageScoreQueryOptions(assessmentId || ""));
const aspects = averageScoreQuery.data?.aspects || [];
// Filter average score aspect berdasarkan sub-aspect yang dipilih // Filter aspects by selected aspectId
const filteredAverageScores = averageScoreQuery.data?.aspects?.filter(aspect => const filteredAspects = selectedAspectId
aspect.subAspects.some(subAspect => subAspect.subAspectId === selectedSubAspectId) ? aspects.filter((aspect) => aspect.aspectId === selectedAspectId) // Use 'id' instead of 'aspectId'
); : aspects;
// Get the currently selected aspect to show all related sub-aspects
const currentAspect = aspects.find(aspect => aspect.aspectId === selectedAspectId);
const filteredSubAspects = currentAspect ? currentAspect.subAspects : [];
// Mutation function to toggle flag // Mutation function to toggle flag
const toggleFlagMutation = useMutation<ToggleFlagResponse, Error, string>({ const toggleFlagMutation = useMutation<ToggleFlagResponse, Error, string>({
@ -671,19 +699,14 @@ export default function AssessmentPage() {
<Stack> <Stack>
{/* Skor Aspek */} {/* Skor Aspek */}
<div> <div>
{filteredAverageScores && filteredAverageScores.length > 0 ? ( {filteredAspects.length > 0 ? (
filteredAverageScores.map((aspect) => ( filteredAspects.map((aspect) => (
<div key={aspect.aspectId}> <div key={aspect.aspectId} className="flex justify-between items-center">
{/* Aspect Rendering */} <Text className="text-xl text-gray-400">{aspect.aspectName}</Text>
<div className="flex justify-between items-center">
<Text className="text-xl text-gray-400">
{aspect.aspectName}
</Text>
<Text className="text-xl font-bold"> <Text className="text-xl font-bold">
{parseFloat(aspect.averageScore).toFixed(2)} {parseFloat(aspect.averageScore).toFixed(2)}
</Text> </Text>
</div> </div>
</div>
)) ))
) : ( ) : (
<Text className="text-lg text-gray-400">Data aspek kosong</Text> <Text className="text-lg text-gray-400">Data aspek kosong</Text>
@ -697,25 +720,17 @@ export default function AssessmentPage() {
{/* Skor Sub-Aspek */} {/* Skor Sub-Aspek */}
<div> <div>
{filteredAverageScores && filteredAverageScores.length > 0 ? ( {filteredSubAspects.length > 0 ? (
filteredAverageScores.flatMap((aspect) => filteredSubAspects.map((subAspect) => (
aspect.subAspects && aspect.subAspects.length > 0 ? ( <div key={subAspect.subAspectId} className="flex justify-between items-center"> {/* Change key to 'id' */}
aspect.subAspects.map((subAspect) => ( <Text className="text-lg text-gray-400">{subAspect.subAspectName}</Text> {/* Change to 'name' */}
<div key={subAspect.subAspectId} className="flex justify-between items-center">
<Text className="text-lg text-gray-400">
{subAspect.subAspectName}
</Text>
<Text className="text-lg font-bold"> <Text className="text-lg font-bold">
{parseFloat(subAspect.averageScore).toFixed(2)} {parseFloat(subAspect.averageScore).toFixed(2)}
</Text> </Text>
</div> </div>
)) ))
) : ( ) : (
<Text className="text-lg text-gray-400">Tidak ada sub-aspek</Text> <Text className="text-lg text-gray-400">Data sub-aspek kosong</Text>
)
)
) : (
<Text className="text-lg text-gray-400">Data sub aspek kosong</Text>
)} )}
</div> </div>
</Stack> </Stack>