handle a lot of error, make all responsive

src/App.vue

@@ -16,11 +16,6 @@
           command:() => router.push({name:'home'}),
           icon: 'pi pi-home',
         },
-        {
-          label:'Logout',
-          command:() => logout(),
-          icon:'pi pi-sign-out',
-        },
         {
           label:userInfo.value ? userInfo.value.username : 'Profil',
           command:() => router.push({name:'login'}),
@@ -31,6 +26,11 @@
           command:() => router.push({name:'swagger'}),
           icon:'pi pi-cog',
         },
+        {
+          label:'Logout',
+          command:() => logout(),
+          icon:'pi pi-sign-out',
+        },
       ];
       } else {
           return [

src/api.js

@@ -40,37 +40,41 @@ export const getuserinfo = async () => {
     return response.data;
 };
 const refreshAccessToken = async () => {
-    try {
+  try {
-      const response = await api.post('/token/refresh', {'refresh': Cookies.get('refresh')}, {
+    const response = await api.post('/token/refresh', {'refresh': Cookies.get('refresh')}, {
-        withCredentials: true, 
+      withCredentials: true, 
-      });
+    });
-  
+
-      const { access, refresh } = response.data;
+    const { access, refresh } = response.data;
-      
+    
-      return [access, refresh];
+    return [access, refresh];
-    } catch (error) {
+  } catch (error) {
-      console.error('Refresh token request failed:', error);
+    console.error('Refresh token request failed:', error);
-      return null;
+    return null;
-    }
+  }
-  };
+};
 
 api.interceptors.response.use(
-    (response) => response, 
+  (response) => response, 
-    async (error) => {
+  async (error) => {
-      if (error.response && error.response.status === 401) {
+    if (error.response && error.response.status === 401) {
-        const [newAccessToken,newRefreshToken] = await refreshAccessToken();
+      const errorMessage = error.response.data.detail;
-        if (newAccessToken) {
+      if (errorMessage === "No active account found with the given credentials") {
-            Cookies.set('refresh', newRefreshToken,{
+        return Promise.reject(error);
-                expires: 1,
+      } else {
-                secure: true,
+        const tokens = await refreshAccessToken();
-                sameSite: 'strict',
+        if (tokens) {
-            });
+          const [newAccessToken, newRefreshToken] = tokens;
+          Cookies.set('refresh', newRefreshToken, {
+            expires: 1,
+            secure: true,
+            sameSite: 'strict',
+          });
           error.config.headers['Authorization'] = `Bearer ${newAccessToken}`;
           return api(error.config);
         }
       }
-      return Promise.reject(error);
     }
-  );
+    return Promise.reject(error);
-// const response = await api.post('/users', userData, { 
+  }
-// headers: {Authorization: `Bearer ${sessionStorage.getItem('access_token')}`},);
+);

src/views/Login.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { ref } from 'vue';
-import { createUser, loginUser,getuserinfo } from '../api.js';
+import { createUser, loginUser, getuserinfo } from '../api.js';
 import { useToast } from 'primevue/usetoast';
 import PMessage from 'primevue/message';
 import { useAuth } from '../composables/useAuth.js';
@@ -26,9 +26,9 @@ async function make_user() {
       email: emailRegister.value,
       password: passwordRegister.value,
     });
-    toast.add({ severity: 'success', summary: 'Succès', detail: 'Utilisateur créé !' });
     isAuth.value = true;
     userInfo.value = await getuserinfo();
+    toast.add({ severity: 'success', summary: 'Succès', detail: 'Utilisateur créé !' });
   } catch (error) {
     if (error.response && error.response.data) {
       const data = error.response.data;
@@ -57,6 +57,9 @@ async function login() {
   } catch (error) {
     if (error.response && error.response.data) {
       const data = error.response.data;
+      if (data.detail) {
+        toast.add({ severity: 'error', summary: 'Erreur', detail: data.detail });
+      }
       if (data.username) {
         loginErrors.value.username = data.username[0];
       }