gitea/amati
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update: revision for index lazy

Browse Source
This commit is contained in:
falendikategar 2024-10-11 09:38:00 +07:00
parent 91f9bc4745
commit a9a9b4dfc4
1 changed files with 61 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
apps/frontend/src/routes/_dashboardLayout/assessment/index.lazy.tsx
View File

@ -61,6 +61,12 @@ export default function AssessmentPage() {
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);
// Fetch aspects and sub-aspects
const aspectsQuery = useQuery({
queryKey: ["aspects"],
queryFn: fetchAspects,
});
useEffect(() => { useEffect(() => {
const id = getQueryParam("id"); const id = getQueryParam("id");
@ -70,7 +76,18 @@ export default function AssessmentPage() {
} else { } else {
setAssessmentId(id); setAssessmentId(id);
} }
}, []);
// Setel sub-aspek pertama sebagai default saat pertama kali halaman dimuat
// Check if aspectsQuery.data and aspectsQuery.data.data are defined
if (aspectsQuery.data?.data && aspectsQuery.data.data.length > 0 && selectedSubAspectId === null) {
const firstAspect = aspectsQuery.data.data[0];
const firstSubAspect = firstAspect?.subAspects?.[0];
if (firstSubAspect) {
setSelectedSubAspectId(firstSubAspect.id);
}
}
}, [aspectsQuery.data, selectedSubAspectId]);
// Fetching questions data using useQuery // Fetching questions data using useQuery
const { data, isLoading, isError, error } = useQuery( const { data, isLoading, isError, error } = useQuery(
@ -87,12 +104,6 @@ export default function AssessmentPage() {
})); }));
}; };
// Fetch aspects and sub-aspects
const aspectsQuery = useQuery({
queryKey: ["aspects"],
queryFn: fetchAspects,
});
// Fetch average scores berdasarkan assessmentId yang diambil dari URL // Fetch average scores berdasarkan assessmentId yang diambil dari URL
const averageScoreQuery = useQuery( const averageScoreQuery = useQuery(
getAverageScoreQueryOptions(assessmentId || "") getAverageScoreQueryOptions(assessmentId || "")
@ -231,7 +242,13 @@ export default function AssessmentPage() {
{/* Aspek dan Sub-Aspek */} {/* Aspek dan Sub-Aspek */}
<Flex direction="column" gap="xs" className="mr-4 w-52"> <Flex direction="column" gap="xs" className="mr-4 w-52">
<div className="space-y-4"> <div className="space-y-4">
{aspectsQuery.data?.data.map((aspect) => ( {aspectsQuery.data?.data
.filter((aspect) =>
aspect.subAspects.some((subAspect) =>
data?.data.some((question) => question.subAspectId === subAspect.id)
)
)
.map((aspect) => (
<div <div
key={aspect.id} key={aspect.id}
className="p-4 bg-gray-50 rounded-lg shadow-md" className="p-4 bg-gray-50 rounded-lg shadow-md"
@ -252,7 +269,11 @@ export default function AssessmentPage() {
{openAspects[aspect.id] && ( {openAspects[aspect.id] && (
<div className="mt-2 space-y-2"> <div className="mt-2 space-y-2">
{aspect.subAspects.map((subAspect) => ( {aspect.subAspects
.filter((subAspect) =>
data?.data.some((question) => question.subAspectId === subAspect.id)
)
.map((subAspect) => (
<div <div
key={subAspect.id} key={subAspect.id}
className={`flex justify-between text-gray-600 cursor-pointer ${selectedSubAspectId === subAspect.id ? 'font-bold' : ''}`} className={`flex justify-between text-gray-600 cursor-pointer ${selectedSubAspectId === subAspect.id ? 'font-bold' : ''}`}