style: lint en format

frontend/src/queries/teachers.ts

@@ -1,6 +1,12 @@
 import { computed, toValue } from "vue";
 import type { MaybeRefOrGetter } from "vue";
-import { useMutation, useQuery, useQueryClient, type UseMutationReturnType, type UseQueryReturnType } from "@tanstack/vue-query";
+import {
+    useMutation,
+    useQuery,
+    useQueryClient,
+    type UseMutationReturnType,
+    type UseQueryReturnType,
+} from "@tanstack/vue-query";
 import { TeacherController, type TeacherResponse, type TeachersResponse } from "@/controllers/teachers.ts";
 import type { ClassesResponse } from "@/controllers/classes.ts";
 import type { JoinRequestResponse, JoinRequestsResponse, StudentsResponse } from "@/controllers/students.ts";

frontend/src/views/classes/StudentClasses.vue

@@ -87,9 +87,9 @@
                 return true;
             } else if (value !== undefined && validate(value) && version(value) === 4) {
                 return true;
-            } else {
-                return t("invalidFormat");
             } 
+                return t("invalidFormat");
+            
         },
     ];
 
@@ -97,7 +97,7 @@
     const { mutate } = useCreateJoinRequestMutation();
 
     // Function called when a student submits a code to join a class
-    function submitCode() {
+    function submitCode() : void {
         // Check if the code is valid
         if (code.value !== undefined && validate(code.value) && version(code.value) === 4) {
             mutate(
@@ -121,7 +121,7 @@
         color: "success",
     });
 
-    const showSnackbar = (message: string, color: string) => {
+    function showSnackbar(message: string, color: string) : void {
         snackbar.value.message = message;
         snackbar.value.color = color;
         snackbar.value.visible = true;

frontend/src/views/classes/TeacherClasses.vue

@@ -19,58 +19,48 @@
         username.value = userObject?.profile?.preferred_username ?? undefined;
     });
 
-    // fetch all classes of the logged in teacher
+    // Fetch all classes of the logged in teacher
     const { data: classesResponse, isLoading, error } = useTeacherClassesQuery(username, true);
 
     // Empty list when classes are not yet loaded, else the list of classes of the user
-    const classes: ComputedRef<ClassDTO[]> = computed(
+    const classes: ComputedRef<ClassDTO[]> = computed(() => {
-        () => {
+        // The classes are not yet fetched
-            // the classes are not yet fetched
+        if (!classesResponse.value) {
-            if (!classesResponse.value) {
+            return [];
-                return [];
+        }
-            }
+        // The user has no classes
-            // the user has no classes
+        if (classesResponse.value.classes.length === 0) {
-            if (classesResponse.value.classes.length === 0) {
+            return [];
-                return [];
+        }
-            }
+        if (typeof classesResponse.value.classes[0] === "string") {
-            if (typeof classesResponse.value.classes[0] === "string") {
+            // Should not occur because value of *full* is true
-                // should not occur because value of *full* is true
+            // Must be caught because typescript can't know the type
-                // must be caught because typescript can't know the type
+            // I chose to return an empty list if this occurs
-                // i chose to return an empty list if this occurs
+            // It is also possible to fetch all classes from the id's returned
-                // it is also possible to fetch all classes from the id's returned
+            return [];
-                return [];
+        }
-            }
+        return classesResponse.value.classes as ClassDTO[];
-            return classesResponse.value.classes as ClassDTO[];
+    });
-        },
-
-            
-            
-    );
 
     // Boolean that handles visibility for dialogs
     // Creating a class will generate a popup with the generated code
     const dialog = ref(false);
 
-    // Duntion to display the dialog showing generated code for created class
-    function openDialog(): void {
-        //TODO
-    }
-
     // Code generated when new class was created
     const code = ref<string>("");
 
-    // TODO: implement correctly
+    // TODO: waiting on frontend controllers
     const invitations = ref<TeacherInvitationDTO[]>([]);
 
     // Function to handle a accepted invitation request
-    function acceptRequest() {
+    function acceptRequest(): void {
-        //TODO
+        //TODO > waiting on updated frontend controllers
         console.log("request accepted");
     }
 
     // Function to handle a denied invitation request
-    function denyRequest() {
+    function denyRequest(): void {
-        //TODO
+        //TODO > waiting on frontend controllers
         console.log("request denied");
     }
 
@@ -80,35 +70,35 @@
     // The name can only contain dash, underscore letters and numbers
     // These rules are used to display a message to the user if the name is not valid
     const nameRules = [
-        (value: string | undefined) => {
+        (value: string | undefined): string | boolean => {
-            if (value) return true;
+            if (!value) return true;
-            return t("nameIsMandatory");
+            if (value && (/^[a-zA-Z0-9_-]+$/.test(value))) return true;
-        },
-        (value: string | undefined) => {
-            if (value && /^[a-zA-Z0-9_-]+$/.test(value)) return true;
             return t("onlyUse");
         },
     ];
 
     // Function called when a teacher creates a class
-    function createClass() {
+    function createClass(): void {
         // Check if the class name is valid
         if (className.value && className.value.length > 0 && /^[a-zA-Z0-9_-]+$/.test(className.value)) {
-            //TODO
+            //TODO > waiting on updated frontend controllers
             console.log("created class with name: " + className.value);
 
             // Show the generated code to share with the class
             dialog.value = true;
             code.value = "04c7c759-c41e-4ea9-968a-1e2a987ce0ed";
         }
+        if (!className.value || className.value === "") {
+            alert("classname should not be empty")
+        }
     }
 
     // Show the teacher, copying of the code was a successs
     const copied = ref(false);
 
     // Copy the generated code to the clipboard
-    function copyToClipboard() {
+    async function copyToClipboard(): Promise<void> {
-        navigator.clipboard.writeText(code.value);
+        await navigator.clipboard.writeText(code.value);
         copied.value = true;
     }
 </script>