refactor(frontend): Algemene linting fouten
This commit is contained in:
		
							parent
							
								
									8efce6bee0
								
							
						
					
					
						commit
						dd1000c662
					
				
					 9 changed files with 26 additions and 25 deletions
				
			
		|  | @ -29,11 +29,11 @@ | ||||||
|     ]); |     ]); | ||||||
| 
 | 
 | ||||||
|     // Logic to change the language of the website to the selected language |     // Logic to change the language of the website to the selected language | ||||||
|     const changeLanguage = (langCode: string) => { |     function changeLanguage(langCode: string): void { | ||||||
|         locale.value = langCode; |         locale.value = langCode; | ||||||
|         localStorage.setItem("user-lang", langCode); |         localStorage.setItem("user-lang", langCode); | ||||||
|         console.log(langCode); |         console.log(langCode); | ||||||
|     }; |     } | ||||||
| </script> | </script> | ||||||
| 
 | 
 | ||||||
| <template> | <template> | ||||||
|  |  | ||||||
|  | @ -20,13 +20,13 @@ const router = createRouter({ | ||||||
|         { |         { | ||||||
|             path: "/", |             path: "/", | ||||||
|             name: "home", |             name: "home", | ||||||
|             component: () => import("../views/HomePage.vue"), |             component: async (): Promise<unknown> => import("../views/HomePage.vue"), | ||||||
|             meta: { requiresAuth: false }, |             meta: { requiresAuth: false }, | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|             path: "/login", |             path: "/login", | ||||||
|             name: "LoginPage", |             name: "LoginPage", | ||||||
|             component: () => import("../views/LoginPage.vue"), |             component: async (): Promise<unknown> => import("../views/LoginPage.vue"), | ||||||
|             meta: { requiresAuth: false }, |             meta: { requiresAuth: false }, | ||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|  | @ -108,7 +108,7 @@ const router = createRouter({ | ||||||
|     ], |     ], | ||||||
| }); | }); | ||||||
| 
 | 
 | ||||||
