fix(router): users already configured cannot access the config pages

src/assets/base.css

@@ -30,12 +30,6 @@
     --section-gap: 160px;
 }
 
-@media (prefers-color-scheme: dark) {
-    :root {
-        /* TODO: add dark mode colors */
-    }
-}
-
 *,
 *::before,
 *::after {

src/router/index.ts

 import { createRouter, createWebHistory } from 'vue-router'
-import authInterceptor from '@/services/authInterceptor'
 import { useUserStore } from '@/stores/userStore'
 
 const router = createRouter({
@@ -121,9 +120,9 @@ const router = createRouter({
             component: () => import('@/views/NotFoundView.vue')
         },
         {
-            path: '/addAlternativeLogin',
-            name: 'addAlternativeLogin',
-            component: () => import('@/views/AddAlternativeLogin.vue')
+            path: '/konfigurerBiometri',
+            name: 'configure-biometric',
+            component: () => import('@/views/ConfigBiometricView.vue')
         }
     ],
     scrollBehavior() {
@@ -141,19 +140,20 @@ router.beforeEach(async (to, from, next) => {
     ]
 
     const authRequired = !publicPages.some((page) => page.name === to.name)
-    const loggedIn = sessionStorage.getItem('accessToken')
-    const loginToken = localStorage.getItem('loginToken')
+    const hasLoginCredentials =
+        sessionStorage.getItem('accessToken') !== null &&
+        localStorage.getItem('refreshToken') !== null
 
-    if (authRequired && !loggedIn && !loginToken) {
+    if (authRequired && !hasLoginCredentials) {
         console.log('Routing to login')
         await router.replace({ name: 'login' })
         return next({ name: 'login' })
-    } else if (!authRequired && loggedIn) {
-        await router.replace({ name: 'home' })
-        return next({ name: 'home' })
+    } else if (!authRequired && !hasLoginCredentials) {
+        return next()
     }
 
     const configPages = [
+        { name: 'configure-biometric' },
         { name: 'configurations1' },
         { name: 'configurations2' },
         { name: 'configurations3' },
@@ -164,28 +164,17 @@ router.beforeEach(async (to, from, next) => {
 
     const userStore = useUserStore()
 
-    if (userStore.isUserConfigured == null) {
-        console.log('Checking if user is configured')
-
-        await authInterceptor('/config')
-            .then((response) => {
-                console.log(response)
-
-                userStore.isUserConfigured = response.data.challengeConfig != null
-            })
-            .catch((response) => {
-                console.log(response)
-                userStore.isUserConfigured = false
-            })
+    if (userStore.user.isConfigured == false) {
+        await userStore.checkIfUserConfigured()
     }
 
     const configRequired = !configPages.some((page) => page.name === to.name)
+    const isConfigured = userStore.user.isConfigured
 
-    if (configRequired && !userStore.isUserConfigured) {
-        console.log('Routing to configurations1')
-        await router.replace({ name: 'configurations1' })
-        return next({ name: 'configurations1' })
-    } else if (!configRequired && userStore.isUserConfigured) {
+    if (configRequired && !isConfigured) {
+        await router.replace({ name: 'configure-biometric' })
+        return next({ name: 'configure-biometric' })
+    } else if (!configRequired && isConfigured) {
         await router.replace({ name: 'home' })
         return next({ name: 'home' })
     }

src/services/authInterceptor.ts

@@ -35,18 +35,18 @@ authInterceptor.interceptors.response.use(
             originalRequest._retry = true
             sessionStorage.removeItem('accessToken')
 
-            const loginToken = localStorage.getItem('loginToken')
+            const refreshToken = localStorage.getItem('refreshToken')
             axios
-                .post('/auth/loginToken', null, {
+                .post('/auth/renewToken', null, {
                     headers: {
-                        Authorization: `Bearer ${loginToken}`
+                        Authorization: `Bearer ${refreshToken}`
                     }
                 })
                 .then((response) => {
                     router.push({ name: 'login-bio', params: { username: response.data.username } })
                 })
                 .catch(() => {
-                    localStorage.removeItem('loginToken')
+                    localStorage.removeItem('refreshToken')
                     router.push({ name: 'login' })
 
                     Promise.reject(error)

src/stores/userStore.ts

@@ -13,10 +13,10 @@ export const useUserStore = defineStore('user', () => {
     const defaultUser: User = {
         firstname: 'Firstname',
         lastname: 'Lastname',
-        username: 'Username'
+        username: 'Username',
+        isConfigured: false
     }
 
-    const isUserConfigured = ref<boolean | null>(null)
     const user = ref<User>(defaultUser)
     const errorMessage = ref<string>('')
 
@@ -29,7 +29,7 @@ export const useUserStore = defineStore('user', () => {
     ) => {
         await axios
             .post(`http://localhost:8080/auth/register`, {
-                firstName: firstname, //TODO rename all instances of firstname to firstName
+                firstName: firstname,
                 lastName: lastname,
                 email: email,
                 username: username,
@@ -43,7 +43,7 @@ export const useUserStore = defineStore('user', () => {
                 user.value.lastname = lastname
                 user.value.username = username
 
-                router.push({ name: 'addAlternativeLogin' })
+                router.push({ name: 'configure-biometric' })
             })
             .catch((error) => {
                 const axiosError = error as AxiosError
@@ -65,7 +65,11 @@ export const useUserStore = defineStore('user', () => {
                 user.value.lastname = response.data.lastName
                 user.value.username = response.data.username
 
-                router.push({ name: 'home' })
+                checkIfUserConfigured()
+
+                user.value.isConfigured
+                    ? router.push({ name: 'home' })
+                    : router.push({ name: 'configure-biometric' })
             })
             .catch((error) => {
                 const axiosError = error as AxiosError
@@ -78,8 +82,6 @@ export const useUserStore = defineStore('user', () => {
         sessionStorage.removeItem('accessToken')
         localStorage.removeItem('refreshToken')
         user.value = defaultUser
-        isUserConfigured.value = null
-
         router.push({ name: 'login' })
     }
 
@@ -216,13 +218,25 @@ export const useUserStore = defineStore('user', () => {
         }
     }
 
+    const checkIfUserConfigured = async () => {
+        await authInterceptor('/config')
+            .then((response) => {
+                user.value.isConfigured = response.data.challengeConfig != null
+                console.log('User configured: ' + user.value.isConfigured)
+            })
+            .catch(() => {
+                user.value.isConfigured = false
+            })
+    }
+
     return {
+        user,
+        checkIfUserConfigured,
         register,
         login,
         logout,
         bioLogin,
         bioRegister,
-        isUserConfigured,
         errorMessage
     }
 })

src/types/user.ts

@@ -2,4 +2,6 @@ export interface User {
     firstname: string
     lastname: string
     username: string
+    isConfigured: boolean
+    isBiometric?: boolean
 }