From 79d482bfb14d1c53ecca0bed0b62ad65f3da88cd Mon Sep 17 00:00:00 2001
From: Martin McKeaveney <martin@budibase.com>
Date: Mon, 7 Dec 2020 10:15:27 +0000
Subject: [PATCH 01/39] replace appimage with native linux packages

---
 packages/server/package.json | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/server/package.json b/packages/server/package.json
index cb1789c5c9..3f6dba75e7 100644
--- a/packages/server/package.json
+++ b/packages/server/package.json
@@ -22,8 +22,10 @@
       "maintainer": "Budibase",
       "icon": "./build/icons/",
       "target": [
-        "AppImage",
-        "deb"
+        "deb",
+        "rpm",
+        "pacman",
+        "snap"
       ],
       "category": "Development"
     },

From b5637dbffc91de3b35d0929e9bfd946e7e9626dc Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 14:14:10 +0000
Subject: [PATCH 02/39] Fix crash when adding a link

---
 packages/standard-components/src/Link.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/standard-components/src/Link.svelte b/packages/standard-components/src/Link.svelte
index 705d5051c4..5ae1ae75c4 100644
--- a/packages/standard-components/src/Link.svelte
+++ b/packages/standard-components/src/Link.svelte
@@ -11,7 +11,7 @@
   $: target = openInNewTab ? "_blank" : "_self"
 </script>
 
-<a href={url} use:linkable {target} use:styleable={$component.styles}>
+<a href={url || '/'} use:linkable {target} use:styleable={$component.styles}>
   {text}
   <slot />
 </a>

From 31f0b51039520f06282084752670e924331c17e1 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 14:51:42 +0000
Subject: [PATCH 03/39] Fix bugs around selecting screens and layouts when
 creating them

---
 .../src/builderStore/store/frontend.js        | 37 +++++++++----------
 1 file changed, 17 insertions(+), 20 deletions(-)

diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js
index 87a46e4a91..f70e5f4d47 100644
--- a/packages/builder/src/builderStore/store/frontend.js
+++ b/packages/builder/src/builderStore/store/frontend.js
@@ -120,17 +120,13 @@ export const getFrontendStore = () => {
             state.screens.splice(foundScreen, 1)
           }
           state.screens.push(screen)
-
-          if (creatingNewScreen) {
-            const safeProps = makePropsSafe(
-              state.components[screen.props._component],
-              screen.props
-            )
-            state.selectedComponentId = safeProps._id
-            screen.props = safeProps
-          }
           return state
         })
