Invalidate cached API responses when bad response statuses are recevied and invalidate entire API cache when switching role

packages/client/src/api/api.js

@@ -34,7 +34,11 @@ export const API = createAPIClient({
   // Or we could check error.status and redirect to login on a 403 etc.
   onError: error => {
     const { status, method, url, message, handled } = error || {}
-    const ignoreErrorUrls = ["bbtel", "/api/global/self"]
+    const ignoreErrorUrls = [
+      "bbtel",
+      "/api/global/self",
+      "/api/tables/ta_users",
+    ]
 
     // Log any errors that we haven't manually handled
     if (!handled) {

packages/client/src/stores/devTools.js

@@ -3,6 +3,7 @@ import { createLocalStorageStore } from "@budibase/frontend-core"
 import { appStore } from "./app"
 import { initialise } from "./initialise"
 import { authStore } from "./auth"
+import { API } from "../api"
 
 const initialState = {
   enabled: false,
@@ -41,6 +42,7 @@ const createDevToolStore = () => {
       ...state,
       role: role === "self" ? null : role,
     }))
+    API.invalidateCache()
     await authStore.actions.fetchUser()
     await initialise()
   }

packages/frontend-core/src/api/index.js

@@ -57,6 +57,7 @@ export const createAPIClient = config => {
     ...defaultAPIClientConfig,
     ...config,
   }
+  let cache = {}
 
   // Generates an error object from an API response
   const makeErrorFromResponse = async (response, method) => {
@@ -139,6 +140,7 @@ export const createAPIClient = config => {
         credentials: "same-origin",
       })
     } catch (error) {
+      delete cache[url]
       throw makeError("Failed to send request", { url, method })
     }
 
@@ -151,9 +153,11 @@ export const createAPIClient = config => {
           return await response.json()
         }
       } catch (error) {
+        delete cache[url]
         return null
       }
     } else {
+      delete cache[url]
       throw await makeErrorFromResponse(response, method)
     }
   }
@@ -161,7 +165,6 @@ export const createAPIClient = config => {
   // Performs an API call to the server and caches the response.
   // Future invocation for this URL will return the cached result instead of
   // hitting the server again.
-  let cache = {}
   const makeCachedApiCall = async params => {
     const identifier = params.url
     if (!identifier) {
@@ -206,6 +209,9 @@ export const createAPIClient = config => {
     error: message => {
       throw makeError(message)
     },
+    invalidateCache: () => {
+      cache = {}
+    },
   }
 
   // Attach all endpoints