store: implement API caching for logged in user

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>

Author: yadvr

package-lock.json

@@ -25,7 +25,7 @@ import 'nprogress/nprogress.css' // progress bar style
 import message from 'ant-design-vue/es/message'
 import notification from 'ant-design-vue/es/notification'
 import { setDocumentTitle, domTitle } from '@/utils/domUtil'
-import { ACCESS_TOKEN } from '@/store/mutation-types'
+import { ACCESS_TOKEN, APIS } from '@/store/mutation-types'
 
 NProgress.configure({ showSpinner: false }) // NProgress Configuration
 
@@ -42,7 +42,10 @@ router.beforeEach((to, from, next) => {
       NProgress.done()
     } else {
       if (Object.keys(store.getters.apis).length === 0) {
-        message.loading('Discovering features...', 5)
+        const cachedApis = Vue.ls.get(APIS, {})
+        if (Object.keys(cachedApis).length === 0) {
+          message.loading('Loading...', 4)
+        }
         store
           .dispatch('GetInfo')
           .then(apis => {

src/permission.js

@@ -19,7 +19,7 @@ import Cookies from 'js-cookie'
 import Vue from 'vue'
 import md5 from 'md5'
 import { login, logout, api } from '@/api'
-import { ACCESS_TOKEN, CURRENT_PROJECT, DEFAULT_THEME, ASYNC_JOB_IDS } from '@/store/mutation-types'
+import { ACCESS_TOKEN, CURRENT_PROJECT, DEFAULT_THEME, APIS, ASYNC_JOB_IDS } from '@/store/mutation-types'
 
 const user = {
   state: {
@@ -54,6 +54,7 @@ const user = {
     },
     SET_APIS: (state, apis) => {
       state.apis = apis
+      Vue.ls.set(APIS, apis)
     },
     SET_FEATURES: (state, features) => {
       state.features = features
@@ -114,22 +115,29 @@ const user = {
 
     GetInfo ({ commit }) {
       return new Promise((resolve, reject) => {
-        api('listApis').then(response => {
-          const apis = {}
-          const apiList = response.listapisresponse.api
-          for (var idx = 0; idx < apiList.length; idx++) {
-            const api = apiList[idx]
-            const apiName = api.name
-            apis[apiName] = {
-              params: api.params,
-              response: api.response
+        const cachedApis = Vue.ls.get(APIS, {})
+        if (Object.keys(cachedApis).length > 0) {
+          console.log('Login detected, using cached APIs')
+          commit('SET_APIS', cachedApis)
+          resolve(cachedApis)
+        } else {
+          api('listApis').then(response => {
+            const apis = {}
+            const apiList = response.listapisresponse.api
+            for (var idx = 0; idx < apiList.length; idx++) {
+              const api = apiList[idx]
+              const apiName = api.name
+              apis[apiName] = {
+                params: api.params,
+                response: api.response
+              }
             }
-          }
-          commit('SET_APIS', apis)
-          resolve(apis)
-        }).catch(error => {
-          reject(error)
-        })
+            commit('SET_APIS', apis)
+            resolve(apis)
+          }).catch(error => {
+            reject(error)
+          })
+        }
 
         api('listUsers').then(response => {
           const result = response.listusersresponse.user[0]

src/store/modules/user.js

@@ -27,6 +27,7 @@ export const DEFAULT_FIXED_SIDEMENU = 'DEFAULT_FIXED_SIDEMENU'
 export const DEFAULT_FIXED_HEADER_HIDDEN = 'DEFAULT_FIXED_HEADER_HIDDEN'
 export const DEFAULT_CONTENT_WIDTH_TYPE = 'DEFAULT_CONTENT_WIDTH_TYPE'
 export const DEFAULT_MULTI_TAB = 'DEFAULT_MULTI_TAB'
+export const APIS = 'APIS'
 export const ASYNC_JOB_IDS = 'ASYNC_JOB_IDS'
 
 export const CONTENT_WIDTH_TYPE = {