Move redirect logic in generic error handling

Author: maudetes

components/User/TwoFactorSetupModal.vue

@@ -111,15 +111,12 @@ const {
 } = useTwoFactorSetup()
 
 const fetchStatusAndQRCode = async () => {
-  const { data: twoFactorData } = await useAPI<{ response: { tf_primary_method: string | null, reauth_required: boolean } | null }>('/tf-setup')
-  isConfigured.value = !!twoFactorData.value?.response?.tf_primary_method
-  if (twoFactorData.value?.response?.reauth_required) {
-    toast.error(t('Vous devez confirmer votre mot de passe pour configurer l\'authentification deux facteurs.'))
-    isOpen.value = false
-    await navigateTo({ path: '/verify', query: { next: '/admin/me/profile' } }, { replace: true })
+  // fetch two factor status. If freshness is required, a 401 is returned with automatic handling and redirection to /verify
+  const { data: twoFactorData, status } = await useAPI<{ response: { tf_primary_method: string | null, reauth_required: boolean } | null }>('/tf-setup')
+  if (status.value !== 'error') {
+    isConfigured.value = !!twoFactorData.value?.response?.tf_primary_method
+    await fetchQRCode()
   }
-
-  await fetchQRCode()
 }
 
 const submit = async (close: () => void) => {

plugins/api.ts

@@ -45,7 +45,12 @@ export default defineNuxtPlugin({
           }
 
           if (response.status === 401) {
-            await nuxtApp.runWithContext(() => navigateTo({ path: '/login', query: { next: route.fullPath } }))
+            if (response._data?.response && typeof response._data.response === 'object' && 'reauth_required' in response._data.response) {
+              await nuxtApp.runWithContext(() => navigateTo({ path: '/verify', query: { next: route.fullPath } }))
+            }
+            else {
+              await nuxtApp.runWithContext(() => navigateTo({ path: '/login', query: { next: route.fullPath } }))
+            }
           }
 
           if (response.status === 429) {
@@ -70,6 +75,9 @@ export default defineNuxtPlugin({
               else if ('errors' in response._data && typeof response._data.errors === 'object') {
                 message = Object.entries(response._data.errors).map(([key, value]) => `${key}: ${value}`).join(' ; ')
               }
+              else if ('response' in response._data && 'errors' in response._data.response && Array.isArray(response._data.response.errors)) {
+                message = response._data.response.errors.join(' ; ')
+              }
             }
             catch (e) {
               console.error(e)