wip(nuxt3): add interceptor

Signed-off-by: Pranav C <pranavxc@gmail.com>

packages/nc-gui-v2/composables/project.ts

@@ -4,28 +4,19 @@ import {useUser} from "~/composables/user";
 
 export const useProject = () => {
   const {$api} = useNuxtApp()
-  const {user} = useUser()
 
   const project = useState<{ id?: string, title?: string }>('project', null)
   const tables = useState<Array<TableType>>('tables', null)
 
   const loadTables = async () => {
-    const tablesResponse = await $api.dbTable.list(project?.value?.id, {}, {
-      headers: {
-        'xc-auth': user.token
-      }
-    })
+    const tablesResponse = await $api.dbTable.list(project?.value?.id)
 
     console.log(tablesResponse)
     tables.value = tablesResponse.list
   }
 
   const loadProject = async (projectId:string) => {
-    const projectResponse = await $api.project.read(projectId, {
-      headers: {
-        'xc-auth': user.token
-      }
-    })
+    const projectResponse = await $api.project.read(projectId)
 
     console.log(projectResponse)
     project.value = projectResponse

packages/nc-gui-v2/composables/user.ts

@@ -12,6 +12,8 @@ export  const useUser = () =>{
   })
 
   const {$api} = useNuxtApp()
+  const route = useRoute()
+  const router = useRouter()
 
 
   const getUser =async (args = {}) => {
@@ -28,5 +30,94 @@ export  const useUser = () =>{
     user.token = token
   }
 
+
+
+  $api?.instance?.interceptors.request.use((config) => {
+    config.headers['xc-gui'] = 'true'
+    if (user?.token) {
+      config.headers['xc-auth'] = user?.token
+    }
+    if (!config.url.endsWith('/user/me') && !config.url.endsWith('/admin/roles')) {
+      // config.headers['xc-preview'] = store.state.users.previewAs
+    }
+
+    if (!config.url.endsWith('/user/me') && !config.url.endsWith('/admin/roles')) {
+      if (route && route.params && route.params.shared_base_id) {
+        config.headers['xc-shared-base-id'] = route.params.shared_base_id
+      }
+    }
+
+    return config
+  })
+
+  // $axios.setBaseURL('http://localhost:8080')
+
+  $api?.instance?.interceptors.response.use((response) => {
+    // Return a successful response back to the calling service
+    return response
+  }, (error) => {
+    if (error.response && error.response.data && error.response.data.msg === 'Database config not found') {
+      router.replace('/project/0')
+      return
+    }
+
+    // Return any error which is not due to authentication back to the calling service
+    if (!error.response || error.response.status !== 401) {
+      return new Promise((resolve, reject) => {
+        reject(error)
+      })
+    }
+
+    // Logout user if token refresh didn't work or user is disabled
+    if (error.config.url === '/auth/refresh-token') {
+      // todo: clear token
+      // store.dispatch('users/ActSignOut')
+      setToken(null)
+
+      return new Promise((resolve, reject) => {
+        reject(error)
+      })
+    }
+
+    // Try request again with new token
+    return $api.instance.post('/auth/refresh-token', null, {
+      withCredentials: true
+    })
+      .then((token) => {
+        // New request with new token
+        const config = error.config
+        config.headers['xc-auth'] = token.data.token
+        user.token =  token.data.token
+
+        return new Promise((resolve, reject) => {
+          $api.instance.request(config).then((response) => {
+            resolve(response)
+          }).catch((error) => {
+            reject(error)
+          })
+        })
+      })
+      .catch(async (error) => {
+        //todo: clear token
+        // await store.dispatch('users/ActSignOut')
+        setToken(null)
+        if (store.state.project.appInfo.firstUser) {
+          router.replace('/')
+        } else {
+          // $toast.clear()
+          // $toast.info('Token Expired. Please login again.', {
+          //   position: 'bottom-center'
+          // }).goAway(5000)
+          router.replace('/user/authentication/signin')
+        }
+        return Promise.reject(error)
+      })
+  })
+
+
   return {user,setToken, getUser}
 }
+
+
+
+

packages/nc-gui-v2/pages/projects/index.vue

@@ -47,11 +47,7 @@ const $router = useRouter();
 const projects = ref();
 
 const loadProjects = async () => {
-  const projectsResponse = await $api.project.list({}, {
-    headers: {
-      "xc-auth": user.token
-    }
-  });
+  const projectsResponse = await $api.project.list();
   projects.value = projectsResponse.list;
 };
 

packages/nc-gui-v2/plugins/api.ts

@@ -1,27 +1,21 @@
 import { useNuxtApp } from "#app";
 import { Api } from "nocodb-sdk";
 import { defineNuxtPlugin } from "nuxt3/app";
-import { watch } from "vue";
-import { useUser } from "~/composables/user";
-
 
 export default defineNuxtPlugin((nuxtApp) => {
 
 
-  const { user } = useUser();
 
   // Doing something with nuxtApp
 
   const api = getApi(null, null);
 
-  nuxtApp.provide("api", api);
-
+  // nuxtApp.provide("api", api);
 
-  debugger
 
   return {
     provide: {
-      api123: api
+      api
     }
   };
 });
@@ -41,10 +35,3 @@ export function getApi($store, $axios) {
   }
   return api;
 }
-
-//
-// export default function({ store: $store, $axios, ...rest }, inject) {
-//   const api = getApi($store, $axios)
-//
-//   inject('api', api)
-// }