fix: 403 error bij het opvragen van een opdracht

frontend/src/views/assignments/StudentAssignment.vue

@@ -2,11 +2,14 @@
 import {ref, computed, watchEffect} from "vue";
 import auth from "@/services/auth/auth-service.ts";
 import {useI18n} from "vue-i18n";
-    import { useAssignmentQuery } from "@/queries/assignments.ts";
 import UsingQueryResult from "@/components/UsingQueryResult.vue";
-    import type { AssignmentResponse } from "@/controllers/assignments.ts";
+import type {AssignmentsResponse} from "@/controllers/assignments.ts";
 import {asyncComputed} from "@vueuse/core";
-    import { useStudentGroupsQuery, useStudentsByUsernamesQuery } from "@/queries/students.ts";
+import {
+    useStudentAssignmentsQuery,
+    useStudentGroupsQuery,
+    useStudentsByUsernamesQuery
+} from "@/queries/students.ts";
 import {useGetLearningPathQuery} from "@/queries/learning-paths.ts";
 import type {Language} from "@/data-objects/language.ts";
 import {calculateProgress} from "@/utils/assignment-utils.ts";
@@ -26,8 +29,19 @@
     return user?.profile?.preferred_username ?? undefined;
 });
 
-    const assignmentQueryResult = useAssignmentQuery(() => props.classId, props.assignmentId);
+const assignmentsQueryResult = useStudentAssignmentsQuery(username, true);
-    learningPath.value = assignmentQueryResult.data.value?.assignment?.learningPath;
+
+const assignment = computed(() => {
+    const assignments = assignmentsQueryResult.data.value?.assignments;
+    if (!assignments) return undefined;
+
+    return assignments.find(
+        (a) => a.id === props.assignmentId && a.within === props.classId
+    );
+});
+
+
+learningPath.value = assignment.value?.learningPath;
 
 const groupsQueryResult = useStudentGroupsQuery(username, true);
 const group = computed(() => {
@@ -47,8 +61,8 @@
 });
 
 watchEffect(() => {
-        learningPath.value = assignmentQueryResult.data.value?.assignment?.learningPath;
+    learningPath.value = assignment.value?.learningPath;
-        lang.value = assignmentQueryResult.data.value?.assignment?.language as Language;
+    lang.value = assignment.value?.language as Language;
 });
 
 const learningPathParams = computed(() => {
@@ -80,11 +94,10 @@
 <template>
     <div class="container">
         <using-query-result
-            :query-result="assignmentQueryResult"
+            :query-result="assignmentsQueryResult"
-            v-slot="assignmentResponse: { data: AssignmentResponse }"
         >
             <v-card
-                v-if="assignmentResponse"
+                v-if="assignment"
                 class="assignment-card"
             >
                 <div class="top-buttons">
@@ -98,7 +111,7 @@
                     </v-btn>
                 </div>
                 <v-card-title class="text-h4 assignmentTopTitle"
-                    >{{ assignmentResponse.data.assignment.title }}
+                >{{ assignment.title }}
                 </v-card-title>
 
                 <v-card-subtitle class="subtitle-section">
@@ -110,7 +123,7 @@
                             v-if="lpData"
                             :to="
                                 group
-                                    ? `/learningPath/${lpData.hruid}/${assignmentResponse.data.assignment?.language}/${lpData.startNode.learningobjectHruid}?forGroup=${0}&assignmentNo=${assignmentId}&classId=${classId}`
+                                    ? `/learningPath/${lpData.hruid}/${assignment.language}/${lpData.startNode.learningobjectHruid}?forGroup=${group.groupNo}&assignmentNo=${assignment.id}&classId=${assignment.within}`
                                     : undefined
                             "
                             :disabled="!group"
@@ -123,7 +136,7 @@
                 </v-card-subtitle>
 
                 <v-card-text class="description">
-                    {{ assignmentResponse.data.assignment.description }}
+                    {{ assignment.description }}
                 </v-card-text>
                 <v-card-text>
                     <v-card-text>

frontend/src/views/assignments/UserAssignments.vue

@@ -8,12 +8,12 @@
 import {useStudentAssignmentsQuery, useStudentClassesQuery} from "@/queries/students.ts";
 import {useDeleteAssignmentMutation} from "@/queries/assignments.ts";
 import UsingQueryResult from "@/components/UsingQueryResult.vue";
-    import { asyncComputed } from "@vueuse/core";
 
 const {t, locale} = useI18n();
 const router = useRouter();
 
 const role = ref(auth.authState.activeRole);
+const isTeacher = computed(() => role.value === "teacher");
 const username = ref<string | undefined>(undefined);
 const isLoading = ref(false);
 const isError = ref(false);
@@ -33,7 +33,6 @@
     }
 });
 
-    const isTeacher = computed(() => role.value === "teacher");
 const classesQueryResult = isTeacher.value
     ? useTeacherClassesQuery(username, true)
     : useStudentClassesQuery(username, true);
@@ -42,8 +41,7 @@
     ? useTeacherAssignmentsQuery(username, true)
     : useStudentAssignmentsQuery(username, true);
 
-    const allAssignments = asyncComputed(
+const allAssignments = computed(() => {
-        async () => {
     const assignments = assignmentsQueryResult.data.value?.assignments;
     if (!assignments) return [];
 
@@ -75,10 +73,8 @@
 
         return aTime - bTime;
     });
-        },
+});
-        [],
+
-        { evaluating: true },
-    );
 
 async function goToCreateAssignment(): Promise<void> {
     await router.push("/assignment/create");
@@ -238,8 +234,7 @@
     border-radius: 16px;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
     background-color: white;
-        transition:
+    transition: transform 0.2s,
-            transform 0.2s,
     box-shadow 0.2s;
 }