+
+        if (creatingNewScreen) {
+          store.actions.screens.select(screen._id)
+        }
+
         return screen
       },
       delete: async screens => {
@@ -178,28 +174,30 @@ export const getFrontendStore = () => {
       },
       save: async layout => {
         const layoutToSave = cloneDeep(layout)
-
+        const creatingNewLayout = layoutToSave._id === undefined
         const response = await api.post(`/api/layouts`, layoutToSave)
-
-        const json = await response.json()
+        const savedLayout = await response.json()
 
         store.update(state => {
           const layoutIdx = state.layouts.findIndex(
-            stateLayout => stateLayout._id === json._id
+            stateLayout => stateLayout._id === savedLayout._id
           )
-
           if (layoutIdx >= 0) {
             // update existing layout
-            state.layouts.splice(layoutIdx, 1, json)
+            state.layouts.splice(layoutIdx, 1, savedLayout)
           } else {
             // save new layout
-            state.layouts.push(json)
+            state.layouts.push(savedLayout)
           }
-
-          state.currentAssetId = json._id
-          state.selectedComponentId = json.props._id
           return state
         })
+
+        // Select layout if creating a new one
+        if (creatingNewLayout) {
+          store.actions.layouts.select(savedLayout._id)
+        }
+
+        return savedLayout
       },
       find: layoutId => {
         if (!layoutId) {
@@ -450,7 +448,6 @@ export const getFrontendStore = () => {
 
               // Save layout
               nav._children = [...nav._children, newLink]
-              state.currentAssetId = layout._id
               promises.push(store.actions.layouts.save(layout))
             }
             return state

From 112fce654c497a9d2dbf845691111227b23b4f5f Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 14:53:03 +0000
Subject: [PATCH 04/39] Navigate to new layout after creating it

---
 .../src/components/userInterface/NewLayoutModal.svelte | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/packages/builder/src/components/userInterface/NewLayoutModal.svelte b/packages/builder/src/components/userInterface/NewLayoutModal.svelte
index e1cdc4af29..dbc9e3dc7a 100644
--- a/packages/builder/src/components/userInterface/NewLayoutModal.svelte
+++ b/packages/builder/src/components/userInterface/NewLayoutModal.svelte
@@ -1,19 +1,15 @@
 <script>
   import { goto } from "@sveltech/routify"
-  import api from "builderStore/api"
   import { notifier } from "builderStore/store/notifications"
-  import { store, backendUiStore, allScreens } from "builderStore"
+  import { store } from "builderStore"
   import { Input, ModalContent } from "@budibase/bbui"
-  import analytics from "analytics"
-
-  const CONTAINER = "@budibase/standard-components/container"
 
   let name = ""
 
   async function save() {
     try {
-      await store.actions.layouts.save({ name })
-      $goto(`./${$store.currentAssetId}`)
+      const layout = store.actions.layouts.save({ name })
+      $goto(`./${layout._id}`)
       notifier.success(`Layout ${name} created successfully`)
     } catch (err) {
       notifier.danger(`Error creating layout ${name}.`)

From 5882f76c9a78de95a9cf956b8d8898b2592ea3bb Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 14:53:17 +0000
Subject: [PATCH 05/39] Allow role selection when creating new screen

---
 .../userInterface/NewScreenModal.svelte       | 39 ++++++++++---------
 1 file changed, 21 insertions(+), 18 deletions(-)

diff --git a/packages/builder/src/components/userInterface/NewScreenModal.svelte b/packages/builder/src/components/userInterface/NewScreenModal.svelte
index 05a18adb7f..4a5186adc0 100644
--- a/packages/builder/src/components/userInterface/NewScreenModal.svelte
+++ b/packages/builder/src/components/userInterface/NewScreenModal.svelte
@@ -1,17 +1,11 @@
 <script>
   import { goto } from "@sveltech/routify"
   import { store, backendUiStore, allScreens } from "builderStore"
-  import {
-    Input,
-    Button,
-    Spacer,
-    Select,
-    ModalContent,
-    Toggle,
-  } from "@budibase/bbui"
+  import { Input, Select, ModalContent, Toggle } from "@budibase/bbui"
   import getTemplates from "builderStore/store/screenTemplates"
-  import { some } from "lodash/fp"
   import analytics from "analytics"
+  import { onMount } from "svelte"
+  import api from "builderStore/api"
 
   const CONTAINER = "@budibase/standard-components/container"
 
@@ -21,15 +15,14 @@
   let templateIndex
   let draftScreen
   let createLink = true
+  let roles = []
+  let roleId = "BASIC"
 
   $: templates = getTemplates($store, $backendUiStore.tables)
-
   $: route = !route && $allScreens.length === 0 ? "*" : route
-
   $: baseComponents = Object.values($store.components)
     .filter(componentDefinition => componentDefinition.baseComponent)
     .map(c => c._component)
-
   $: {
     if (templates && templateIndex === undefined) {
       templateIndex = 0
@@ -37,6 +30,11 @@
     }
   }
 
+  const fetchRoles = async () => {
+    const response = await api.get("/api/roles")
+    roles = await response.json()
+  }
+
   const templateChanged = newTemplateIndex => {
     if (newTemplateIndex === undefined) return
     const template = templates[newTemplateIndex]
@@ -69,8 +67,7 @@
 
     draftScreen.props._instanceName = name
     draftScreen.props._component = baseComponent
-    // TODO: need to fix this up correctly
-    draftScreen.routing = { route, roleId: "ADMIN" }
+    draftScreen.routing = { route, roleId }
 
     const createdScreen = await store.actions.screens.create(draftScreen)
     if (createLink) {
@@ -85,7 +82,7 @@
       })
     }
 
-    $goto(`./screen/${createdScreen._id}`)
+    $goto(`./${createdScreen._id}`)
   }
 
   const routeNameExists = route => {
@@ -99,6 +96,8 @@
       route = "/" + event.target.value
     }
   }
+
+  onMount(fetchRoles)
 </script>
 
 <ModalContent title="New Screen" confirmText="Create Screen" onConfirm={save}>
@@ -113,14 +112,18 @@
       {/each}
     {/if}
   </Select>
-
   <Input label="Name" bind:value={name} />
-
   <Input
     label="Url"
     error={routeError}
     bind:value={route}
     on:change={routeChanged} />
-
+  {#if roles.length}
+    <Select label="Access" bind:value={roleId} secondary>
+      {#each roles as role}
+        <option value={role._id}>{role.name}</option>
+      {/each}
+    </Select>
+  {/if}
   <Toggle text="Create link in navigation bar" bind:checked={createLink} />
 </ModalContent>

From 4dd0d5b01690a15b03f0c533cbfe0a6d0c3e74b8 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 15:35:57 +0000
Subject: [PATCH 06/39] Cache roles in store and add role selector for screens

---
 .../builder/src/builderStore/store/backend.js | 21 ++++++++++
 .../backend/DataTable/cells/RoleCell.svelte   | 40 ++-----------------
 .../DataTable/modals/CreateEditUser.svelte    | 36 +++++------------
 .../backend/DataTable/modals/EditRoles.svelte | 26 +++++-------
 .../userInterface/NewScreenModal.svelte       | 20 +++-------
 .../userInterface/RoleSelect.svelte           | 15 +++++++
 .../userInterface/SettingsView.svelte         |  3 +-
 .../src/pages/[application]/_reset.svelte     |  1 +
 8 files changed, 70 insertions(+), 92 deletions(-)
 create mode 100644 packages/builder/src/components/userInterface/RoleSelect.svelte

diff --git a/packages/builder/src/builderStore/store/backend.js b/packages/builder/src/builderStore/store/backend.js
index 3cdabf1ed5..5592488590 100644
--- a/packages/builder/src/builderStore/store/backend.js
+++ b/packages/builder/src/builderStore/store/backend.js
@@ -6,6 +6,7 @@ const INITIAL_BACKEND_UI_STATE = {
   tables: [],
   views: [],
   users: [],
+  roles: [],
   selectedDatabase: {},
   selectedTable: {},
   draftTable: {},
@@ -177,6 +178,26 @@ export const getBackendUiStore = () => {
           return state
         }),
     },
+    roles: {
+      fetch: async () => {
+        const response = await api.get("/api/roles")
+        const roles = await response.json()
+        store.update(state => {
+          state.roles = roles
+          return state
+        })
+      },
+      delete: async role => {
+        const response = await api.delete(`/api/roles/${role._id}/${role._rev}`)
+        await store.actions.roles.fetch()
+        return response
+      },
+      save: async role => {
+        const response = await api.post("/api/roles", role)
+        await store.actions.roles.fetch()
+        return response
+      },
+    },
   }
 
   return store
diff --git a/packages/builder/src/components/backend/DataTable/cells/RoleCell.svelte b/packages/builder/src/components/backend/DataTable/cells/RoleCell.svelte
index c6f6cbbcdf..a45f376a3e 100644
--- a/packages/builder/src/components/backend/DataTable/cells/RoleCell.svelte
+++ b/packages/builder/src/components/backend/DataTable/cells/RoleCell.svelte
@@ -1,42 +1,10 @@
-<!-- Module scoped cache of saved role options -->
-<script context="module">
-  import builderApi from "builderStore/api"
-
-  let cachedRoles
-
-  async function getRoles(force = false) {
-    if (cachedRoles && !force) {
-      return await cachedRoles
-    }
-    cachedRoles = new Promise(resolve => {
-      builderApi
-        .get("/api/roles")
-        .then(response => response.json())
-        .then(resolve)
-    })
-    return await cachedRoles
-  }
-</script>
-
 <script>
+  import { backendUiStore } from "builderStore"
+
   export let roleId
 
-  let roleName
-  $: getRole()
-
-  async function getRole() {
-    // Try to find a matching role
-    let roles = await getRoles()
-    let role = roles.find(role => role._id === roleId)
-
-    // If we didn't find a matching role, try updating the cached results
-    if (!role) {
-      let roles = await getRoles(true)
-      let role = roles.find(role => role._id === roleId)
-    }
-    role = roles.find(role => role._id === roleId)
-    roleName = role?.name ?? "Unknown role"
-  }
+  $: role = $backendUiStore.roles.find(role => role._id === roleId)
+  $: roleName = role?.name ?? "Unknown role"
 </script>
 
 <div>{roleName}</div>
diff --git a/packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte b/packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte
index bde6514f8f..aac515e74b 100644
--- a/packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte
+++ b/packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte
@@ -1,18 +1,14 @@
 <script>
-  import { onMount } from "svelte"
   import { backendUiStore } from "builderStore"
   import { notifier } from "builderStore/store/notifications"
   import RowFieldControl from "../RowFieldControl.svelte"
   import * as backendApi from "../api"
-  import builderApi from "builderStore/api"
   import { ModalContent, Select } from "@budibase/bbui"
   import ErrorsBox from "components/common/ErrorsBox.svelte"
 
   export let row = {}
 
   let errors = []
-  let roles = []
-  let rolesLoaded = false
 
   $: creating = row?._id == null
   $: table = row.tableId
@@ -56,14 +52,6 @@
     notifier.success("User saved successfully.")
     backendUiStore.actions.rows.save(rowResponse)
   }
-
-  const fetchRoles = async () => {
-    const rolesResponse = await builderApi.get("/api/roles")
-    roles = await rolesResponse.json()
-    rolesLoaded = true
-  }
-
-  onMount(fetchRoles)
 </script>
 
 <ModalContent
@@ -80,19 +68,17 @@
     bind:value={row.password} />
   <!-- Defer rendering this select until roles load, otherwise the initial
        selection is always undefined -->
-  {#if rolesLoaded}
-    <Select
-      thin
-      secondary
-      label="Role"
-      data-cy="roleId-select"
-      bind:value={row.roleId}>
-      <option value="">Choose an option</option>
-      {#each roles as role}
-        <option value={role._id}>{role.name}</option>
-      {/each}
-    </Select>
-  {/if}
+  <Select
+    thin
+    secondary
+    label="Role"
+    data-cy="roleId-select"
+    bind:value={row.roleId}>
+    <option value="">Choose an option</option>
+    {#each $backendUiStore.roles as role}
+      <option value={role._id}>{role.name}</option>
+    {/each}
+  </Select>
   {#each customSchemaKeys as [key, meta]}
     <RowFieldControl {meta} bind:value={row[key]} {creating} />
   {/each}
diff --git a/packages/builder/src/components/backend/DataTable/modals/EditRoles.svelte b/packages/builder/src/components/backend/DataTable/modals/EditRoles.svelte
index 627112d87c..3b97f6d61b 100644
--- a/packages/builder/src/components/backend/DataTable/modals/EditRoles.svelte
+++ b/packages/builder/src/components/backend/DataTable/modals/EditRoles.svelte
@@ -4,27 +4,26 @@
   import api from "builderStore/api"
   import { notifier } from "builderStore/store/notifications"
   import ErrorsBox from "components/common/ErrorsBox.svelte"
+  import { backendUiStore } from "builderStore"
 
-  let roles = []
   let permissions = []
   let selectedRole = {}
   let errors = []
   $: selectedRoleId = selectedRole._id
-  $: otherRoles = roles.filter(role => role._id !== selectedRoleId)
+  $: otherRoles = $backendUiStore.roles.filter(
+    role => role._id !== selectedRoleId
+  )
   $: isCreating = selectedRoleId == null || selectedRoleId === ""
 
-  // Loads available roles and permissions from the server
-  const fetchRoles = async () => {
-    const rolesResponse = await api.get("/api/roles")
-    roles = await rolesResponse.json()
+  const fetchPermissions = async () => {
     const permissionsResponse = await api.get("/api/permissions")
     permissions = await permissionsResponse.json()
   }
 
-  // Changes the seleced role
+  // Changes the selected role
   const changeRole = event => {
     const id = event?.target?.value
-    const role = roles.find(role => role._id === id)
+    const role = $backendUiStore.roles.find(role => role._id === id)
     if (role) {
       selectedRole = {
         ...role,
@@ -61,7 +60,7 @@
     }
 
     // Save/create the role
-    const response = await api.post("/api/roles", selectedRole)
+    const response = await backendUiStore.actions.roles.save(selectedRole)
     if (response.status === 200) {
       notifier.success("Role saved successfully.")
     } else {
@@ -72,11 +71,8 @@
 
   // Deletes the selected role
   const deleteRole = async () => {
-    const response = await api.delete(
-      `/api/roles/${selectedRole._id}/${selectedRole._rev}`
-    )
+    const response = await backendUiStore.actions.roles.delete(selectedRole)
     if (response.status === 200) {
-      await fetchRoles()
       changeRole()
       notifier.success("Role deleted successfully.")
     } else {
@@ -84,7 +80,7 @@
     }
   }
 
-  onMount(fetchRoles)
+  onMount(fetchPermissions)
 </script>
 
 <ModalContent
@@ -101,7 +97,7 @@
     value={selectedRoleId}
     on:change={changeRole}>
     <option value="">Create new role</option>
-    {#each roles as role}
+    {#each $backendUiStore.roles as role}
       <option value={role._id}>{role.name}</option>
     {/each}
   </Select>
diff --git a/packages/builder/src/components/userInterface/NewScreenModal.svelte b/packages/builder/src/components/userInterface/NewScreenModal.svelte
index 4a5186adc0..8d7271601a 100644
--- a/packages/builder/src/components/userInterface/NewScreenModal.svelte
+++ b/packages/builder/src/components/userInterface/NewScreenModal.svelte
@@ -15,7 +15,6 @@
   let templateIndex
   let draftScreen
   let createLink = true
-  let roles = []
   let roleId = "BASIC"
 
   $: templates = getTemplates($store, $backendUiStore.tables)
@@ -30,11 +29,6 @@
     }
   }
 
-  const fetchRoles = async () => {
-    const response = await api.get("/api/roles")
-    roles = await response.json()
-  }
-
   const templateChanged = newTemplateIndex => {
     if (newTemplateIndex === undefined) return
     const template = templates[newTemplateIndex]
@@ -96,8 +90,6 @@
       route = "/" + event.target.value
     }
   }
-
-  onMount(fetchRoles)
 </script>
 
 <ModalContent title="New Screen" confirmText="Create Screen" onConfirm={save}>
@@ -118,12 +110,10 @@
     error={routeError}
     bind:value={route}
     on:change={routeChanged} />
-  {#if roles.length}
-    <Select label="Access" bind:value={roleId} secondary>
-      {#each roles as role}
-        <option value={role._id}>{role.name}</option>
-      {/each}
-    </Select>
-  {/if}
+  <Select label="Access" bind:value={roleId} secondary>
+    {#each $backendUiStore as role}
+      <option value={role._id}>{role.name}</option>
+    {/each}
+  </Select>
   <Toggle text="Create link in navigation bar" bind:checked={createLink} />
 </ModalContent>
diff --git a/packages/builder/src/components/userInterface/RoleSelect.svelte b/packages/builder/src/components/userInterface/RoleSelect.svelte
new file mode 100644
index 0000000000..e49222d2c0
--- /dev/null
+++ b/packages/builder/src/components/userInterface/RoleSelect.svelte
@@ -0,0 +1,15 @@
+<script>
+  import { Select } from "@budibase/bbui"
+  import { backendUiStore } from "builderStore"
+
+  export let value
+
+  let roles = []
+</script>
+
+<Select bind:value extraThin secondary on:change>
+  <option value="">Choose an option</option>
+  {#each $backendUiStore.roles as role}
+    <option value={role._id}>{role.name}</option>
+  {/each}
+</Select>
diff --git a/packages/builder/src/components/userInterface/SettingsView.svelte b/packages/builder/src/components/userInterface/SettingsView.svelte
index f90e071b08..eee50d8cf6 100644
--- a/packages/builder/src/components/userInterface/SettingsView.svelte
+++ b/packages/builder/src/components/userInterface/SettingsView.svelte
@@ -4,6 +4,7 @@
   import { FrontendTypes } from "constants"
   import PropertyControl from "./PropertyControl.svelte"
   import LayoutSelect from "./LayoutSelect.svelte"
+  import RoleSelect from "./RoleSelect.svelte"
   import Input from "./PropertyPanelControls/Input.svelte"
   import { excludeProps } from "./propertyCategories.js"
   import { store, allScreens, currentAsset } from "builderStore"
@@ -36,8 +37,8 @@
   const screenDefinition = [
     { key: "description", label: "Description", control: Input },
     { key: "routing.route", label: "Route", control: Input },
+    { key: "routing.roleId", label: "Access", control: RoleSelect },
     { key: "layoutId", label: "Layout", control: LayoutSelect },
-    { key: "routing.roleId", label: "Role", control: Input },
   ]
 
   const layoutDefinition = [{ key: "title", label: "Title", control: Input }]
diff --git a/packages/builder/src/pages/[application]/_reset.svelte b/packages/builder/src/pages/[application]/_reset.svelte
index a6f7e86454..e1daf7da1d 100644
--- a/packages/builder/src/pages/[application]/_reset.svelte
+++ b/packages/builder/src/pages/[application]/_reset.svelte
@@ -20,6 +20,7 @@
       backendUiStore.actions.reset()
       await store.actions.initialise(pkg)
       await automationStore.actions.fetch()
+      await backendUiStore.actions.roles.fetch()
       return pkg
     } else {
       throw new Error(pkg)

From fdfe16a649edf50cbb3ad79bf2c7717e2276a197 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 15:42:44 +0000
Subject: [PATCH 07/39] Fix z index in beta warning

---
 packages/builder/src/pages/[application]/_reset.svelte | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/builder/src/pages/[application]/_reset.svelte b/packages/builder/src/pages/[application]/_reset.svelte
index e1daf7da1d..74367c794d 100644
--- a/packages/builder/src/pages/[application]/_reset.svelte
+++ b/packages/builder/src/pages/[application]/_reset.svelte
@@ -218,5 +218,6 @@
     position: absolute;
     bottom: var(--spacing-m);
     left: var(--spacing-m);
+    z-index: 1;
   }
 </style>

From 5f37cabd24a9a94e69254f71a03a1a5ff12895e1 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 15:43:06 +0000
Subject: [PATCH 08/39] Force white background behind prevrew iframe regardless
 of theme to better reflect what the real app will look like

---
 .../userInterface/AppPreview/CurrentItemPreview.svelte           | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte b/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte
index ccb0153e45..0c0fa6156f 100644
--- a/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte
+++ b/packages/builder/src/components/userInterface/AppPreview/CurrentItemPreview.svelte
@@ -84,6 +84,7 @@
     overflow: hidden;
     margin: auto;
     height: 100%;
+    background-color: white;
   }
   .component-container iframe {
     border: 0;

From 52dd9760c50a68c45fa07f6735cd8ba04d1675eb Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 15:58:34 +0000
Subject: [PATCH 09/39] Fix merge bug

---
 packages/builder/src/builderStore/store/frontend.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js
index e857689eba..c4d9ed6503 100644
--- a/packages/builder/src/builderStore/store/frontend.js
+++ b/packages/builder/src/builderStore/store/frontend.js
@@ -88,7 +88,7 @@ export const getFrontendStore = () => {
           const screen = get(allScreens).find(screen => screen._id === screenId)
           if (!screen) return state
           state.currentFrontEndType = FrontendTypes.SCREEN
-          state.currentAssetId = selectedScreen._id
+          state.currentAssetId = screen._id
           state.currentView = "detail"
           state.selectedComponentId = screen.props?._id
           return state

From ce917b5005f5c7108a123ce5949f69dc42d541d7 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 16:01:16 +0000
Subject: [PATCH 10/39] Fix empty screen list when deleting a table backing an
 autoscreen which is currently selected

---
 packages/builder/src/builderStore/store/frontend.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js
index c4d9ed6503..a853a98dce 100644
--- a/packages/builder/src/builderStore/store/frontend.js
+++ b/packages/builder/src/builderStore/store/frontend.js
@@ -85,7 +85,9 @@ export const getFrontendStore = () => {
     screens: {
       select: screenId => {
         store.update(state => {
-          const screen = get(allScreens).find(screen => screen._id === screenId)
+          let screens = get(allScreens)
+          let screen =
+            screens.find(screen => screen._id === screenId) || screens[0]
           if (!screen) return state
           state.currentFrontEndType = FrontendTypes.SCREEN
           state.currentAssetId = screen._id

From bd488463cb48edda7e126e76be9fab6f3f1db15c Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 18:18:47 +0000
Subject: [PATCH 11/39] Add role selection for viewing screens and smart
 handling of preview screen

---
 packages/builder/src/builderStore/index.js    |  4 +-
 .../src/builderStore/store/frontend.js        |  1 +
 .../ComponentNavigationTree/PathTree.svelte   |  2 +
 .../ComponentNavigationTree/index.svelte      | 65 +++++++++++++++++--
 .../userInterface/FrontendNavigatePane.svelte | 30 +++++++--
 .../components/userInterface/Layout.svelte    |  3 +-
 .../userInterface/NewScreenModal.svelte       |  2 +-
 7 files changed, 96 insertions(+), 11 deletions(-)

diff --git a/packages/builder/src/builderStore/index.js b/packages/builder/src/builderStore/index.js
index 887ef733e4..f1914efab2 100644
--- a/packages/builder/src/builderStore/index.js
+++ b/packages/builder/src/builderStore/index.js
@@ -2,7 +2,7 @@ import { getFrontendStore } from "./store/frontend"
 import { getBackendUiStore } from "./store/backend"
 import { getAutomationStore } from "./store/automation/"
 import { getThemeStore } from "./store/theme"
-import { derived } from "svelte/store"
+import { derived, writable } from "svelte/store"
 import analytics from "analytics"
 import { LAYOUT_NAMES } from "../constants"
 import { makePropsSafe } from "components/userInterface/assetParsing/createProps"
@@ -74,6 +74,8 @@ export const mainLayout = derived(store, $store => {
   )
 })
 
+export const selectedAccessRole = writable("BASIC")
+
 export const initialise = async () => {
   try {
     await analytics.activate()
diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js
index a853a98dce..754cd6e127 100644
--- a/packages/builder/src/builderStore/store/frontend.js
+++ b/packages/builder/src/builderStore/store/frontend.js
@@ -110,6 +110,7 @@ export const getFrontendStore = () => {
         const creatingNewScreen = screen._id === undefined
         const response = await api.post(`/api/screens`, screen)
         screen = await response.json()
+        await store.actions.routing.fetch()
 
         store.update(state => {
           const foundScreen = state.screens.findIndex(
diff --git a/packages/builder/src/components/userInterface/ComponentNavigationTree/PathTree.svelte b/packages/builder/src/components/userInterface/ComponentNavigationTree/PathTree.svelte
index 765041b184..5dd4ed9a7c 100644
--- a/packages/builder/src/components/userInterface/ComponentNavigationTree/PathTree.svelte
+++ b/packages/builder/src/components/userInterface/ComponentNavigationTree/PathTree.svelte
@@ -20,6 +20,7 @@
   export let route
   export let path
   export let indent
+  export let border
 
   $: selectedScreen = $currentAsset
 
@@ -34,6 +35,7 @@
   icon="ri-folder-line"
   text={path}
   opened={true}
+  {border}
   withArrow={route.subpaths} />
 
 {#each Object.entries(route.subpaths) as [url, subpath]}
diff --git a/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte b/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte
index 9528b2844c..a88c6feb34 100644
--- a/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte
+++ b/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte
@@ -1,12 +1,69 @@
 <script>
-  import { store } from "builderStore"
+  import { store, selectedAccessRole } from "builderStore"
   import PathTree from "./PathTree.svelte"
 
-  $: paths = Object.keys($store.routes || {}).sort()
+  let routes = {}
+  $: paths = Object.keys(routes || {}).sort()
+
+  $: {
+    const allRoutes = $store.routes
+    const sortedPaths = Object.keys(allRoutes).sort()
+    const selectedRoleId = $selectedAccessRole
+    const selectedScreenId = $store.currentAssetId
+
+    let found = false
+    let firstValidScreenId
+    let filteredRoutes = {}
+
+    // Filter all routes down to only those which match the current role
+    sortedPaths.forEach(path => {
+      const config = allRoutes[path]
+      Object.entries(config.subpaths).forEach(([subpath, pathConfig]) => {
+        Object.entries(pathConfig.screens).forEach(([roleId, screenId]) => {
+          if (roleId === selectedRoleId) {
+            if (screenId === selectedScreenId) {
+              found = roleId === selectedRoleId
+            }
+            if (!firstValidScreenId) {
+              firstValidScreenId = screenId
+            }
+            if (!filteredRoutes[path]) {
+              filteredRoutes[path] = { subpaths: {} }
+            }
+            filteredRoutes[path].subpaths[subpath] = {
+              screens: {
+                [selectedRoleId]: screenId,
+              },
+            }
+          }
+        })
+      })
+    })
+    routes = filteredRoutes
+
+    // If the selected screen isn't in this filtered list, select the first one
+    if (!found && firstValidScreenId) {
+      store.actions.screens.select(firstValidScreenId)
+    }
+  }
 </script>
 
 <div class="root">
-  {#each paths as path}
-    <PathTree {path} route={$store.routes[path]} />
+  {#each paths as path, idx}
+    <PathTree border={idx > 0} {path} route={routes[path]} />
   {/each}
+
+  {#if !paths.length}
+    <div class="empty">
+      There aren't any screens configured with this access role.
+    </div>
+  {/if}
 </div>
+
+<style>
+  div.empty {
+    font-size: var(--font-size-xs);
+    color: var(--grey-5);
+    padding-top: var(--spacing-xs);
+  }
+</style>
diff --git a/packages/builder/src/components/userInterface/FrontendNavigatePane.svelte b/packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
index 23d2e6cf1a..25f939d2f1 100644
--- a/packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
+++ b/packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
@@ -1,13 +1,18 @@
 <script>
   import { onMount } from "svelte"
   import { goto, params, url } from "@sveltech/routify"
-  import { store, currentAsset, selectedComponent } from "builderStore"
+  import {
+    store,
+    currentAsset,
+    backendUiStore,
+    selectedAccessRole,
+  } from "builderStore"
   import { FrontendTypes } from "constants"
   import ComponentNavigationTree from "components/userInterface/ComponentNavigationTree/index.svelte"
   import Layout from "components/userInterface/Layout.svelte"
   import NewScreenModal from "components/userInterface/NewScreenModal.svelte"
   import NewLayoutModal from "components/userInterface/NewLayoutModal.svelte"
-  import { Modal, Switcher } from "@budibase/bbui"
+  import { Modal, Switcher, Select } from "@budibase/bbui"
 
   const tabs = [
     {
@@ -41,6 +46,19 @@
         on:click={modal.show}
         data-cy="new-screen"
         class="ri-add-circle-fill" />
+
+      <div class="role-select">
+        <Select
+          extraThin
+          secondary
+          bind:value={$selectedAccessRole}
+          label="Filter by Access">
+          {#each $backendUiStore.roles as role}
+            <option value={role._id}>{role.name}</option>
+          {/each}
+        </Select>
+      </div>
+
       {#if $currentAsset}
         <div class="nav-items-container">
           <ComponentNavigationTree />
@@ -54,8 +72,8 @@
         on:click={modal.show}
         data-cy="new-layout"
         class="ri-add-circle-fill" />
-      {#each $store.layouts as layout (layout._id)}
-        <Layout {layout} />
+      {#each $store.layouts as layout, idx (layout._id)}
+        <Layout {layout} border={idx > 0} />
       {/each}
       <Modal bind:this={modal}>
         <NewLayoutModal />
@@ -82,4 +100,8 @@
     cursor: pointer;
     color: var(--blue);
   }
+
+  .role-select {
+    margin-bottom: var(--spacing-m);
+  }
 </style>
diff --git a/packages/builder/src/components/userInterface/Layout.svelte b/packages/builder/src/components/userInterface/Layout.svelte
index d6d25b57a0..37593dedf7 100644
--- a/packages/builder/src/components/userInterface/Layout.svelte
+++ b/packages/builder/src/components/userInterface/Layout.svelte
@@ -10,6 +10,7 @@
   import { writable } from "svelte/store"
 
   export let layout
+  export let border
 
   let confirmDeleteDialog
   let componentToDelete = ""
@@ -23,7 +24,7 @@
 </script>
 
 <NavItem
-  border={false}
+  {border}
   icon="ri-layout-3-line"
   text={layout.name}
   withArrow
diff --git a/packages/builder/src/components/userInterface/NewScreenModal.svelte b/packages/builder/src/components/userInterface/NewScreenModal.svelte
index 8d7271601a..d7e65a84b2 100644
--- a/packages/builder/src/components/userInterface/NewScreenModal.svelte
+++ b/packages/builder/src/components/userInterface/NewScreenModal.svelte
@@ -111,7 +111,7 @@
     bind:value={route}
     on:change={routeChanged} />
   <Select label="Access" bind:value={roleId} secondary>
-    {#each $backendUiStore as role}
+    {#each $backendUiStore.roles as role}
       <option value={role._id}>{role.name}</option>
     {/each}
   </Select>

From 3abacb3b65b8ab59177f0a419c6bf19f216058c0 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 18:39:49 +0000
Subject: [PATCH 12/39] Allow multiple screens to have the same URL as long as
 role is different

---
 .../components/userInterface/NewScreenModal.svelte   | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/packages/builder/src/components/userInterface/NewScreenModal.svelte b/packages/builder/src/components/userInterface/NewScreenModal.svelte
index d7e65a84b2..db9181b1bd 100644
--- a/packages/builder/src/components/userInterface/NewScreenModal.svelte
+++ b/packages/builder/src/components/userInterface/NewScreenModal.svelte
@@ -48,10 +48,10 @@
 
   const save = async () => {
     if (!route) {
-      routeError = "Url is required"
+      routeError = "URL is required"
     } else {
-      if (routeNameExists(route)) {
-        routeError = "This url is already taken"
+      if (routeExists(route, roleId)) {
+        routeError = "This URL is already taken for this access role"
       } else {
         routeError = ""
       }
@@ -79,9 +79,11 @@
     $goto(`./${createdScreen._id}`)
   }
 
-  const routeNameExists = route => {
+  const routeExists = (route, roleId) => {
     return $allScreens.some(
-      screen => screen.routing.route.toLowerCase() === route.toLowerCase()
+      screen =>
+        screen.routing.route.toLowerCase() === route.toLowerCase() &&
+        screen.routing.roleId === roleId
     )
   }
 

From c8d7ef40ca4d88d95632edf655a2ea71af032361 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 18:41:18 +0000
Subject: [PATCH 13/39] Reduce nav item selected state border radius slightly

---
 packages/builder/src/components/common/NavItem.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/builder/src/components/common/NavItem.svelte b/packages/builder/src/components/common/NavItem.svelte
index 5b1ede4394..8eca07b1b0 100644
--- a/packages/builder/src/components/common/NavItem.svelte
+++ b/packages/builder/src/components/common/NavItem.svelte
@@ -61,7 +61,7 @@
   }
   .nav-item:hover,
   .nav-item.selected {
-    border-radius: var(--border-radius-m);
+    border-radius: var(--border-radius-s);
   }
 
   .content {

From db40514eb14a655e6abec234f3c0c45c62b5b2e3 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 18:56:54 +0000
Subject: [PATCH 14/39] Lint

---
 packages/builder/src/builderStore/store/frontend.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js
index 754cd6e127..280af804cb 100644
--- a/packages/builder/src/builderStore/store/frontend.js
+++ b/packages/builder/src/builderStore/store/frontend.js
@@ -3,7 +3,6 @@ import { cloneDeep } from "lodash/fp"
 import {
   createProps,
   getBuiltin,
-  makePropsSafe,
 } from "components/userInterface/assetParsing/createProps"
 import {
   allScreens,

From ef9415ae3b17f820bcb97dc7199d739f0603d2af Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 9 Dec 2020 19:04:46 +0000
Subject: [PATCH 15/39] Select new role when creating screen with a different
 role than the selected one

---
 packages/builder/src/builderStore/store/frontend.js | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js
index 280af804cb..dc6706373a 100644
--- a/packages/builder/src/builderStore/store/frontend.js
+++ b/packages/builder/src/builderStore/store/frontend.js
@@ -10,6 +10,7 @@ import {
   currentAsset,
   mainLayout,
   selectedComponent,
+  selectedAccessRole,
 } from "builderStore"
 import { fetchComponentLibDefinitions } from "../loadComponentLibraries"
 import api from "../api"
@@ -88,6 +89,11 @@ export const getFrontendStore = () => {
           let screen =
             screens.find(screen => screen._id === screenId) || screens[0]
           if (!screen) return state
+
+          // Update role to the screen's role setting so that it will always
+          // be visible
+          selectedAccessRole.set(screen.routing.roleId)
+
           state.currentFrontEndType = FrontendTypes.SCREEN
           state.currentAssetId = screen._id
           state.currentView = "detail"

From 1f203ae58617e29c1c650fefbc9f5fcc2c680b23 Mon Sep 17 00:00:00 2001
From: Joe <49767913+joebudi@users.noreply.github.com>
Date: Thu, 10 Dec 2020 11:11:53 +0000
Subject: [PATCH 16/39] Text changed

Changing 'Invalid chart options' to 'Use the settings panel to build your chart'. I feel this is more appropriate.
---
 packages/standard-components/src/Card.svelte       | 12 ++++++++++--
 .../standard-components/src/CardHorizontal.svelte  | 14 +++++++++++---
 .../src/charts/ApexChart.svelte                    |  4 +++-
 3 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/packages/standard-components/src/Card.svelte b/packages/standard-components/src/Card.svelte
index e8248b7a01..74121590e3 100644
--- a/packages/standard-components/src/Card.svelte
+++ b/packages/standard-components/src/Card.svelte
@@ -29,11 +29,19 @@
   class="container"
   use:styleable={$component.styles}
   style="--cardWidth: {cardWidth}">
-  {#if showImage}<img style="--imageWidth: {imageWidth}; --imageHeight: {imageHeight}" class="image" src={imageUrl} alt="" />{/if}
+  {#if showImage}
+    <img
+      style="--imageWidth: {imageWidth}; --imageHeight: {imageHeight}"
+      class="image"
+      src={imageUrl}
+      alt="" />
+  {/if}
   <div class="content">
     <h2 class="heading">{heading}</h2>
     <h4 class="text">{description}</h4>
-    <a style="--linkColor: {linkColor}; --linkHoverColor: {linkHoverColor}" href={linkUrl}>{linkText}</a>
+    <a
+      style="--linkColor: {linkColor}; --linkHoverColor: {linkHoverColor}"
+      href={linkUrl}>{linkText}</a>
   </div>
 </div>
 
diff --git a/packages/standard-components/src/CardHorizontal.svelte b/packages/standard-components/src/CardHorizontal.svelte
index f0741fd7de..5d7596e296 100644
--- a/packages/standard-components/src/CardHorizontal.svelte
+++ b/packages/standard-components/src/CardHorizontal.svelte
@@ -24,15 +24,23 @@
   use:styleable={$component.styles}
   class="container"
   style="--cardWidth: {cardWidth}">
-  {#if showImage}<img style="--imageWidth: {imageWidth}; --imageHeight: {imageHeight}" class="image" src={imageUrl} alt="" />{/if}
+  {#if showImage}
+    <img
+      style="--imageWidth: {imageWidth}; --imageHeight: {imageHeight}"
+      class="image"
+      src={imageUrl}
+      alt="" />
+  {/if}
   <div class="content">
     <main>
       <h2 class="heading">{heading}</h2>
       <p class="text">{description}</p>
     </main>
-    <footer >
+    <footer>
       <p class="subtext">{subtext}</p>
-      <a style="--linkColor: {linkColor}; --linkHoverColor: {linkHoverColor}" href={linkUrl}>{linkText}</a>
+      <a
+        style="--linkColor: {linkColor}; --linkHoverColor: {linkHoverColor}"
+        href={linkUrl}>{linkText}</a>
     </footer>
   </div>
 </div>
diff --git a/packages/standard-components/src/charts/ApexChart.svelte b/packages/standard-components/src/charts/ApexChart.svelte
index 88719ecddb..0c2e1b0e41 100644
--- a/packages/standard-components/src/charts/ApexChart.svelte
+++ b/packages/standard-components/src/charts/ApexChart.svelte
@@ -11,7 +11,9 @@
 {#if options}
   <div use:chart={options} use:styleable={$component.styles} />
 {:else if options === false}
-  <div use:styleable={$component.styles}>Invalid chart options</div>
+  <div use:styleable={$component.styles}>
+    Use the settings panel to build your chart -->
+  </div>
 {/if}
 
 <style>

From 6937c8e054dae96918d93775ce247328b3710a9a Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Fri, 11 Dec 2020 14:24:19 +0000
Subject: [PATCH 17/39] Improve navigation when logging in and out, remove need
 to hard reload the page and replace with smooth transitions

---
 .../client/src/components/ClientApp.svelte     |  6 ++----
 packages/client/src/components/Router.svelte   | 16 ++++++++++++----
 packages/client/src/store/auth.js              | 18 +++++++++++++++---
 packages/client/src/store/index.js             |  6 ++++++
 packages/client/src/store/initialise.js        |  7 +++++++
 packages/client/src/store/routes.js            |  2 ++
 .../standard-components/src/Navigation.svelte  |  4 ++--
 7 files changed, 46 insertions(+), 13 deletions(-)
 create mode 100644 packages/client/src/store/initialise.js

diff --git a/packages/client/src/components/ClientApp.svelte b/packages/client/src/components/ClientApp.svelte
index 75061ac327..a7a972a435 100644
--- a/packages/client/src/components/ClientApp.svelte
+++ b/packages/client/src/components/ClientApp.svelte
@@ -3,7 +3,7 @@
   import { setContext, onMount } from "svelte"
   import Component from "./Component.svelte"
   import SDK from "../sdk"
-  import { createDataStore, routeStore, screenStore } from "../store"
+  import { createDataStore, initialise, screenStore } from "../store"
 
   // Provide contexts
   setContext("sdk", SDK)
@@ -14,13 +14,11 @@
 
   // Load app config
   onMount(async () => {
-    await routeStore.actions.fetchRoutes()
-    await screenStore.actions.fetchScreens()
+    await initialise()
     loaded = true
   })
 </script>
 
 {#if loaded && $screenStore.activeLayout}
-  <!-- // TODO: need to get the active screen as well -->
   <Component definition={$screenStore.activeLayout.props} />
 {/if}
diff --git a/packages/client/src/components/Router.svelte b/packages/client/src/components/Router.svelte
index 5684b189eb..3c2d71c422 100644
--- a/packages/client/src/components/Router.svelte
+++ b/packages/client/src/components/Router.svelte
@@ -7,7 +7,15 @@
   const { styleable } = getContext("sdk")
   const component = getContext("component")
 
-  $: routerConfig = getRouterConfig($routeStore.routes)
+  // Only wrap this as an array to take advantage of svelte keying,
+  // to ensure the svelte-spa-router is fully remounted when route config
+  // changes
+  $: configs = [
+    {
+      routes: getRouterConfig($routeStore.routes),
+      id: $routeStore.routeSessionId,
+    },
+  ]
 
   const getRouterConfig = routes => {
     let config = {}
@@ -25,11 +33,11 @@
   }
 </script>
 
-{#if routerConfig}
+{#each configs as config (config.id)}
   <div use:styleable={$component.styles}>
-    <Router on:routeLoading={onRouteLoading} routes={routerConfig} />
+    <Router on:routeLoading={onRouteLoading} routes={config.routes} />
   </div>
-{/if}
+{/each}
 
 <style>
   div {
diff --git a/packages/client/src/store/auth.js b/packages/client/src/store/auth.js
index d641113b4a..a08510ac31 100644
--- a/packages/client/src/store/auth.js
+++ b/packages/client/src/store/auth.js
@@ -1,18 +1,29 @@
 import * as API from "../api"
 import { getAppId } from "../utils/getAppId"
 import { writable } from "svelte/store"
+import { initialise } from "./initialise"
+import { routeStore } from "./routes"
 
 const createAuthStore = () => {
   const store = writable("")
 
+  const goToDefaultRoute = () => {
+    // Setting the active route forces an update of the active screen ID,
+    // even if we're on the same URL
+    routeStore.actions.setActiveRoute("/")
+
+    // Navigating updates the URL to reflect this route
+    routeStore.actions.navigate("/")
+  }
   const logIn = async ({ email, password }) => {
     const user = await API.logIn({ email, password })
     if (!user.error) {
       store.set(user.token)
-      location.reload()
+      await initialise()
+      goToDefaultRoute()
     }
   }
-  const logOut = () => {
+  const logOut = async () => {
     store.set("")
     const appId = getAppId()
     if (appId) {
@@ -20,7 +31,8 @@ const createAuthStore = () => {
         window.document.cookie = `budibase:${appId}:${environment}=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;`
       }
     }
-    location.reload()
+    await initialise()
+    goToDefaultRoute()
   }
 
   return {
diff --git a/packages/client/src/store/index.js b/packages/client/src/store/index.js
index 58e51b6fc1..a99a638d4b 100644
--- a/packages/client/src/store/index.js
+++ b/packages/client/src/store/index.js
@@ -1,3 +1,6 @@
+import { routeStore } from "./routes"
+import { screenStore } from "./screens"
+
 export { authStore } from "./auth"
 export { routeStore } from "./routes"
 export { screenStore } from "./screens"
@@ -6,3 +9,6 @@ export { bindingStore } from "./binding"
 
 // Data stores are layered and duplicated, so it is not a singleton
 export { createDataStore, dataStore } from "./data"
+
+// Initialises an app by loading screens and routes
+export { initialise } from "./initialise"
diff --git a/packages/client/src/store/initialise.js b/packages/client/src/store/initialise.js
new file mode 100644
index 0000000000..9e24439980
--- /dev/null
+++ b/packages/client/src/store/initialise.js
@@ -0,0 +1,7 @@
+import { routeStore } from "./routes"
+import { screenStore } from "./screens"
+
+export async function initialise() {
+  await routeStore.actions.fetchRoutes()
+  await screenStore.actions.fetchScreens()
+}
diff --git a/packages/client/src/store/routes.js b/packages/client/src/store/routes.js
index 88ca90df73..aa86718ec0 100644
--- a/packages/client/src/store/routes.js
+++ b/packages/client/src/store/routes.js
@@ -7,6 +7,7 @@ const createRouteStore = () => {
     routes: [],
     routeParams: {},
     activeRoute: null,
+    routeSessionId: Math.random(),
   }
   const store = writable(initialState)
 
@@ -29,6 +30,7 @@ const createRouteStore = () => {
 
     store.update(state => {
       state.routes = routes
+      state.routeSessionId = Math.random()
       return state
     })
   }
diff --git a/packages/standard-components/src/Navigation.svelte b/packages/standard-components/src/Navigation.svelte
index f6ca522225..4a4ec8dccc 100644
--- a/packages/standard-components/src/Navigation.svelte
+++ b/packages/standard-components/src/Navigation.svelte
@@ -6,8 +6,8 @@
 
   export let logoUrl
 
-  const logOut = () => {
-    authStore.actions.logOut()
+  const logOut = async () => {
+    await authStore.actions.logOut()
   }
 </script>
 

From 672fe3fcc9b416b38e5ccdfd9cc0b638d53c31a3 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Fri, 11 Dec 2020 15:29:25 +0000
Subject: [PATCH 18/39] Keep honouring selected screen access role after
 swapping to layout tab

---
 packages/builder/src/builderStore/store/frontend.js | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js
index dc6706373a..df04bcf8f9 100644
--- a/packages/builder/src/builderStore/store/frontend.js
+++ b/packages/builder/src/builderStore/store/frontend.js
@@ -89,11 +89,6 @@ export const getFrontendStore = () => {
           let screen =
             screens.find(screen => screen._id === screenId) || screens[0]
           if (!screen) return state
-
-          // Update role to the screen's role setting so that it will always
-          // be visible
-          selectedAccessRole.set(screen.routing.roleId)
-
           state.currentFrontEndType = FrontendTypes.SCREEN
           state.currentAssetId = screen._id
           state.currentView = "detail"
@@ -107,6 +102,7 @@ export const getFrontendStore = () => {
           state.currentAssetId = screen._id
           state.selectedComponentId = screen.props._id
           state.currentFrontEndType = FrontendTypes.SCREEN
+          selectedAccessRole.set(screen.routing.roleId)
           return state
         })
         return screen

From a3992acfa864e8c3ea228f32052030d52b874863 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Fri, 11 Dec 2020 16:19:56 +0000
Subject: [PATCH 19/39] Fix lint

---
 packages/client/src/store/index.js | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/packages/client/src/store/index.js b/packages/client/src/store/index.js
index a99a638d4b..2a3edb6d01 100644
--- a/packages/client/src/store/index.js
+++ b/packages/client/src/store/index.js
@@ -1,6 +1,3 @@
-import { routeStore } from "./routes"
-import { screenStore } from "./screens"
-
 export { authStore } from "./auth"
 export { routeStore } from "./routes"
 export { screenStore } from "./screens"

From aa71e955978e1b1aba31796b21385f0aaef8eeef Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Mon, 14 Dec 2020 11:14:16 +0000
Subject: [PATCH 20/39] Allow independent selection of screen IDs and layout
 IDs so that selections persist between toggling tabs. Update logic around
 role selection and screen filtering

---
 packages/builder/src/builderStore/index.js    | 30 ++++++-------
 .../src/builderStore/store/frontend.js        | 26 +++++++----
 .../ComponentTree.svelte                      |  4 +-
 .../ComponentNavigationTree/PathTree.svelte   |  5 +--
 .../ComponentNavigationTree/index.svelte      | 17 ++++---
 .../ComponentSelectionList.svelte             | 11 +++--
 .../userInterface/FrontendNavigatePane.svelte | 45 ++++++++++++++-----
 .../components/userInterface/Layout.svelte    |  6 +--
 .../design/[assetType]/[asset]/_layout.svelte | 11 ++---
 .../design/[assetType]/_layout.svelte         |  5 +--
 .../design/[assetType]/index.svelte           | 24 +++++++++-
 11 files changed, 124 insertions(+), 60 deletions(-)

diff --git a/packages/builder/src/builderStore/index.js b/packages/builder/src/builderStore/index.js
index f1914efab2..cf668670bb 100644
--- a/packages/builder/src/builderStore/index.js
+++ b/packages/builder/src/builderStore/index.js
@@ -4,7 +4,7 @@ import { getAutomationStore } from "./store/automation/"
 import { getThemeStore } from "./store/theme"
 import { derived, writable } from "svelte/store"
 import analytics from "analytics"
-import { LAYOUT_NAMES } from "../constants"
+import { FrontendTypes, LAYOUT_NAMES } from "../constants"
 import { makePropsSafe } from "components/userInterface/assetParsing/createProps"
 
 export const store = getFrontendStore()
@@ -13,18 +13,12 @@ export const automationStore = getAutomationStore()
 export const themeStore = getThemeStore()
 
 export const currentAsset = derived(store, $store => {
-  const layout = $store.layouts
-    ? $store.layouts.find(layout => layout._id === $store.currentAssetId)
-    : null
-
-  if (layout) return layout
-
-  const screen = $store.screens
-    ? $store.screens.find(screen => screen._id === $store.currentAssetId)
-    : null
-
-  if (screen) return screen
-
+  const type = $store.currentFrontEndType
+  if (type === FrontendTypes.SCREEN) {
+    return $store.screens.find(screen => screen._id === $store.selectedScreenId)
+  } else if (type === FrontendTypes.LAYOUT) {
+    return $store.layouts.find(layout => layout._id === $store.selectedLayoutId)
+  }
   return null
 })
 
@@ -59,8 +53,14 @@ export const selectedComponent = derived(
   }
 )
 
-export const currentAssetName = derived(store, () => {
-  return currentAsset.name
+export const currentAssetId = derived(store, $store => {
+  return $store.currentFrontEndType === FrontendTypes.SCREEN
+    ? $store.selectedScreenId
+    : $store.selectedLayoutId
+})
+
+export const currentAssetName = derived(currentAsset, $currentAsset => {
+  return $currentAsset?.name
 })
 
 // leave this as before for consistency
diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js
index df04bcf8f9..263041aadd 100644
--- a/packages/builder/src/builderStore/store/frontend.js
+++ b/packages/builder/src/builderStore/store/frontend.js
@@ -32,7 +32,8 @@ const INITIAL_FRONTEND_STATE = {
   screens: [],
   components: [],
   currentFrontEndType: "none",
-  currentAssetId: "",
+  selectedScreenId: "",
+  selectedLayoutId: "",
   selectedComponentId: "",
   errors: [],
   hasAppPackage: false,
@@ -89,8 +90,13 @@ export const getFrontendStore = () => {
           let screen =
             screens.find(screen => screen._id === screenId) || screens[0]
           if (!screen) return state
+
+          // Update role to the screen's role setting so that it will always
+          // be visible
+          selectedAccessRole.set(screen.routing.roleId)
+
           state.currentFrontEndType = FrontendTypes.SCREEN
-          state.currentAssetId = screen._id
+          state.selectedScreenId = screen._id
           state.currentView = "detail"
           state.selectedComponentId = screen.props?._id
           return state
@@ -99,7 +105,7 @@ export const getFrontendStore = () => {
       create: async screen => {
         screen = await store.actions.screens.save(screen)
         store.update(state => {
-          state.currentAssetId = screen._id
+          state.selectedScreenId = screen._id
           state.selectedComponentId = screen.props._id
           state.currentFrontEndType = FrontendTypes.SCREEN
           selectedAccessRole.set(screen.routing.roleId)
@@ -144,8 +150,8 @@ export const getFrontendStore = () => {
                 `/api/screens/${screenToDelete._id}/${screenToDelete._rev}`
               )
             )
-            if (screenToDelete._id === state.currentAssetId) {
-              state.currentAssetId = ""
+            if (screenToDelete._id === state.selectedScreenId) {
+              state.selectedScreenId = null
             }
           }
           return state
@@ -168,11 +174,12 @@ export const getFrontendStore = () => {
     layouts: {
       select: layoutId => {
         store.update(state => {
-          const layout = store.actions.layouts.find(layoutId)
+          const layout =
+            store.actions.layouts.find(layoutId) || get(store).layouts[0]
           if (!layout) return
           state.currentFrontEndType = FrontendTypes.LAYOUT
           state.currentView = "detail"
-          state.currentAssetId = layout._id
+          state.selectedLayoutId = layout._id
           state.selectedComponentId = layout.props?._id
           return state
         })
@@ -215,16 +222,17 @@ export const getFrontendStore = () => {
         const response = await api.delete(
           `/api/layouts/${layoutToDelete._id}/${layoutToDelete._rev}`
         )
-
         if (response.status !== 200) {
           const json = await response.json()
           throw new Error(json.message)
         }
-
         store.update(state => {
           state.layouts = state.layouts.filter(
             layout => layout._id !== layoutToDelete._id
           )
+          if (layoutToDelete._id === state.selectedLayoutId) {
+            state.selectedLayoutId = get(mainLayout)._id
+          }
           return state
         })
       },
diff --git a/packages/builder/src/components/userInterface/ComponentNavigationTree/ComponentTree.svelte b/packages/builder/src/components/userInterface/ComponentNavigationTree/ComponentTree.svelte
index 485af84e74..320a81f00d 100644
--- a/packages/builder/src/components/userInterface/ComponentNavigationTree/ComponentTree.svelte
+++ b/packages/builder/src/components/userInterface/ComponentNavigationTree/ComponentTree.svelte
@@ -1,6 +1,6 @@
 <script>
   import { goto } from "@sveltech/routify"
-  import { store, currentAsset } from "builderStore"
+  import { store, currentAssetId } from "builderStore"
   import { getComponentDefinition } from "builderStore/storeUtils"
   import { DropEffect, DropPosition } from "./dragDropStore"
   import ComponentDropdownMenu from "../ComponentDropdownMenu.svelte"
@@ -22,7 +22,7 @@
     const path = store.actions.components.findRoute(component)
 
     // Go to correct URL
-    $goto(`./${$store.currentAssetId}/${path}`)
+    $goto(`./${$currentAssetId}/${path}`)
   }
 
   const dragstart = component => e => {
diff --git a/packages/builder/src/components/userInterface/ComponentNavigationTree/PathTree.svelte b/packages/builder/src/components/userInterface/ComponentNavigationTree/PathTree.svelte
index 5dd4ed9a7c..1b69ee770e 100644
--- a/packages/builder/src/components/userInterface/ComponentNavigationTree/PathTree.svelte
+++ b/packages/builder/src/components/userInterface/ComponentNavigationTree/PathTree.svelte
@@ -1,5 +1,4 @@
 <script>
-  import { writable } from "svelte/store"
   import { goto } from "@sveltech/routify"
   import { store, selectedComponent, currentAsset } from "builderStore"
   import instantiateStore from "./dragDropStore"
@@ -43,8 +42,8 @@
     <NavItem
       icon="ri-artboard-2-line"
       indentLevel={indent || 1}
-      selected={$store.currentAssetId === screenId}
-      opened={$store.currentAssetId === screenId}
+      selected={$store.selectedScreenId === screenId}
+      opened={$store.selectedScreenId === screenId}
       text={ROUTE_NAME_MAP[url]?.[role] || url}
       withArrow={route.subpaths}
       on:click={() => changeScreen(screenId)}>
diff --git a/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte b/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte
index a88c6feb34..8ccf8f7ac9 100644
--- a/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte
+++ b/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte
@@ -9,21 +9,23 @@
     const allRoutes = $store.routes
     const sortedPaths = Object.keys(allRoutes).sort()
     const selectedRoleId = $selectedAccessRole
-    const selectedScreenId = $store.currentAssetId
+    const selectedScreenId = $store.selectedScreenId
 
     let found = false
     let firstValidScreenId
     let filteredRoutes = {}
+    let screenRoleId
 
     // Filter all routes down to only those which match the current role
     sortedPaths.forEach(path => {
       const config = allRoutes[path]
       Object.entries(config.subpaths).forEach(([subpath, pathConfig]) => {
         Object.entries(pathConfig.screens).forEach(([roleId, screenId]) => {
+          if (screenId === selectedScreenId) {
+            screenRoleId = roleId
+            found = roleId === selectedRoleId
+          }
           if (roleId === selectedRoleId) {
-            if (screenId === selectedScreenId) {
-              found = roleId === selectedRoleId
-            }
             if (!firstValidScreenId) {
               firstValidScreenId = screenId
             }
@@ -41,8 +43,13 @@
     })
     routes = filteredRoutes
 
+    // Select the correct role for the current screen ID
+    if (!found && screenRoleId) {
+      selectedAccessRole.set(screenRoleId)
+    }
+
     // If the selected screen isn't in this filtered list, select the first one
-    if (!found && firstValidScreenId) {
+    else if (!found && firstValidScreenId) {
       store.actions.screens.select(firstValidScreenId)
     }
   }
diff --git a/packages/builder/src/components/userInterface/ComponentSelectionList.svelte b/packages/builder/src/components/userInterface/ComponentSelectionList.svelte
index 260eff72c6..60f40be6e2 100644
--- a/packages/builder/src/components/userInterface/ComponentSelectionList.svelte
+++ b/packages/builder/src/components/userInterface/ComponentSelectionList.svelte
@@ -1,6 +1,11 @@
 <script>
-  import { goto, url } from "@sveltech/routify"
-  import { store, currentAssetName, selectedComponent } from "builderStore"
+  import { goto } from "@sveltech/routify"
+  import {
+    store,
+    currentAssetName,
+    selectedComponent,
+    currentAssetId,
+  } from "builderStore"
   import components from "./temporaryPanelStructure.js"
   import { DropdownMenu } from "@budibase/bbui"
   import { DropdownContainer, DropdownItem } from "components/common/Dropdowns"
@@ -27,7 +32,7 @@
   const onComponentChosen = component => {
     store.actions.components.create(component._component, component.presetProps)
     const path = store.actions.components.findRoute($selectedComponent)
-    $goto(`./${$store.currentAssetId}/${path}`)
+    $goto(`./${$currentAssetId}/${path}`)
     close()
   }
 </script>
diff --git a/packages/builder/src/components/userInterface/FrontendNavigatePane.svelte b/packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
index 25f939d2f1..698476dcd8 100644
--- a/packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
+++ b/packages/builder/src/components/userInterface/FrontendNavigatePane.svelte
@@ -3,6 +3,7 @@
   import { goto, params, url } from "@sveltech/routify"
   import {
     store,
+    allScreens,
     currentAsset,
     backendUiStore,
     selectedAccessRole,
@@ -29,11 +30,38 @@
   let routes = {}
   let tab = $params.assetType
 
-  function navigate({ detail }) {
-    if (!detail) return
+  const navigate = ({ detail }) => {
+    if (!detail) {
+      return
+    }
     $goto(`../${detail.heading.key}`)
   }
 
+  const updateAccessRole = event => {
+    const role = event.target.value
+
+    // Select a valid screen with this new role - otherwise we'll not be
+    // able to change role at all because ComponentNavigationTree will kick us
+    // back the current role again because the same screen ID is still selected
+    const firstValidScreenId = $allScreens.find(
+      screen => screen.routing.roleId === role
+    )?._id
+    if (firstValidScreenId) {
+      store.actions.screens.select(firstValidScreenId)
+    }
+
+    // Otherwise clear the selected screen ID so that the first new valid screen
+    // can be selected by ComponentNavigationTree
+    else {
+      store.update(state => {
+        state.selectedScreenId = null
+        return state
+      })
+    }
+
+    selectedAccessRole.set(role)
+  }
+
   onMount(() => {
     store.actions.routing.fetch()
   })
@@ -46,24 +74,21 @@
         on:click={modal.show}
         data-cy="new-screen"
         class="ri-add-circle-fill" />
-
       <div class="role-select">
         <Select
           extraThin
           secondary
-          bind:value={$selectedAccessRole}
+          on:change={updateAccessRole}
+          value={$selectedAccessRole}
           label="Filter by Access">
           {#each $backendUiStore.roles as role}
             <option value={role._id}>{role.name}</option>
           {/each}
         </Select>
       </div>
-
-      {#if $currentAsset}
-        <div class="nav-items-container">
-          <ComponentNavigationTree />
-        </div>
-      {/if}
+      <div class="nav-items-container">
+        <ComponentNavigationTree />
+      </div>
       <Modal bind:this={modal}>
         <NewScreenModal />
       </Modal>
diff --git a/packages/builder/src/components/userInterface/Layout.svelte b/packages/builder/src/components/userInterface/Layout.svelte
index 37593dedf7..77bab330c5 100644
--- a/packages/builder/src/components/userInterface/Layout.svelte
+++ b/packages/builder/src/components/userInterface/Layout.svelte
@@ -28,13 +28,13 @@
   icon="ri-layout-3-line"
   text={layout.name}
   withArrow
-  selected={$store.currentAssetId === layout._id}
-  opened={$store.currentAssetId === layout._id}
+  selected={$store.selectedLayoutId === layout._id}
+  opened={$store.selectedLayoutId === layout._id}
   on:click={selectLayout}>
   <LayoutDropdownMenu {layout} />
 </NavItem>
 
-{#if $store.currentAssetId === layout._id && layout.props?._children}
+{#if $store.selectedLayoutId === layout._id && layout.props?._children}
   <ComponentTree
     components={layout.props._children}
     currentComponent={$selectedComponent}
diff --git a/packages/builder/src/pages/[application]/design/[assetType]/[asset]/_layout.svelte b/packages/builder/src/pages/[application]/design/[assetType]/[asset]/_layout.svelte
index ff1a94222f..eb266293d9 100644
--- a/packages/builder/src/pages/[application]/design/[assetType]/[asset]/_layout.svelte
+++ b/packages/builder/src/pages/[application]/design/[assetType]/[asset]/_layout.svelte
@@ -26,11 +26,12 @@
   // There are leftover stuff, like IDs, so navigate the components and find the ID and select it.
   if ($leftover) {
     // Get the correct screen children.
-    const assetChildren = assetList.find(
-      asset =>
-        asset._id === $params.asset ||
-        asset._id === decodeURIComponent($params.asset)
-    ).props._children
+    const assetChildren =
+      assetList.find(
+        asset =>
+          asset._id === $params.asset ||
+          asset._id === decodeURIComponent($params.asset)
+      )?.props._children ?? []
     findComponent(componentIds, assetChildren)
   }
   // }
diff --git a/packages/builder/src/pages/[application]/design/[assetType]/_layout.svelte b/packages/builder/src/pages/[application]/design/[assetType]/_layout.svelte
index f95760ec53..b797a18dc4 100644
--- a/packages/builder/src/pages/[application]/design/[assetType]/_layout.svelte
+++ b/packages/builder/src/pages/[application]/design/[assetType]/_layout.svelte
@@ -1,11 +1,10 @@
 <script>
-  import { store, backendUiStore } from "builderStore"
+  import { store, backendUiStore, currentAsset } from "builderStore"
   import { onMount } from "svelte"
   import { FrontendTypes } from "constants"
   import CurrentItemPreview from "components/userInterface/AppPreview"
   import ComponentPropertiesPanel from "components/userInterface/ComponentPropertiesPanel.svelte"
   import ComponentSelectionList from "components/userInterface/ComponentSelectionList.svelte"
-  import { last } from "lodash/fp"
   import FrontendNavigatePane from "components/userInterface/FrontendNavigatePane.svelte"
 
   $: instance = $store.appInstance
@@ -36,7 +35,7 @@
   </div>
 
   <div class="preview-pane">
-    {#if $store.currentAssetId && $store.currentAssetId.length > 0}
+    {#if $currentAsset}
       <ComponentSelectionList />
       <div class="preview-content">
         <CurrentItemPreview />
diff --git a/packages/builder/src/pages/[application]/design/[assetType]/index.svelte b/packages/builder/src/pages/[application]/design/[assetType]/index.svelte
index 85cafaadd0..30545212a9 100644
--- a/packages/builder/src/pages/[application]/design/[assetType]/index.svelte
+++ b/packages/builder/src/pages/[application]/design/[assetType]/index.svelte
@@ -5,12 +5,32 @@
 
   // Go to first layout
   if ($params.assetType === FrontendTypes.LAYOUT) {
-    $goto(`../${$store.layouts[0]?._id}`)
+    // Try to use previously selected layout first
+    let id
+    if (
+      $store.selectedLayoutId &&
+      $store.layouts.find(layout => layout._id === $store.selectedLayoutId)
+    ) {
+      id = $store.selectedLayoutId
+    } else {
+      id = $store.layouts[0]?._id
+    }
+    $goto(`../${id}`)
   }
 
   // Go to first screen
   if ($params.assetType === FrontendTypes.SCREEN) {
-    $goto(`../${$allScreens[0]?._id}`)
+    // Try to use previously selected layout first
+    let id
+    if (
+      $store.selectedScreenId &&
+      $allScreens.find(screen => screen._id === $store.selectedScreenId)
+    ) {
+      id = $store.selectedScreenId
+    } else {
+      id = $allScreens[0]?._id
+    }
+    $goto(`../${id}`)
   }
 </script>
 

From 449509a2030c16eca22609c16f7ecb507bcb6871 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Mon, 14 Dec 2020 11:14:36 +0000
Subject: [PATCH 21/39] Fix URL update after creating a new layout

---
 .../builder/src/components/userInterface/NewLayoutModal.svelte  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/builder/src/components/userInterface/NewLayoutModal.svelte b/packages/builder/src/components/userInterface/NewLayoutModal.svelte
index dbc9e3dc7a..1781c6a2d3 100644
--- a/packages/builder/src/components/userInterface/NewLayoutModal.svelte
+++ b/packages/builder/src/components/userInterface/NewLayoutModal.svelte
@@ -8,7 +8,7 @@
 
   async function save() {
     try {
-      const layout = store.actions.layouts.save({ name })
+      const layout = await store.actions.layouts.save({ name })
       $goto(`./${layout._id}`)
       notifier.success(`Layout ${name} created successfully`)
     } catch (err) {

From 119107834f8d6bde43d5d86c1448dd19b8163519 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Mon, 14 Dec 2020 13:24:09 +0000
Subject: [PATCH 22/39] Rename create new row to create new user for users
 table

---
 .../builder/src/components/backend/DataTable/DataTable.svelte  | 1 +
 .../backend/DataTable/buttons/CreateRowButton.svelte           | 3 ++-
 .../userInterface/ComponentNavigationTree/index.svelte         | 2 +-
 3 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/builder/src/components/backend/DataTable/DataTable.svelte b/packages/builder/src/components/backend/DataTable/DataTable.svelte
index 5ff7925c5f..436a3b4dee 100644
--- a/packages/builder/src/components/backend/DataTable/DataTable.svelte
+++ b/packages/builder/src/components/backend/DataTable/DataTable.svelte
@@ -44,6 +44,7 @@
   <CreateColumnButton />
   {#if schema && Object.keys(schema).length > 0}
     <CreateRowButton
+      title={isUsersTable ? 'Create New User' : 'Create New Row'}
       modalContentComponent={isUsersTable ? CreateEditUser : CreateEditRow} />
     <CreateViewButton />
     <ExportButton view={tableView} />
diff --git a/packages/builder/src/components/backend/DataTable/buttons/CreateRowButton.svelte b/packages/builder/src/components/backend/DataTable/buttons/CreateRowButton.svelte
index dfd8e6f4ac..19975ac1a1 100644
--- a/packages/builder/src/components/backend/DataTable/buttons/CreateRowButton.svelte
+++ b/packages/builder/src/components/backend/DataTable/buttons/CreateRowButton.svelte
@@ -3,6 +3,7 @@
   import CreateEditRow from "../modals/CreateEditRow.svelte"
 
   export let modalContentComponent = CreateEditRow
+  export let title = "Create New Row"
 
   let modal
 </script>
@@ -10,7 +11,7 @@
 <div>
   <Button text small on:click={modal.show}>
     <Icon name="addrow" />
-    Create New Row
+    {title}
   </Button>
 </div>
 <Modal bind:this={modal}>
diff --git a/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte b/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte
index 8ccf8f7ac9..720b18f8f9 100644
--- a/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte
+++ b/packages/builder/src/components/userInterface/ComponentNavigationTree/index.svelte
@@ -7,7 +7,7 @@
 
   $: {
     const allRoutes = $store.routes
-    const sortedPaths = Object.keys(allRoutes).sort()
+    const sortedPaths = Object.keys(allRoutes || {}).sort()
     const selectedRoleId = $selectedAccessRole
     const selectedScreenId = $store.selectedScreenId
 

From fb1ca5e7ef914634ab6cf271ab705fedb87ca5e2 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Mon, 14 Dec 2020 13:33:34 +0000
Subject: [PATCH 23/39] Fix cypress tests

---
 packages/builder/cypress/support/commands.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/builder/cypress/support/commands.js b/packages/builder/cypress/support/commands.js
index 1a5270e33b..e92034c120 100644
--- a/packages/builder/cypress/support/commands.js
+++ b/packages/builder/cypress/support/commands.js
@@ -115,7 +115,7 @@ Cypress.Commands.add("createUser", (email, password, role) => {
   // Create User
   cy.contains("Users").click()
 
-  cy.contains("Create New Row").click()
+  cy.contains("Create New User").click()
 
   cy.get(".modal").within(() => {
     cy.get("input")

From 6f521c1644030ef35dae9722e688833667f41820 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Mon, 14 Dec 2020 13:36:09 +0000
Subject: [PATCH 24/39] Small JS syntax refactor

---
 packages/builder/src/components/backend/DataTable/Table.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/builder/src/components/backend/DataTable/Table.svelte b/packages/builder/src/components/backend/DataTable/Table.svelte
index e43a4f7408..1e6c53bd11 100644
--- a/packages/builder/src/components/backend/DataTable/Table.svelte
+++ b/packages/builder/src/components/backend/DataTable/Table.svelte
@@ -82,7 +82,7 @@
       if (!allowEditing) {
         return false
       }
-      return !(isUsersTable && ["email", "roleId"].indexOf(key) !== -1)
+      return !(isUsersTable && ["email", "roleId"].includes(key))
     }
 
     Object.entries(schema || {}).forEach(([key, value]) => {

From 0c93c17292a1012b9152be22f516cb6055eca381 Mon Sep 17 00:00:00 2001
From: Martin McKeaveney <martin@shogunsystems.co.uk>
Date: Tue, 15 Dec 2020 11:53:28 +0000
Subject: [PATCH 25/39] v0.4.0

---
 lerna.json                                | 2 +-
 packages/builder/package.json             | 4 ++--
 packages/client/package.json              | 6 +++---
 packages/server/package.json              | 4 ++--
 packages/standard-components/package.json | 6 +++---
 5 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/lerna.json b/lerna.json
index cc0b07a99e..ea5dc281da 100644
--- a/lerna.json
+++ b/lerna.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.3.8",
+  "version": "0.4.0",
   "npmClient": "yarn",
   "packages": [
     "packages/*"
diff --git a/packages/builder/package.json b/packages/builder/package.json
index 542c35205e..f5bcb39548 100644
--- a/packages/builder/package.json
+++ b/packages/builder/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@budibase/builder",
-  "version": "0.3.8",
+  "version": "0.4.0",
   "license": "AGPL-3.0",
   "private": true,
   "scripts": {
@@ -64,7 +64,7 @@
   },
   "dependencies": {
     "@budibase/bbui": "^1.52.2",
-    "@budibase/client": "^0.3.8",
+    "@budibase/client": "^0.4.0",
     "@budibase/colorpicker": "^1.0.1",
     "@budibase/svelte-ag-grid": "^0.0.16",
     "@fortawesome/fontawesome-free": "^5.14.0",
diff --git a/packages/client/package.json b/packages/client/package.json
index 2670d029c5..abf4faaf74 100644
--- a/packages/client/package.json
+++ b/packages/client/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@budibase/client",
-  "version": "0.3.8",
+  "version": "0.4.0",
   "license": "MPL-2.0",
   "main": "dist/budibase-client.js",
   "module": "dist/budibase-client.js",
@@ -15,7 +15,7 @@
     "svelte-spa-router": "^3.0.5"
   },
   "devDependencies": {
-    "@budibase/standard-components": "^0.3.8",
+    "@budibase/standard-components": "^0.4.0",
     "@rollup/plugin-commonjs": "^16.0.0",
     "@rollup/plugin-node-resolve": "^10.0.0",
     "fs-extra": "^8.1.0",
@@ -23,8 +23,8 @@
     "rollup": "^2.33.2",
     "rollup-plugin-node-builtins": "^2.1.2",
     "rollup-plugin-node-globals": "^1.4.0",
-    "rollup-plugin-svelte": "^6.1.1",
     "rollup-plugin-node-resolve": "^5.2.0",
+    "rollup-plugin-svelte": "^6.1.1",
     "rollup-plugin-terser": "^4.0.4",
     "svelte": "^3.30.0",
     "svelte-jester": "^1.0.6"
diff --git a/packages/server/package.json b/packages/server/package.json
index e2e19b5213..aa686a88b1 100644
--- a/packages/server/package.json
+++ b/packages/server/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@budibase/server",
   "email": "hi@budibase.com",
-  "version": "0.3.8",
+  "version": "0.4.0",
   "description": "Budibase Web Server",
   "main": "src/electron.js",
   "repository": {
@@ -51,7 +51,7 @@
   "author": "Budibase",
   "license": "AGPL-3.0-or-later",
   "dependencies": {
-    "@budibase/client": "^0.3.8",
+    "@budibase/client": "^0.4.0",
     "@koa/router": "^8.0.0",
     "@sendgrid/mail": "^7.1.1",
     "@sentry/node": "^5.19.2",
diff --git a/packages/standard-components/package.json b/packages/standard-components/package.json
index 440784e4bb..9187ba5c08 100644
--- a/packages/standard-components/package.json
+++ b/packages/standard-components/package.json
@@ -29,7 +29,7 @@
   "keywords": [
     "svelte"
   ],
-  "version": "0.3.8",
+  "version": "0.4.0",
   "license": "MIT",
   "gitHead": "284cceb9b703c38566c6e6363c022f79a08d5691",
   "dependencies": {
@@ -41,8 +41,8 @@
     "lodash.debounce": "^4.0.8",
     "markdown-it": "^12.0.2",
     "quill": "^1.3.7",
-    "turndown": "^7.0.0",
     "svelte-apexcharts": "^1.0.2",
-    "svelte-flatpickr": "^3.1.0"
+    "svelte-flatpickr": "^3.1.0",
+    "turndown": "^7.0.0"
   }
 }

From c54ea7294b58a5ab4da4a97e634426912fc04df9 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Tue, 15 Dec 2020 13:40:49 +0000
Subject: [PATCH 26/39] Fix bug with changing app name

---
 packages/builder/src/components/settings/tabs/General.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/builder/src/components/settings/tabs/General.svelte b/packages/builder/src/components/settings/tabs/General.svelte
index 04d4672d50..809917f27d 100644
--- a/packages/builder/src/components/settings/tabs/General.svelte
+++ b/packages/builder/src/components/settings/tabs/General.svelte
@@ -4,7 +4,7 @@
   import api from "builderStore/api"
 
   async function updateApplication(data) {
-    const response = await api.put(`/api/${$store.appId}`, data)
+    const response = await api.put(`/api/applications/${$store.appId}`, data)
     const app = await response.json()
     store.update(state => {
       state = {

From 5a760a360c8929144f159744fada22b0f5396798 Mon Sep 17 00:00:00 2001
From: Martin McKeaveney <martin@budibase.com>
Date: Tue, 15 Dec 2020 14:01:46 +0000
Subject: [PATCH 27/39] Update package.json

We can't build RPM for our scoped package due to - https://github.com/electron-userland/electron-builder/issues/5240

Need to remove RPM for now as it's blocking the release
---
 packages/server/package.json | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/server/package.json b/packages/server/package.json
index aa686a88b1..0759eef596 100644
--- a/packages/server/package.json
+++ b/packages/server/package.json
@@ -22,7 +22,6 @@
       "icon": "./build/icons/",
       "target": [
         "deb",
-        "rpm",
         "pacman",
         "snap"
       ],

From a0e6ffd3e04942534d9bf4a31784b51cf2351384 Mon Sep 17 00:00:00 2001
From: Martin McKeaveney <martin@shogunsystems.co.uk>
Date: Tue, 15 Dec 2020 14:46:11 +0000
Subject: [PATCH 28/39] v0.4.1

---
 lerna.json                                | 2 +-
 packages/builder/package.json             | 4 ++--
 packages/client/package.json              | 4 ++--
 packages/server/package.json              | 4 ++--
 packages/standard-components/package.json | 2 +-
 5 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/lerna.json b/lerna.json
index ea5dc281da..bb441a801e 100644
--- a/lerna.json
+++ b/lerna.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.4.0",
+  "version": "0.4.1",
   "npmClient": "yarn",
   "packages": [
     "packages/*"
diff --git a/packages/builder/package.json b/packages/builder/package.json
index f5bcb39548..3617fe5c27 100644
--- a/packages/builder/package.json
+++ b/packages/builder/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@budibase/builder",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "license": "AGPL-3.0",
   "private": true,
   "scripts": {
@@ -64,7 +64,7 @@
   },
   "dependencies": {
     "@budibase/bbui": "^1.52.2",
-    "@budibase/client": "^0.4.0",
+    "@budibase/client": "^0.4.1",
     "@budibase/colorpicker": "^1.0.1",
     "@budibase/svelte-ag-grid": "^0.0.16",
     "@fortawesome/fontawesome-free": "^5.14.0",
diff --git a/packages/client/package.json b/packages/client/package.json
index abf4faaf74..b8a8cc857d 100644
--- a/packages/client/package.json
+++ b/packages/client/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@budibase/client",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "license": "MPL-2.0",
   "main": "dist/budibase-client.js",
   "module": "dist/budibase-client.js",
@@ -15,7 +15,7 @@
     "svelte-spa-router": "^3.0.5"
   },
   "devDependencies": {
-    "@budibase/standard-components": "^0.4.0",
+    "@budibase/standard-components": "^0.4.1",
     "@rollup/plugin-commonjs": "^16.0.0",
     "@rollup/plugin-node-resolve": "^10.0.0",
     "fs-extra": "^8.1.0",
diff --git a/packages/server/package.json b/packages/server/package.json
index 0759eef596..87371d59ce 100644
--- a/packages/server/package.json
+++ b/packages/server/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@budibase/server",
   "email": "hi@budibase.com",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "description": "Budibase Web Server",
   "main": "src/electron.js",
   "repository": {
@@ -50,7 +50,7 @@
   "author": "Budibase",
   "license": "AGPL-3.0-or-later",
   "dependencies": {
-    "@budibase/client": "^0.4.0",
+    "@budibase/client": "^0.4.1",
     "@koa/router": "^8.0.0",
     "@sendgrid/mail": "^7.1.1",
     "@sentry/node": "^5.19.2",
diff --git a/packages/standard-components/package.json b/packages/standard-components/package.json
index 9187ba5c08..f2afe1c1ca 100644
--- a/packages/standard-components/package.json
+++ b/packages/standard-components/package.json
@@ -29,7 +29,7 @@
   "keywords": [
     "svelte"
   ],
-  "version": "0.4.0",
+  "version": "0.4.1",
   "license": "MIT",
   "gitHead": "284cceb9b703c38566c6e6363c022f79a08d5691",
   "dependencies": {

From 498d62733714567ef95d7d20c1116ac865a9927a Mon Sep 17 00:00:00 2001
From: Martin McKeaveney <martin@budibase.com>
Date: Tue, 15 Dec 2020 15:08:21 +0000
Subject: [PATCH 29/39] Update package.json

---
 packages/server/package.json | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/packages/server/package.json b/packages/server/package.json
index 87371d59ce..7f0d78ac96 100644
--- a/packages/server/package.json
+++ b/packages/server/package.json
@@ -21,9 +21,7 @@
       "maintainer": "Budibase",
       "icon": "./build/icons/",
       "target": [
-        "deb",
-        "pacman",
-        "snap"
+        "deb"
       ],
       "category": "Development"
     },

From 79c9df6ea2f467b0f950729d2999cf0b8aed8c5e Mon Sep 17 00:00:00 2001
From: Martin McKeaveney <martin@shogunsystems.co.uk>
Date: Tue, 15 Dec 2020 15:23:45 +0000
Subject: [PATCH 30/39] v0.4.2

---
 lerna.json                                | 2 +-
 packages/builder/package.json             | 4 ++--
 packages/client/package.json              | 4 ++--
 packages/server/package.json              | 4 ++--
 packages/standard-components/package.json | 2 +-
 5 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/lerna.json b/lerna.json
index bb441a801e..256258d6b1 100644
--- a/lerna.json
+++ b/lerna.json
@@ -1,5 +1,5 @@
 {
-  "version": "0.4.1",
+  "version": "0.4.2",
   "npmClient": "yarn",
   "packages": [
     "packages/*"
diff --git a/packages/builder/package.json b/packages/builder/package.json
index 3617fe5c27..6c023efd29 100644
--- a/packages/builder/package.json
+++ b/packages/builder/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@budibase/builder",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "license": "AGPL-3.0",
   "private": true,
   "scripts": {
@@ -64,7 +64,7 @@
   },
   "dependencies": {
     "@budibase/bbui": "^1.52.2",
-    "@budibase/client": "^0.4.1",
+    "@budibase/client": "^0.4.2",
     "@budibase/colorpicker": "^1.0.1",
     "@budibase/svelte-ag-grid": "^0.0.16",
     "@fortawesome/fontawesome-free": "^5.14.0",
diff --git a/packages/client/package.json b/packages/client/package.json
index b8a8cc857d..bf24a6e86c 100644
--- a/packages/client/package.json
+++ b/packages/client/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@budibase/client",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "license": "MPL-2.0",
   "main": "dist/budibase-client.js",
   "module": "dist/budibase-client.js",
@@ -15,7 +15,7 @@
     "svelte-spa-router": "^3.0.5"
   },
   "devDependencies": {
-    "@budibase/standard-components": "^0.4.1",
+    "@budibase/standard-components": "^0.4.2",
     "@rollup/plugin-commonjs": "^16.0.0",
     "@rollup/plugin-node-resolve": "^10.0.0",
     "fs-extra": "^8.1.0",
diff --git a/packages/server/package.json b/packages/server/package.json
index 7f0d78ac96..d6ad591815 100644
--- a/packages/server/package.json
+++ b/packages/server/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@budibase/server",
   "email": "hi@budibase.com",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "Budibase Web Server",
   "main": "src/electron.js",
   "repository": {
@@ -48,7 +48,7 @@
   "author": "Budibase",
   "license": "AGPL-3.0-or-later",
   "dependencies": {
-    "@budibase/client": "^0.4.1",
+    "@budibase/client": "^0.4.2",
     "@koa/router": "^8.0.0",
     "@sendgrid/mail": "^7.1.1",
     "@sentry/node": "^5.19.2",
diff --git a/packages/standard-components/package.json b/packages/standard-components/package.json
index f2afe1c1ca..21b080da4b 100644
--- a/packages/standard-components/package.json
+++ b/packages/standard-components/package.json
@@ -29,7 +29,7 @@
   "keywords": [
     "svelte"
   ],
-  "version": "0.4.1",
+  "version": "0.4.2",
   "license": "MIT",
   "gitHead": "284cceb9b703c38566c6e6363c022f79a08d5691",
   "dependencies": {

From 94e56ee94df6916c6c8b500508c98d84fad321e9 Mon Sep 17 00:00:00 2001
From: kevmodrome <kevin@kevmodro.me>
Date: Wed, 16 Dec 2020 11:35:12 +0100
Subject: [PATCH 31/39] adds try/catch to API key validation

---
 packages/builder/src/analytics.js             | 26 +++++++++++--------
 .../components/start/CreateAppModal.svelte    |  1 -
 2 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/packages/builder/src/analytics.js b/packages/builder/src/analytics.js
index a7166f00f6..10d67addb3 100644
--- a/packages/builder/src/analytics.js
+++ b/packages/builder/src/analytics.js
@@ -39,19 +39,23 @@ function identify(id) {
 
 async function identifyByApiKey(apiKey) {
   if (!analyticsEnabled) return true
-  const response = await fetch(
-    `https://03gaine137.execute-api.eu-west-1.amazonaws.com/prod/account/id?api_key=${apiKey.trim()}`
-  )
-
-  if (response.status === 200) {
-    const id = await response.json()
-
-    await api.put("/api/keys/userId", { value: id })
-    identify(id)
-    return true
+  try {
+    const response = await fetch(
+      `https://03gaine137.execute-api.eu-west-1.amazonaws.com/prod/account/id?api_key=${apiKey.trim()}`
+    )
+    if (response.status === 200) {
+      const id = await response.json()
+  
+      await api.put("/api/keys/userId", { value: id })
+      identify(id)
+      return true
+    }
+  
+    return false
+  } catch (error) {
+    console.log(error)
   }
 
-  return false
 }
 
 function captureException(err) {
diff --git a/packages/builder/src/components/start/CreateAppModal.svelte b/packages/builder/src/components/start/CreateAppModal.svelte
index b88397b6c4..184eaeb2d6 100644
--- a/packages/builder/src/components/start/CreateAppModal.svelte
+++ b/packages/builder/src/components/start/CreateAppModal.svelte
@@ -27,7 +27,6 @@
 
     // make sure we only fetch once, unless API Key is changed
     if (isApiKeyValid === undefined || apiKey !== lastApiKey) {
-      lastApiKey = apiKey
       // svelte reactivity was causing a requst to get fired mutiple times
       // so, we make everything await the same promise, if one exists
       if (!fetchApiKeyPromise) {

From ad29ac3d6d904efb1b77e302e6572d85dd06cac6 Mon Sep 17 00:00:00 2001
From: kevmodrome <kevin@kevmodro.me>
Date: Wed, 16 Dec 2020 12:30:03 +0100
Subject: [PATCH 32/39] fix: corrects the overflowing multiselect when used
 with long-form type

---
 packages/standard-components/package.json | 2 +-
 packages/standard-components/yarn.lock    | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/standard-components/package.json b/packages/standard-components/package.json
index 440784e4bb..6a8325eefc 100644
--- a/packages/standard-components/package.json
+++ b/packages/standard-components/package.json
@@ -33,7 +33,7 @@
   "license": "MIT",
   "gitHead": "284cceb9b703c38566c6e6363c022f79a08d5691",
   "dependencies": {
-    "@budibase/bbui": "^1.52.1",
+    "@budibase/bbui": "^1.52.4",
     "@budibase/svelte-ag-grid": "^0.0.16",
     "@fortawesome/fontawesome-free": "^5.14.0",
     "apexcharts": "^3.22.1",
diff --git a/packages/standard-components/yarn.lock b/packages/standard-components/yarn.lock
index 2e0a12c25a..507dd84674 100644
--- a/packages/standard-components/yarn.lock
+++ b/packages/standard-components/yarn.lock
@@ -39,10 +39,10 @@
     lodash "^4.17.19"
     to-fast-properties "^2.0.0"
 
-"@budibase/bbui@^1.52.1":
-  version "1.52.1"
-  resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.52.1.tgz#7f1612616205debeac0c65242b4856cce07e4cd0"
-  integrity sha512-950HXR4Z8b0TgJH3Dt7gLgeHlgtBVMTtG+KkFTtID/zeiXohf60wr2cyAuttCZ3yb4rFRHC+SDXo2NOsKdenKw==
+"@budibase/bbui@^1.52.4":
+  version "1.52.4"
+  resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.52.4.tgz#ae3c17e1f49f14e65831703958bcddc6e64afd24"
+  integrity sha512-/wiv5dSyvXLgy2/zGEslnCsjwE8qqng1D8k5ScSOPEyMab8tzzd1XxfZAN9rp84zIMgAXeH6s5a4j4riR+jVkg==
   dependencies:
     markdown-it "^12.0.2"
     quill "^1.3.7"

From b472ad0c6320781929a9af1e91405fb755a8c073 Mon Sep 17 00:00:00 2001
From: kevmodrome <kevin@kevmodro.me>
Date: Wed, 16 Dec 2020 13:00:07 +0100
Subject: [PATCH 33/39] fixes CreateEditRow not display multiselect correctly
 when long-form component was used

---
 packages/builder/package.json                             | 2 +-
 .../backend/DataTable/modals/CreateEditRow.svelte         | 6 ++++++
 packages/builder/yarn.lock                                | 8 ++++----
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/packages/builder/package.json b/packages/builder/package.json
index 542c35205e..7b28d03213 100644
--- a/packages/builder/package.json
+++ b/packages/builder/package.json
@@ -63,7 +63,7 @@
     }
   },
   "dependencies": {
-    "@budibase/bbui": "^1.52.2",
+    "@budibase/bbui": "^1.52.4",
     "@budibase/client": "^0.3.8",
     "@budibase/colorpicker": "^1.0.1",
     "@budibase/svelte-ag-grid": "^0.0.16",
diff --git a/packages/builder/src/components/backend/DataTable/modals/CreateEditRow.svelte b/packages/builder/src/components/backend/DataTable/modals/CreateEditRow.svelte
index 050c7ce200..1bff069b95 100644
--- a/packages/builder/src/components/backend/DataTable/modals/CreateEditRow.svelte
+++ b/packages/builder/src/components/backend/DataTable/modals/CreateEditRow.svelte
@@ -45,3 +45,9 @@
     </div>
   {/each}
 </ModalContent>
+
+<style>
+  div {
+    min-width: 0;
+  }
+</style>
diff --git a/packages/builder/yarn.lock b/packages/builder/yarn.lock
index 7f650a83bc..f2f7363669 100644
--- a/packages/builder/yarn.lock
+++ b/packages/builder/yarn.lock
@@ -842,10 +842,10 @@
     lodash "^4.17.19"
     to-fast-properties "^2.0.0"
 
-"@budibase/bbui@^1.52.2":
-  version "1.52.2"
-  resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.52.2.tgz#a0774880fb755eb81c762bc355550af7f4562b09"
-  integrity sha512-PxiN5xvr+Z/RpypMDYh3lNhCUnejH1moMoWW7PiuCiho5VXGauR+M8T49p5eTKoFSqRMC7BUdFJJ9ye/cnQxNA==
+"@budibase/bbui@^1.52.4":
+  version "1.52.4"
+  resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.52.4.tgz#ae3c17e1f49f14e65831703958bcddc6e64afd24"
+  integrity sha512-/wiv5dSyvXLgy2/zGEslnCsjwE8qqng1D8k5ScSOPEyMab8tzzd1XxfZAN9rp84zIMgAXeH6s5a4j4riR+jVkg==
   dependencies:
     markdown-it "^12.0.2"
     quill "^1.3.7"

From a9aa68c7bf0a46dffa8533ea3eed207e558d2851 Mon Sep 17 00:00:00 2001
From: kevmodrome <kevin@kevmodro.me>
Date: Wed, 16 Dec 2020 15:22:31 +0100
Subject: [PATCH 34/39] lint fix

---
 packages/builder/src/analytics.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/packages/builder/src/analytics.js b/packages/builder/src/analytics.js
index 10d67addb3..f59d71ac30 100644
--- a/packages/builder/src/analytics.js
+++ b/packages/builder/src/analytics.js
@@ -45,17 +45,16 @@ async function identifyByApiKey(apiKey) {
     )
     if (response.status === 200) {
       const id = await response.json()
-  
+
       await api.put("/api/keys/userId", { value: id })
       identify(id)
       return true
     }
-  
+
     return false
   } catch (error) {
     console.log(error)
   }
-
 }
 
 function captureException(err) {

From 52e826e4eca764f92c36307e853a7e0afa6fb75c Mon Sep 17 00:00:00 2001
From: kevmodrome <kevin@kevmodro.me>
Date: Wed, 16 Dec 2020 15:31:20 +0100
Subject: [PATCH 35/39] add back accidently removed line of code

---
 packages/builder/src/components/start/CreateAppModal.svelte | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/builder/src/components/start/CreateAppModal.svelte b/packages/builder/src/components/start/CreateAppModal.svelte
index 184eaeb2d6..b88397b6c4 100644
--- a/packages/builder/src/components/start/CreateAppModal.svelte
+++ b/packages/builder/src/components/start/CreateAppModal.svelte
@@ -27,6 +27,7 @@
 
     // make sure we only fetch once, unless API Key is changed
     if (isApiKeyValid === undefined || apiKey !== lastApiKey) {
+      lastApiKey = apiKey
       // svelte reactivity was causing a requst to get fired mutiple times
       // so, we make everything await the same promise, if one exists
       if (!fetchApiKeyPromise) {

From d62f0752da8aeeac18ad7e4e9e993ea9d2ec9f36 Mon Sep 17 00:00:00 2001
From: kevmodrome <kevin@kevmodro.me>
Date: Fri, 18 Dec 2020 11:10:36 +0100
Subject: [PATCH 36/39] fixes encoding issue of file to work with non-english
 chars

---
 .../components/backend/TableNavigator/TableDataImport.svelte  | 4 +++-
 packages/server/src/utilities/tests/test.csv                  | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte b/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte
index d328df4b40..f7b612b296 100644
--- a/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte
+++ b/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte
@@ -18,6 +18,7 @@
   let schema = {}
   let fields = []
 
+  $: console.log(files[0])
   $: valid = !schema || fields.every(column => schema[column].success)
   $: dataImport = {
     valid,
@@ -43,6 +44,7 @@
   }
 
   async function validateCSV() {
+    console.log(csvString)
     const response = await api.post("/api/tables/csv/validate", {
       csvString,
       schema: schema || {},
@@ -82,7 +84,7 @@
       files = fileArray
       validateCSV()
     })
-    reader.readAsBinaryString(fileArray[0])
+    reader.readAsText(fileArray[0])
   }
 
   async function omitColumn(columnName) {
diff --git a/packages/server/src/utilities/tests/test.csv b/packages/server/src/utilities/tests/test.csv
index 2266b348cd..2a193e4df2 100644
--- a/packages/server/src/utilities/tests/test.csv
+++ b/packages/server/src/utilities/tests/test.csv
@@ -1,4 +1,4 @@
 "Name","Age","Address"
-"Bert","4324","5 Sesame Street"
+"Bertå","4324","5 Sesame Street"
 "Ernie","34","1 World Trade Center"
 "Big Bird","23423","44 Second Avenue"
\ No newline at end of file

From 851515896f62233852f0ad4645f9c54da11e95e9 Mon Sep 17 00:00:00 2001
From: kevmodrome <kevin@kevmodro.me>
Date: Fri, 18 Dec 2020 11:12:00 +0100
Subject: [PATCH 37/39] remove console logs

---
 .../components/backend/TableNavigator/TableDataImport.svelte    | 2 --
 1 file changed, 2 deletions(-)

diff --git a/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte b/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte
index f7b612b296..810d7960f5 100644
--- a/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte
+++ b/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte
@@ -18,7 +18,6 @@
   let schema = {}
   let fields = []
 
-  $: console.log(files[0])
   $: valid = !schema || fields.every(column => schema[column].success)
   $: dataImport = {
     valid,
@@ -44,7 +43,6 @@
   }
 
   async function validateCSV() {
-    console.log(csvString)
     const response = await api.post("/api/tables/csv/validate", {
       csvString,
       schema: schema || {},

From eb225a8df375df717a8d9c530b362db95225120a Mon Sep 17 00:00:00 2001
From: kevmodrome <kevin@kevmodro.me>
Date: Fri, 18 Dec 2020 11:20:25 +0100
Subject: [PATCH 38/39] updates test

---
 packages/server/src/utilities/tests/csvParser.spec.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/server/src/utilities/tests/csvParser.spec.js b/packages/server/src/utilities/tests/csvParser.spec.js
index 5fc4a9ffe3..48e275fdd1 100644
--- a/packages/server/src/utilities/tests/csvParser.spec.js
+++ b/packages/server/src/utilities/tests/csvParser.spec.js
@@ -89,7 +89,7 @@ describe("CSV Parser", () => {
         })
       ).toEqual([
         {
-          Name: "Bert",
+          Name: "Bertå",
         },
         {
           Name: "Ernie",

From 39c5c8a6fc289b7e803526981621a79529f8147c Mon Sep 17 00:00:00 2001
From: kevmodrome <kevin@kevmodro.me>
Date: Fri, 18 Dec 2020 11:29:26 +0100
Subject: [PATCH 39/39] update test snapshot

---
 .../src/utilities/tests/__snapshots__/csvParser.spec.js.snap    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/server/src/utilities/tests/__snapshots__/csvParser.spec.js.snap b/packages/server/src/utilities/tests/__snapshots__/csvParser.spec.js.snap
index 1966637f56..3c532413fa 100644
--- a/packages/server/src/utilities/tests/__snapshots__/csvParser.spec.js.snap
+++ b/packages/server/src/utilities/tests/__snapshots__/csvParser.spec.js.snap
@@ -5,7 +5,7 @@ Array [
   Object {
     "Address": "5 Sesame Street",
     "Age": 4324,
-    "Name": "Bert",
+    "Name": "Bertå",
   },
   Object {
     "Address": "1 World Trade Center",