| router.beforeEach(async (to, from, next) => { | router.beforeEach(async (to, _from, next) => { | ||||||
|     // Verify if user is logged in before accessing certain routes
 |     // Verify if user is logged in before accessing certain routes
 | ||||||
|     if (to.meta.requiresAuth) { |     if (to.meta.requiresAuth) { | ||||||
|         if (!authState.isLoggedIn.value) { |         if (!authState.isLoggedIn.value) { | ||||||
|  |  | ||||||
|  | @ -1,10 +1,11 @@ | ||||||
| import apiClient from "@/services/api-client.ts"; | import apiClient from "@/services/api-client.ts"; | ||||||
| import type { FrontendAuthConfig } from "@/services/auth/auth.d.ts"; | import type { FrontendAuthConfig } from "@/services/auth/auth.d.ts"; | ||||||
|  | import type {UserManagerSettings} from "oidc-client-ts"; | ||||||
| 
 | 
 | ||||||
| /** | /** | ||||||
|  * Fetch the authentication configuration from the backend. |  * Fetch the authentication configuration from the backend. | ||||||
|  */ |  */ | ||||||
| export async function loadAuthConfig() { | export async function loadAuthConfig(): Promise<Record<string, UserManagerSettings>> { | ||||||
|     const authConfig = (await apiClient.get<FrontendAuthConfig>("auth/config")).data; |     const authConfig = (await apiClient.get<FrontendAuthConfig>("auth/config")).data; | ||||||
|     return { |     return { | ||||||
|         student: { |         student: { | ||||||
|  |  | ||||||
|  | @ -49,7 +49,7 @@ const isLoggedIn = computed(() => authState.user !== null); | ||||||
| /** | /** | ||||||
|  * Redirect the user to the login page where he/she can choose whether to log in as a student or teacher. |  * Redirect the user to the login page where he/she can choose whether to log in as a student or teacher. | ||||||
|  */ |  */ | ||||||
| async function initiateLogin() { | async function initiateLogin(): Promise<void> { | ||||||
|     await router.push(loginRoute); |     await router.push(loginRoute); | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
|  | @ -77,12 +77,12 @@ async function handleLoginCallback(): Promise<void> { | ||||||
| /** | /** | ||||||
|  * Refresh an expired authorization token. |  * Refresh an expired authorization token. | ||||||
|  */ |  */ | ||||||
| async function renewToken() { | async function renewToken(): Promise<User | null> { | ||||||
|     const activeRole = authStorage.getActiveRole(); |     const activeRole = authStorage.getActiveRole(); | ||||||
|     if (!activeRole) { |     if (!activeRole) { | ||||||
|         console.log("Can't renew the token: Not logged in!"); |         console.log("Can't renew the token: Not logged in!"); | ||||||
|         await initiateLogin(); |         await initiateLogin(); | ||||||
|         return; |         return null; | ||||||
|     } |     } | ||||||
|     try { |     try { | ||||||
|         return await (await getUserManagers())[activeRole].signinSilent(); |         return await (await getUserManagers())[activeRole].signinSilent(); | ||||||
|  | @ -91,6 +91,7 @@ async function renewToken() { | ||||||
|         console.log(error); |         console.log(error); | ||||||
|         await initiateLogin(); |         await initiateLogin(); | ||||||
|     } |     } | ||||||
|  |     return null; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| /** | /** | ||||||
|  | @ -113,7 +114,7 @@ apiClient.interceptors.request.use( | ||||||
|         } |         } | ||||||
|         return reqConfig; |         return reqConfig; | ||||||
|     }, |     }, | ||||||
|     (error) => Promise.reject(error), |     async (error) => Promise.reject(error), | ||||||
| ); | ); | ||||||
| 
 | 
 | ||||||
| // Registering interceptor to refresh the token when a request failed because it was expired.
 | // Registering interceptor to refresh the token when a request failed because it was expired.
 | ||||||
|  | @ -121,7 +122,7 @@ apiClient.interceptors.response.use( | ||||||
|     (response) => response, |     (response) => response, | ||||||
|     async (error: AxiosError<{ message?: string }>) => { |     async (error: AxiosError<{ message?: string }>) => { | ||||||
|         if (error.response?.status === 401) { |         if (error.response?.status === 401) { | ||||||
|             if (error.response!.data.message === "token_expired") { |             if (error.response.data.message === "token_expired") { | ||||||
|                 console.log("Access token expired, trying to refresh..."); |                 console.log("Access token expired, trying to refresh..."); | ||||||
|                 await renewToken(); |                 await renewToken(); | ||||||
|                 return apiClient(error.config!); // Retry the request
 |                 return apiClient(error.config!); // Retry the request
 | ||||||
|  |  | ||||||
|  | @ -12,7 +12,7 @@ export default { | ||||||
|      * Set the role the user is currently logged in as from the local persistent storage. |      * Set the role the user is currently logged in as from the local persistent storage. | ||||||
|      * This should happen when the user logs in with another account. |      * This should happen when the user logs in with another account. | ||||||
|      */ |      */ | ||||||
|     setActiveRole(role: Role) { |     setActiveRole(role: Role): void { | ||||||
|         localStorage.setItem("activeRole", role); |         localStorage.setItem("activeRole", role); | ||||||
|     }, |     }, | ||||||
| 
 | 
 | ||||||
|  | @ -20,7 +20,7 @@ export default { | ||||||
|      * Remove the saved current role from the local persistent storage. |      * Remove the saved current role from the local persistent storage. | ||||||
|      * This should happen when the user is logged out. |      * This should happen when the user is logged out. | ||||||
|      */ |      */ | ||||||
|     deleteActiveRole() { |     deleteActiveRole(): void { | ||||||
|         localStorage.removeItem("activeRole"); |         localStorage.removeItem("activeRole"); | ||||||
|     }, |     }, | ||||||
| }; | }; | ||||||
|  |  | ||||||
							
								
								
									
										14
									
								
								frontend/src/services/auth/auth.d.ts
									
										
									
									
										vendored
									
									
								
							
							
						
						
									
										14
									
								
								frontend/src/services/auth/auth.d.ts
									
										
									
									
										vendored
									
									
								
							|  | @ -1,22 +1,22 @@ | ||||||
| import { type User, UserManager } from "oidc-client-ts"; | import { type User, UserManager } from "oidc-client-ts"; | ||||||
| 
 | 
 | ||||||
| export type AuthState = { | export interface AuthState { | ||||||
|     user: User | null; |     user: User | null; | ||||||
|     accessToken: string | null; |     accessToken: string | null; | ||||||
|     activeRole: Role | null; |     activeRole: Role | null; | ||||||
| }; | } | ||||||
| 
 | 
 | ||||||
| export type FrontendAuthConfig = { | export interface FrontendAuthConfig { | ||||||
|     student: FrontendIdpConfig; |     student: FrontendIdpConfig; | ||||||
|     teacher: FrontendIdpConfig; |     teacher: FrontendIdpConfig; | ||||||
| }; | } | ||||||
| 
 | 
 | ||||||
| export type FrontendIdpConfig = { | export interface FrontendIdpConfig { | ||||||
|     authority: string; |     authority: string; | ||||||
|     clientId: string; |     clientId: string; | ||||||
|     scope: string; |     scope: string; | ||||||
|     responseType: string; |     responseType: string; | ||||||
| }; | } | ||||||
| 
 | 
 | ||||||
| export type Role = "student" | "teacher"; | export type Role = "student" | "teacher"; | ||||||
| export type UserManagersForRoles = { student: UserManager; teacher: UserManager }; | export interface UserManagersForRoles { student: UserManager; teacher: UserManager } | ||||||
|  |  | ||||||
|  | @ -5,7 +5,7 @@ | ||||||
| 
 | 
 | ||||||
|     const testResponse = ref(null); |     const testResponse = ref(null); | ||||||
| 
 | 
 | ||||||
|     async function testAuthenticated() { |     async function testAuthenticated(): Promise<void> { | ||||||
|         testResponse.value = await apiClient.get("/auth/testAuthenticatedOnly"); |         testResponse.value = await apiClient.get("/auth/testAuthenticatedOnly"); | ||||||
|     } |     } | ||||||
| </script> | </script> | ||||||
|  |  | ||||||
|  | @ -2,15 +2,15 @@ | ||||||
|     import dwengoLogo from "../../../assets/img/dwengo-groen-zwart.svg"; |     import dwengoLogo from "../../../assets/img/dwengo-groen-zwart.svg"; | ||||||
|     import auth from "@/services/auth/auth-service.ts"; |     import auth from "@/services/auth/auth-service.ts"; | ||||||
| 
 | 
 | ||||||
|     function loginAsStudent() { |     function loginAsStudent(): void { | ||||||
|         auth.loginAs("student"); |         auth.loginAs("student"); | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     function loginAsTeacher() { |     function loginAsTeacher(): void { | ||||||
|         auth.loginAs("teacher"); |         auth.loginAs("teacher"); | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     function performLogout() { |     function performLogout(): void { | ||||||
|         auth.logout(); |         auth.logout(); | ||||||
|     } |     } | ||||||
| </script> | </script> | ||||||
|  |  | ||||||
|  | @ -2,7 +2,6 @@ import { fileURLToPath, URL } from "node:url"; | ||||||
| 
 | 
 | ||||||
| import { defineConfig } from "vite"; | import { defineConfig } from "vite"; | ||||||
| import vue from "@vitejs/plugin-vue"; | import vue from "@vitejs/plugin-vue"; | ||||||
| import vueDevTools from "vite-plugin-vue-devtools"; |  | ||||||
| 
 | 
 | ||||||
| // https://vite.dev/config/
 | // https://vite.dev/config/
 | ||||||
| export default defineConfig({ | export default defineConfig({ | ||||||
|  |  | ||||||
		Reference in a new issue