Fixing issues with auth not being able to find appId in pathname, using the currentapp cookie if pathname not populated.

packages/client/src/api/index.js

@@ -1,12 +1,12 @@
 import { authenticate } from "./authenticate"
-import { getAppIdFromPath } from "../render/getAppId"
+import { getAppId } from "../render/getAppId"
 
 const apiCall = method => async ({ url, body }) => {
   const response = await fetch(url, {
     method: method,
     headers: {
       "Content-Type": "application/json",
-      "x-budibase-app-id": getAppIdFromPath(),
+      "x-budibase-app-id": getAppId(window.document.cookie),
     },
     body: body && JSON.stringify(body),
     credentials: "same-origin",

packages/client/src/createApp.js

@@ -2,7 +2,7 @@ import { attachChildren } from "./render/attachChildren"
 import { createTreeNode } from "./render/prepareRenderComponent"
 import { screenRouter } from "./render/screenRouter"
 import { createStateManager } from "./state/stateManager"
-import { getAppIdFromPath } from "./render/getAppId"
+import { getAppId } from "./render/getAppId"
 
 export const createApp = ({
   componentLibraries,
@@ -38,7 +38,7 @@ export const createApp = ({
       window,
     })
     const fallbackPath = window.location.pathname.replace(
-      getAppIdFromPath(),
+      getAppId(window.document.cookie),
       ""
     )
     routeTo(currentUrl || fallbackPath)

packages/client/src/index.js

@@ -1,6 +1,6 @@
 import { createApp } from "./createApp"
 import { builtins, builtinLibName } from "./render/builtinComponents"
-import { getAppIdFromPath } from "./render/getAppId"
+import { getAppId } from "./render/getAppId"
 
 /**
  * create a web application from static budibase definition files.
@@ -9,7 +9,7 @@ import { getAppIdFromPath } from "./render/getAppId"
 export const loadBudibase = async opts => {
   const _window = (opts && opts.window) || window
   // const _localStorage = (opts && opts.localStorage) || localStorage
-  const appId = getAppIdFromPath()
+  const appId = getAppId(window.document.cookie)
   const frontendDefinition = _window["##BUDIBASE_FRONTEND_DEFINITION##"]
 
   const user = {}

packages/client/src/render/getAppId.js

@@ -1,4 +1,15 @@
-export const getAppIdFromPath = () => {
+const COOKIE_SEPARATOR = ";"
+const APP_PREFIX = "app_"
+const KEY_VALUE_SPLIT = "="
+
+export const getAppId = (allCookies) => {
+  const cookie = allCookies.split(COOKIE_SEPARATOR).find(cookie => cookie.trim().startsWith("budibase:currentapp"))
   let appId = location.pathname.split("/")[1]
-  return appId && appId.startsWith("app_") ? appId : undefined
+  appId = appId && appId.startsWith(APP_PREFIX) ? appId : undefined
+  if (!appId && cookie && cookie.split(KEY_VALUE_SPLIT).length === 2) {
+    appId = cookie.split("=")[1]
+  }
+  return appId
 }
+
+export const getAppIdFromPath = getAppId

packages/client/src/render/screenRouter.js

@@ -1,6 +1,6 @@
 import regexparam from "regexparam"
 import appStore from "../state/store"
-import { getAppIdFromPath } from "./getAppId"
+import { getAppId } from "./getAppId"
 
 export const screenRouter = ({ screens, onScreenSelected, window }) => {
   function sanitize(url) {
@@ -27,7 +27,7 @@ export const screenRouter = ({ screens, onScreenSelected, window }) => {
 
   const makeRootedPath = url => {
     if (isRunningLocally()) {
-      const appId = getAppIdFromPath()
+      const appId = getAppId(window.document.cookie)
       if (url) {
         url = sanitize(url)
         if (!url.startsWith("/")) {

packages/client/tests/screenRouting.spec.js

@@ -1,7 +1,7 @@
 import { load, makePage, makeScreen, walkComponentTree } from "./testAppDef"
 import { isScreenSlot } from "../src/render/builtinComponents"
 jest.mock("../src/render/getAppId", () => ({
-  getAppIdFromPath: () => "TEST_APP_ID"
+  getAppId: () => "TEST_APP_ID"
 }))
 
 describe("screenRouting", () => {

packages/server/src/api/controllers/component.js

@@ -6,15 +6,12 @@ const {
 } = require("../../utilities/budibaseDir")
 
 exports.fetchAppComponentDefinitions = async function(ctx) {
-  const db = new CouchDB(ctx.params.appId)
-  const app = await db.get(ctx.params.appId)
+  const appId = ctx.params.appId || ctx.appId
+  const db = new CouchDB(appId)
+  const app = await db.get(appId)
 
   ctx.body = app.componentLibraries.reduce((acc, componentLibrary) => {
-    let appDirectory = resolve(
-      budibaseAppsDir(),
-      ctx.params.appId,
-      "node_modules"
-    )
+    let appDirectory = resolve(budibaseAppsDir(), appId, "node_modules")
 
     if (ctx.isDev) {
       appDirectory = budibaseTempDir()

packages/server/src/api/controllers/static.js

@@ -197,10 +197,11 @@ exports.serveAppAsset = async function(ctx) {
 }
 
 exports.serveComponentLibrary = async function(ctx) {
+  const appId = ctx.query.appId || ctx.appId
   // default to homedir
   let componentLibraryPath = resolve(
     budibaseAppsDir(),
-    ctx.query.appId,
+    appId,
     "node_modules",
     decodeURI(ctx.query.library),
     "package",
@@ -222,7 +223,6 @@ exports.serveComponentLibrary = async function(ctx) {
     } else {
       componentLib += `-${COMP_LIB_BASE_APP_VERSION}`
     }
-    const appId = ctx.query.appId
     const S3_URL = encodeURI(
       `https://${appId}.app.budi.live/assets/${componentLib}/${ctx.query.library}/dist/index.js`
     )