From 2477f4f40b852e08b64a3fcfb01ad00cdc39d641 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Thu, 12 Jan 2023 15:39:46 +0000
Subject: [PATCH 01/26] Update click outside handler to handle modals properly

---
 packages/bbui/src/Actions/click_outside.js | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/packages/bbui/src/Actions/click_outside.js b/packages/bbui/src/Actions/click_outside.js
index 9ea247f997..6842b94a32 100644
--- a/packages/bbui/src/Actions/click_outside.js
+++ b/packages/bbui/src/Actions/click_outside.js
@@ -5,7 +5,7 @@ let clickHandlers = []
  * Handle a body click event
  */
 const handleClick = event => {
-  // Ignore click if needed
+  // Ignore click if this is an ignored class
   for (let className of ignoredClasses) {
     if (event.target.closest(className)) {
       return
@@ -14,9 +14,18 @@ const handleClick = event => {
 
   // Process handlers
   clickHandlers.forEach(handler => {
-    if (!handler.element.contains(event.target)) {
-      handler.callback?.(event)
+    if (handler.element.contains(event.target)) {
+      return
     }
+
+    // Ignore clicks for modals, unless the handler is registered from a modal
+    const sourceInModal = handler.element.closest(".spectrum-Modal") != null
+    const clickInModal = event.target.closest(".spectrum-Modal") != null
+    if (clickInModal && !sourceInModal) {
+      return
+    }
+
+    handler.callback?.(event)
   })
 }
 document.documentElement.addEventListener("click", handleClick, true)

From 034871ebad83081096ee01e7f24248f099dce30b Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Thu, 12 Jan 2023 15:41:00 +0000
Subject: [PATCH 02/26] Remove log

---
 packages/bbui/src/Actions/position_dropdown.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/bbui/src/Actions/position_dropdown.js b/packages/bbui/src/Actions/position_dropdown.js
index e89f28a69e..463b69169f 100644
--- a/packages/bbui/src/Actions/position_dropdown.js
+++ b/packages/bbui/src/Actions/position_dropdown.js
@@ -3,7 +3,6 @@ export default function positionDropdown(
   { anchor, align, maxWidth, useAnchorWidth }
 ) {
   const update = () => {
-    console.log("update")
     const anchorBounds = anchor.getBoundingClientRect()
     const elementBounds = element.getBoundingClientRect()
     let styles = {

From e32dc5237ad9157a2a8a5f91be3a609dc4462d5f Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Thu, 12 Jan 2023 15:42:59 +0000
Subject: [PATCH 03/26] Fix mobile menu upgrade button not closing menu

---
 .../src/pages/builder/portal/_components/MobileMenu.svelte | 2 +-
 .../pages/builder/portal/_components/UpgradeButton.svelte  | 7 ++++++-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/packages/builder/src/pages/builder/portal/_components/MobileMenu.svelte b/packages/builder/src/pages/builder/portal/_components/MobileMenu.svelte
index bfb08f9b36..8baf7609d0 100644
--- a/packages/builder/src/pages/builder/portal/_components/MobileMenu.svelte
+++ b/packages/builder/src/pages/builder/portal/_components/MobileMenu.svelte
@@ -38,7 +38,7 @@
       {/each}
     </SideNav>
     <div>
-      <UpgradeButton />
+      <UpgradeButton on:click={close} />
     </div>
   </Layout>
 </div>
diff --git a/packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte b/packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte
index 29066b8117..f1d8b5c762 100644
--- a/packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte
+++ b/packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte
@@ -7,6 +7,7 @@
 {#if $admin.cloud && $auth?.user?.accountPortalAccess}
   <Button
     cta
+    on:click
     on:click={() => {
       $goto($admin.accountPortalUrl + "/portal/upgrade")
     }}
@@ -14,7 +15,11 @@
     Upgrade
   </Button>
 {:else if !$admin.cloud && $auth.isAdmin}
-  <Button cta on:click={() => $goto("/builder/portal/account/upgrade")}>
+  <Button
+    cta
+    on:click={() => $goto("/builder/portal/account/upgrade")}
+    on:click
+  >
     Upgrade
   </Button>
 {/if}

From abd84118d9886568d0fdc7b0ed0a6c4153e3bda9 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Thu, 12 Jan 2023 15:52:37 +0000
Subject: [PATCH 04/26] Hide groups page if disabled at tenant level

---
 .../src/pages/builder/portal/users/_layout.svelte   | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/packages/builder/src/pages/builder/portal/users/_layout.svelte b/packages/builder/src/pages/builder/portal/users/_layout.svelte
index f9c9be94b7..79d749f21c 100644
--- a/packages/builder/src/pages/builder/portal/users/_layout.svelte
+++ b/packages/builder/src/pages/builder/portal/users/_layout.svelte
@@ -2,6 +2,7 @@
   import { Page } from "@budibase/bbui"
   import { SideNav, SideNavItem, Content } from "components/portal/page"
   import { isActive, url } from "@roxi/routify"
+  import { isEnabled, TENANT_FEATURE_FLAGS } from "helpers/featureFlags"
 
   $: wide = $isActive("./users/index") || $isActive("./groups/index")
 </script>
@@ -15,11 +16,13 @@
           url={$url("./users")}
           active={$isActive("./users")}
         />
-        <SideNavItem
-          text="Groups"
-          url={$url("./groups")}
-          active={$isActive("./groups")}
-        />
+        {#if isEnabled(TENANT_FEATURE_FLAGS.USER_GROUPS)}
+          <SideNavItem
+            text="Groups"
+            url={$url("./groups")}
+            active={$isActive("./groups")}
+          />
+        {/if}
       </SideNav>
     </div>
     <slot />

From 5d24fe0a13c1543359eafb0976d73f3cc78be084 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Thu, 12 Jan 2023 16:50:43 +0000
Subject: [PATCH 05/26] Centralise menu logic and show full menu on mobile

---
 .../portal/_components/MobileMenu.svelte      |  38 ++++--
 .../src/pages/builder/portal/_layout.svelte   |  61 +--------
 .../builder/portal/account/_layout.svelte     |  35 +----
 .../builder/portal/settings/_layout.svelte    |  30 +----
 .../pages/builder/portal/users/_layout.svelte |  20 +--
 .../pages/builder/portal/users/index.svelte   |   4 +
 packages/builder/src/stores/portal/index.js   |   1 +
 packages/builder/src/stores/portal/menu.js    | 120 ++++++++++++++++++
 8 files changed, 179 insertions(+), 130 deletions(-)
 create mode 100644 packages/builder/src/pages/builder/portal/users/index.svelte
 create mode 100644 packages/builder/src/stores/portal/menu.js

diff --git a/packages/builder/src/pages/builder/portal/_components/MobileMenu.svelte b/packages/builder/src/pages/builder/portal/_components/MobileMenu.svelte
index 8baf7609d0..0077c0acc9 100644
--- a/packages/builder/src/pages/builder/portal/_components/MobileMenu.svelte
+++ b/packages/builder/src/pages/builder/portal/_components/MobileMenu.svelte
@@ -6,9 +6,9 @@
   import UpgradeButton from "./UpgradeButton.svelte"
   import { fade } from "svelte/transition"
   import Logo from "./Logo.svelte"
+  import { menu } from "stores/portal"
 
   export let visible = false
-  export let menu
 
   const dispatch = createEventDispatcher()
 
@@ -28,13 +28,28 @@
       <Logo />
     </div>
     <SideNav>
-      {#each menu as { title, href }}
-        <SideNavItem
-          text={title}
-          url={href}
-          active={$isActive(href)}
-          on:click={close}
-        />
+      {#each $menu as { title, href, subPages }}
+        {#if !subPages?.length}
+          <SideNavItem
+            text={title}
+            url={href}
+            active={$isActive(href)}
+            on:click={close}
+          />
+        {/if}
+      {/each}
+      {#each $menu as { title, href, subPages }}
+        {#if subPages?.length}
+          <div class="category">{title}</div>
+          {#each subPages as { title, href }}
+            <SideNavItem
+              text={title}
+              url={href}
+              active={$isActive(href)}
+              on:click={close}
+            />
+          {/each}
+        {/if}
       {/each}
     </SideNav>
     <div>
@@ -47,6 +62,13 @@
   .mobile-nav {
     display: none;
   }
+  .category {
+    color: var(--spectrum-global-color-gray-600);
+    font-size: var(--font-size-s);
+    margin-left: var(--spacing-m);
+    margin-top: 24px;
+    margin-bottom: 4px;
+  }
 
   @media (max-width: 640px) {
     .mobile-nav-underlay {
diff --git a/packages/builder/src/pages/builder/portal/_layout.svelte b/packages/builder/src/pages/builder/portal/_layout.svelte
index 9048502550..8cc5f5c79e 100644
--- a/packages/builder/src/pages/builder/portal/_layout.svelte
+++ b/packages/builder/src/pages/builder/portal/_layout.svelte
@@ -1,9 +1,8 @@
 <script>
   import { isActive, redirect, goto, url } from "@roxi/routify"
   import { Icon, notifications, Tabs, Tab } from "@budibase/bbui"
-  import { organisation, auth, admin as adminStore } from "stores/portal"
+  import { organisation, auth, menu } from "stores/portal"
   import { onMount } from "svelte"
-  import { isEnabled, TENANT_FEATURE_FLAGS } from "helpers/featureFlags"
   import UpgradeButton from "./_components/UpgradeButton.svelte"
   import MobileMenu from "./_components/MobileMenu.svelte"
   import Logo from "./_components/Logo.svelte"
@@ -13,10 +12,9 @@
   let mobileMenuVisible = false
   let activeTab = "Apps"
 
-  $: menu = buildMenu($auth.isAdmin)
-  $: $url(), updateActiveTab()
+  $: $url(), updateActiveTab($menu)
 
-  const updateActiveTab = () => {
+  const updateActiveTab = menu => {
     for (let entry of menu) {
       if ($isActive(entry.href)) {
         if (activeTab !== entry.title) {
@@ -27,55 +25,6 @@
     }
   }
 
-  const buildMenu = admin => {
-    // Standard user and developer pages
-    let menu = [
-      {
-        title: "Apps",
-        href: "/builder/portal/apps",
-      },
-      {
-        title: "Plugins",
-        href: "/builder/portal/plugins",
-      },
-    ]
-
-    // Admin only pages
-    if (admin) {
-      menu = [
-        {
-          title: "Apps",
-          href: "/builder/portal/apps",
-        },
-        {
-          title: "Users",
-          href: "/builder/portal/users/users",
-        },
-        {
-          title: "Plugins",
-          href: "/builder/portal/plugins",
-        },
-        {
-          title: "Settings",
-          href: "/builder/portal/settings",
-        },
-      ]
-    }
-
-    // Check if allowed access to account section
-    if (
-      isEnabled(TENANT_FEATURE_FLAGS.LICENSING) &&
-      ($auth?.user?.accountPortalAccess || (!$adminStore.cloud && admin))
-    ) {
-      menu.push({
-        title: "Account",
-        href: "/builder/portal/account",
-      })
-    }
-
-    return menu
-  }
-
   const showMobileMenu = () => (mobileMenuVisible = true)
   const hideMobileMenu = () => (mobileMenuVisible = false)
 
@@ -104,7 +53,7 @@
       </div>
       <div class="desktop">
         <Tabs selected={activeTab}>
-          {#each menu as { title, href }}
+          {#each $menu as { title, href }}
             <Tab {title} on:click={() => $goto(href)} />
           {/each}
         </Tabs>
@@ -122,7 +71,7 @@
     <div class="main">
       <slot />
     </div>
-    <MobileMenu visible={mobileMenuVisible} {menu} on:close={hideMobileMenu} />
+    <MobileMenu visible={mobileMenuVisible} on:close={hideMobileMenu} />
   </div>
 {/if}
 
diff --git a/packages/builder/src/pages/builder/portal/account/_layout.svelte b/packages/builder/src/pages/builder/portal/account/_layout.svelte
index f933cf9c72..04db8e50b4 100644
--- a/packages/builder/src/pages/builder/portal/account/_layout.svelte
+++ b/packages/builder/src/pages/builder/portal/account/_layout.svelte
@@ -1,40 +1,19 @@
 <script>
-  import { url, isActive } from "@roxi/routify"
+  import { isActive } from "@roxi/routify"
   import { Page } from "@budibase/bbui"
   import { Content, SideNav, SideNavItem } from "components/portal/page"
-  import { admin, auth } from "stores/portal"
+  import { menu } from "stores/portal"
+
+  $: pages = $menu.find(x => x.title === "Account").subPages
 </script>
 
 <Page narrow>
   <Content>
     <div slot="side-nav">
       <SideNav>
-        <!-- Always show usage in self-host or cloud if licensing enabled-->
-        <SideNavItem
-          text="Usage"
-          url={$url("./usage")}
-          active={$isActive("./usage")}
-        />
-        <!-- Show the relevant hosting upgrade page-->
-        {#if $admin.cloud && $auth?.user?.accountPortalAccess}
-          <SideNavItem
-            text="Upgrade"
-            url={$admin.accountPortalUrl + "/portal/upgrade"}
-          />
-        {:else if !$admin.cloud && admin}
-          <SideNavItem
-            text="Upgrade"
-            url={$url("./upgrade")}
-            active={$isActive("./upgrade")}
-          />
-        {/if}
-        <!-- Show the billing page to licensed account holders in cloud -->
-        {#if $auth?.user?.accountPortalAccess && $auth.user.account.stripeCustomerId}
-          <SideNavItem
-            text="Billing"
-            url={$admin.accountPortalUrl + "/portal/billing"}
-          />
-        {/if}
+        {#each pages as { title, href }}
+          <SideNavItem text={title} url={href} active={$isActive(href)} />
+        {/each}
       </SideNav>
     </div>
     <slot />
diff --git a/packages/builder/src/pages/builder/portal/settings/_layout.svelte b/packages/builder/src/pages/builder/portal/settings/_layout.svelte
index 57410bcaeb..ec26ca5754 100644
--- a/packages/builder/src/pages/builder/portal/settings/_layout.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/_layout.svelte
@@ -1,38 +1,20 @@
 <script>
-  import { url, isActive } from "@roxi/routify"
+  import { isActive } from "@roxi/routify"
   import { Page } from "@budibase/bbui"
   import { Content, SideNav, SideNavItem } from "components/portal/page"
-  import { admin } from "stores/portal"
+  import { menu } from "stores/portal"
 
   $: wide = $isActive("./email/:template")
+  $: pages = $menu.find(x => x.title === "Settings").subPages
 </script>
 
 <Page>
   <Content narrow={!wide}>
     <div slot="side-nav">
       <SideNav>
-        <SideNavItem
-          text="Auth"
-          url={$url("./auth")}
-          active={$isActive("./auth")}
-        />
-        <SideNavItem
-          text="Email"
-          url={$url("./email")}
-          active={$isActive("./email")}
-        />
-        <SideNavItem
-          text="Organisation"
-          url={$url("./organisation")}
-          active={$isActive("./organisation")}
-        />
-        {#if !$admin.cloud}
-          <SideNavItem
-            text="Version"
-            url={$url("./version")}
-            active={$isActive("./version")}
-          />
-        {/if}
+        {#each pages as { title, href }}
+          <SideNavItem text={title} url={href} active={$isActive(href)} />
+        {/each}
       </SideNav>
     </div>
     <slot />
diff --git a/packages/builder/src/pages/builder/portal/users/_layout.svelte b/packages/builder/src/pages/builder/portal/users/_layout.svelte
index 79d749f21c..97de1eeabf 100644
--- a/packages/builder/src/pages/builder/portal/users/_layout.svelte
+++ b/packages/builder/src/pages/builder/portal/users/_layout.svelte
@@ -1,28 +1,20 @@
 <script>
   import { Page } from "@budibase/bbui"
   import { SideNav, SideNavItem, Content } from "components/portal/page"
-  import { isActive, url } from "@roxi/routify"
-  import { isEnabled, TENANT_FEATURE_FLAGS } from "helpers/featureFlags"
+  import { isActive } from "@roxi/routify"
+  import { menu } from "stores/portal"
 
   $: wide = $isActive("./users/index") || $isActive("./groups/index")
+  $: pages = $menu.find(x => x.title === "Users").subPages
 </script>
 
 <Page>
   <Content narrow={!wide}>
     <div slot="side-nav">
       <SideNav>
-        <SideNavItem
-          text="Users"
-          url={$url("./users")}
-          active={$isActive("./users")}
-        />
-        {#if isEnabled(TENANT_FEATURE_FLAGS.USER_GROUPS)}
-          <SideNavItem
-            text="Groups"
-            url={$url("./groups")}
-            active={$isActive("./groups")}
-          />
-        {/if}
+        {#each pages as { title, href }}
+          <SideNavItem text={title} url={href} active={$isActive(href)} />
+        {/each}
       </SideNav>
     </div>
     <slot />
diff --git a/packages/builder/src/pages/builder/portal/users/index.svelte b/packages/builder/src/pages/builder/portal/users/index.svelte
new file mode 100644
index 0000000000..4dbb81f7c6
--- /dev/null
+++ b/packages/builder/src/pages/builder/portal/users/index.svelte
@@ -0,0 +1,4 @@
+<script>
+  import { redirect } from "@roxi/routify"
+  $redirect("./users")
+</script>
diff --git a/packages/builder/src/stores/portal/index.js b/packages/builder/src/stores/portal/index.js
index 81d26b900e..9a27604034 100644
--- a/packages/builder/src/stores/portal/index.js
+++ b/packages/builder/src/stores/portal/index.js
@@ -11,3 +11,4 @@ export { groups } from "./groups"
 export { plugins } from "./plugins"
 export { backups } from "./backups"
 export { overview } from "./overview"
+export { menu } from "./menu"
diff --git a/packages/builder/src/stores/portal/menu.js b/packages/builder/src/stores/portal/menu.js
new file mode 100644
index 0000000000..54ed4bdba8
--- /dev/null
+++ b/packages/builder/src/stores/portal/menu.js
@@ -0,0 +1,120 @@
+import { derived } from "svelte/store"
+import { isEnabled, TENANT_FEATURE_FLAGS } from "helpers/featureFlags"
+import { admin } from "./admin"
+import { auth } from "./auth"
+
+export const menu = derived([admin, auth], ([$admin, $auth]) => {
+  // Standard user and developer pages
+  let menu = [
+    {
+      title: "Apps",
+      href: "/builder/portal/apps",
+    },
+    {
+      title: "Plugins",
+      href: "/builder/portal/plugins",
+    },
+  ]
+
+  // Admin only pages
+  if ($auth.isAdmin) {
+    // Determine user sub pages
+    let userSubPages = [
+      {
+        title: "Users",
+        href: "/builder/portal/users/users",
+      },
+    ]
+    if (isEnabled(TENANT_FEATURE_FLAGS.USER_GROUPS)) {
+      userSubPages.push({
+        title: "Groups",
+        href: "/builder/portal/users/groups",
+      })
+    }
+
+    // Determine settings sub pages
+    let settingsSubPages = [
+      {
+        title: "Auth",
+        href: "/builder/portal/settings/auth",
+      },
+      {
+        title: "Email",
+        href: "/builder/portal/settings/email",
+      },
+      {
+        title: "Organisation",
+        href: "/builder/portal/settings/organisation",
+      },
+    ]
+    if (!$admin.cloud) {
+      settingsSubPages.push({
+        title: "Version",
+        href: "/builder/portal/settings/version",
+      })
+    }
+
+    menu = [
+      {
+        title: "Apps",
+        href: "/builder/portal/apps",
+      },
+      {
+        title: "Users",
+        href: "/builder/portal/users",
+        subPages: userSubPages,
+      },
+      {
+        title: "Plugins",
+        href: "/builder/portal/plugins",
+      },
+      {
+        title: "Settings",
+        href: "/builder/portal/settings",
+        subPages: settingsSubPages,
+      },
+    ]
+  }
+
+  // Check if allowed access to account section
+  if (
+    isEnabled(TENANT_FEATURE_FLAGS.LICENSING) &&
+    ($auth?.user?.accountPortalAccess || (!$admin.cloud && $auth.isAdmin))
+  ) {
+    // Determine account sub pages
+    let accountSubPages = [
+      {
+        title: "Usage",
+        href: "/builder/portal/account/usage",
+      },
+    ]
+    if ($admin.cloud && $auth?.user?.accountPortalAccess) {
+      accountSubPages.push({
+        title: "Upgrade",
+        href: $admin.accountPortalUrl + "/portal/upgrade",
+      })
+    } else if (!$admin.cloud && admin) {
+      accountSubPages.push({
+        title: "Upgrade",
+        href: "/builder/portal/account/upgrade",
+      })
+    }
+    if (
+      $auth?.user?.accountPortalAccess &&
+      $auth.user.account.stripeCustomerId
+    ) {
+      accountSubPages.push({
+        title: "Billing",
+        href: $admin.accountPortalUrl + "/portal/billing",
+      })
+    }
+
+    menu.push({
+      title: "Account",
+      href: "/builder/portal/account",
+      subPages: accountSubPages,
+    })
+  }
+
+  return menu
+})

From 4e4b074635b477a16c399d4a68fc0156755036a9 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Thu, 12 Jan 2023 17:04:05 +0000
Subject: [PATCH 06/26] Update app access assignment and fix backups table

---
 .../src/pages/builder/apps/index.svelte       |  2 +-
 .../apps/_components/AcessFilter.svelte       | 49 -------------------
 .../access/_components/AssignmentModal.svelte | 23 +++++----
 .../overview/[appId]/access/index.svelte      | 30 +++++++++---
 .../overview/[appId]/backups/index.svelte     |  2 +-
 5 files changed, 40 insertions(+), 66 deletions(-)
 delete mode 100644 packages/builder/src/pages/builder/portal/apps/_components/AcessFilter.svelte

diff --git a/packages/builder/src/pages/builder/apps/index.svelte b/packages/builder/src/pages/builder/apps/index.svelte
index ad1b5ec7f8..001bf43b50 100644
--- a/packages/builder/src/pages/builder/apps/index.svelte
+++ b/packages/builder/src/pages/builder/apps/index.svelte
@@ -104,7 +104,7 @@
                 <Icon size="XL" name="ChevronDown" />
               </div>
               <MenuItem icon="UserEdit" on:click={() => userInfoModal.show()}>
-                Update user information
+                My profile
               </MenuItem>
               <MenuItem
                 icon="LockClosed"
diff --git a/packages/builder/src/pages/builder/portal/apps/_components/AcessFilter.svelte b/packages/builder/src/pages/builder/portal/apps/_components/AcessFilter.svelte
deleted file mode 100644
index 08cadc694e..0000000000
--- a/packages/builder/src/pages/builder/portal/apps/_components/AcessFilter.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-<script>
-  import { PickerDropdown } from "@budibase/bbui"
-  import { groups } from "stores/portal"
-  import { createEventDispatcher } from "svelte"
-
-  const dispatch = createEventDispatcher()
-
-  let filter = null
-  $: filteredGroups = !filter
-    ? $groups
-    : $groups.filter(group =>
-        group.name?.toLowerCase().includes(filter.toLowerCase())
-      )
-
-  $: optionSections = {
-    groups: {
-      data: filteredGroups,
-      getLabel: group => group.name,
-      getValue: group => group._id,
-      getIcon: group => group.icon,
-      getColour: group => group.color,
-    },
-  }
-
-  $: onChange = selected => {
-    const { detail } = selected
-    if (!detail || Object.keys(detail).length == 0) {
-      dispatch("change", null)
-      return
-    }
-
-    const groupSelected = $groups.find(x => x._id === detail)
-    const appRoleIds = groupSelected?.roles
-      ? Object.keys(groupSelected?.roles)
-      : []
-    dispatch("change", appRoleIds)
-  }
-</script>
-
-<PickerDropdown
-  autocomplete
-  bind:searchTerm={filter}
-  primaryOptions={optionSections}
-  placeholder={"Filter by access"}
-  on:pickprimary={onChange}
-  on:closed={() => {
-    filter = null
-  }}
-/>
diff --git a/packages/builder/src/pages/builder/portal/overview/[appId]/access/_components/AssignmentModal.svelte b/packages/builder/src/pages/builder/portal/overview/[appId]/access/_components/AssignmentModal.svelte
index 0cb8085bb0..37143e25c1 100644
--- a/packages/builder/src/pages/builder/portal/overview/[appId]/access/_components/AssignmentModal.svelte
+++ b/packages/builder/src/pages/builder/portal/overview/[appId]/access/_components/AssignmentModal.svelte
@@ -14,6 +14,8 @@
 
   export let app
   export let appUsers = []
+  export let showUsers = false
+  export let showGroups = false
 
   const dispatch = createEventDispatcher()
   const usersFetch = fetchData({
@@ -41,7 +43,8 @@
   $: availableGroups = getAvailableGroups($groups, app.appId, search, data)
   $: valid = data?.length && !data?.some(x => !x.id?.length || !x.role?.length)
   $: optionSections = {
-    ...($licensing.groupsEnabled &&
+    ...(showGroups &&
+      $licensing.groupsEnabled &&
       availableGroups.length && {
         ["User groups"]: {
           data: availableGroups,
@@ -51,13 +54,15 @@
           getColour: group => group.color,
         },
       }),
-    users: {
-      data: availableUsers,
-      getLabel: user => user.email,
-      getValue: user => user._id,
-      getIcon: user => user.icon,
-      getColour: user => user.color,
-    },
+    ...(showUsers && {
+      users: {
+        data: availableUsers,
+        getLabel: user => user.email,
+        getValue: user => user._id,
+        getIcon: user => user.icon,
+        getColour: user => user.color,
+      },
+    }),
   }
 
   const addData = async appData => {
@@ -185,7 +190,7 @@
     </Layout>
   {/if}
   <div>
-    <ActionButton on:click={addNewInput} icon="Add">Add email</ActionButton>
+    <ActionButton on:click={addNewInput} icon="Add">Add more</ActionButton>
   </div>
 </ModalContent>
 
diff --git a/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte b/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte
index c17efdb075..43eea4aaa6 100644
--- a/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte
+++ b/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte
@@ -36,7 +36,7 @@
     },
     role: {
       displayName: "Access",
-      width: "160px",
+      width: "150px",
       borderLeft: true,
     },
   }
@@ -50,6 +50,8 @@
   let assignmentModal
   let appGroups
   let appUsers
+  let showAddUsers = false
+  let showAddGroups = false
 
   $: app = $overview.selectedApp
   $: devAppId = app.devId
@@ -153,6 +155,18 @@
     await usersFetch.refresh()
   }
 
+  const showUsersModal = () => {
+    showAddUsers = true
+    showAddGroups = false
+    assignmentModal.show()
+  }
+
+  const showGroupsModal = () => {
+    showAddUsers = false
+    showAddGroups = true
+    assignmentModal.show()
+  }
+
   setContext("roles", {
     updateRole,
     removeRole,
@@ -178,7 +192,7 @@
       <Layout noPadding gap="S">
         <div class="title">
           <Heading size="S">Users</Heading>
-          <Button secondary on:click={assignmentModal.show}>Assign user</Button>
+          <Button secondary on:click={showUsersModal}>Assign user</Button>
         </div>
         <Table
           customPlaceholder
@@ -207,9 +221,7 @@
       <Layout noPadding gap="S">
         <div class="title">
           <Heading size="S">Groups</Heading>
-          <Button secondary on:click={assignmentModal.show}>
-            Assign group
-          </Button>
+          <Button secondary on:click={showGroupsModal}>Assign group</Button>
         </div>
         <Table
           customPlaceholder
@@ -228,7 +240,13 @@
 </Layout>
 
 <Modal bind:this={assignmentModal}>
-  <AssignmentModal {app} {appUsers} on:update={usersFetch.refresh} />
+  <AssignmentModal
+    {app}
+    {appUsers}
+    on:update={usersFetch.refresh}
+    showGroups={showAddGroups}
+    showUsers={showAddUsers}
+  />
 </Modal>
 
 <style>
diff --git a/packages/builder/src/pages/builder/portal/overview/[appId]/backups/index.svelte b/packages/builder/src/pages/builder/portal/overview/[appId]/backups/index.svelte
index 42e3cd19a9..136d529f2e 100644
--- a/packages/builder/src/pages/builder/portal/overview/[appId]/backups/index.svelte
+++ b/packages/builder/src/pages/builder/portal/overview/[appId]/backups/index.svelte
@@ -90,7 +90,7 @@
     },
     actions: {
       displayName: null,
-      width: "5%",
+      width: "auto",
     },
   }
 

From 0f47d8da385ad8b53bf54df848bf37cd32db398f Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 08:28:21 +0000
Subject: [PATCH 07/26] Ensure avatars cannot be squished

---
 packages/bbui/src/Avatar/Avatar.svelte | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/bbui/src/Avatar/Avatar.svelte b/packages/bbui/src/Avatar/Avatar.svelte
index 136a4fe24b..1e4cefd8ce 100644
--- a/packages/bbui/src/Avatar/Avatar.svelte
+++ b/packages/bbui/src/Avatar/Avatar.svelte
@@ -58,5 +58,6 @@
     overflow: hidden;
     user-select: none;
     text-transform: uppercase;
+    flex-shrink: 0;
   }
 </style>

From 1d9ab4163ff3e75167ddabb9d4805112e7c9568d Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 08:28:33 +0000
Subject: [PATCH 08/26] Standardise disabled field text colour

---
 packages/bbui/src/Form/Core/TextField.svelte | 4 ----
 packages/bbui/src/bbui.css                   | 3 ++-
 2 files changed, 2 insertions(+), 5 deletions(-)

diff --git a/packages/bbui/src/Form/Core/TextField.svelte b/packages/bbui/src/Form/Core/TextField.svelte
index 0a723c140a..6a64876a2c 100644
--- a/packages/bbui/src/Form/Core/TextField.svelte
+++ b/packages/bbui/src/Form/Core/TextField.svelte
@@ -112,8 +112,4 @@
   .spectrum-Textfield {
     width: 100%;
   }
-  input:disabled {
-    color: var(--spectrum-global-color-gray-600) !important;
-    -webkit-text-fill-color: var(--spectrum-global-color-gray-600) !important;
-  }
 </style>
diff --git a/packages/bbui/src/bbui.css b/packages/bbui/src/bbui.css
index b3213ef694..ef3483d3df 100644
--- a/packages/bbui/src/bbui.css
+++ b/packages/bbui/src/bbui.css
@@ -40,7 +40,6 @@
   --rounded-medium: 8px;
   --rounded-large: 16px;
 
-
   --font-sans: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, "Inter",
     "Helvetica Neue", Arial, "Noto Sans", sans-serif;
   --font-accent: "Source Sans Pro", -apple-system, BlinkMacSystemFont, Segoe UI, "Inter",
@@ -92,6 +91,8 @@
   --border-light-2: 2px var(--grey-3) solid;
   --border-blue: 2px var(--blue) solid;
   --border-transparent: 2px transparent solid;
+
+  --spectrum-alias-text-color-disabled: var(--spectrum-global-color-gray-600);
 }
 
 a {

From e23f7dde47bc984faabee256141e7d36d9e7f46b Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 08:28:54 +0000
Subject: [PATCH 09/26] Allow developer users to access users, groups and usage
 pages

---
 packages/builder/src/stores/portal/menu.js | 75 +++++++++-------------
 1 file changed, 29 insertions(+), 46 deletions(-)

diff --git a/packages/builder/src/stores/portal/menu.js b/packages/builder/src/stores/portal/menu.js
index 54ed4bdba8..29fd6144f5 100644
--- a/packages/builder/src/stores/portal/menu.js
+++ b/packages/builder/src/stores/portal/menu.js
@@ -4,35 +4,39 @@ import { admin } from "./admin"
 import { auth } from "./auth"
 
 export const menu = derived([admin, auth], ([$admin, $auth]) => {
-  // Standard user and developer pages
+  // Determine user sub pages
+  let userSubPages = [
+    {
+      title: "Users",
+      href: "/builder/portal/users/users",
+    },
+  ]
+  if (isEnabled(TENANT_FEATURE_FLAGS.USER_GROUPS)) {
+    userSubPages.push({
+      title: "Groups",
+      href: "/builder/portal/users/groups",
+    })
+  }
+
+  // Pages that all devs and admins can access
   let menu = [
     {
       title: "Apps",
       href: "/builder/portal/apps",
     },
+    {
+      title: "Users",
+      href: "/builder/portal/users",
+      subPages: userSubPages,
+    },
     {
       title: "Plugins",
       href: "/builder/portal/plugins",
     },
   ]
 
-  // Admin only pages
+  // Add settings page for admins
   if ($auth.isAdmin) {
-    // Determine user sub pages
-    let userSubPages = [
-      {
-        title: "Users",
-        href: "/builder/portal/users/users",
-      },
-    ]
-    if (isEnabled(TENANT_FEATURE_FLAGS.USER_GROUPS)) {
-      userSubPages.push({
-        title: "Groups",
-        href: "/builder/portal/users/groups",
-      })
-    }
-
-    // Determine settings sub pages
     let settingsSubPages = [
       {
         title: "Auth",
@@ -53,35 +57,15 @@ export const menu = derived([admin, auth], ([$admin, $auth]) => {
         href: "/builder/portal/settings/version",
       })
     }
-
-    menu = [
-      {
-        title: "Apps",
-        href: "/builder/portal/apps",
-      },
-      {
-        title: "Users",
-        href: "/builder/portal/users",
-        subPages: userSubPages,
-      },
-      {
-        title: "Plugins",
-        href: "/builder/portal/plugins",
-      },
-      {
-        title: "Settings",
-        href: "/builder/portal/settings",
-        subPages: settingsSubPages,
-      },
-    ]
+    menu.push({
+      title: "Settings",
+      href: "/builder/portal/settings",
+      subPages: settingsSubPages,
+    })
   }
 
-  // Check if allowed access to account section
-  if (
-    isEnabled(TENANT_FEATURE_FLAGS.LICENSING) &&
-    ($auth?.user?.accountPortalAccess || (!$admin.cloud && $auth.isAdmin))
-  ) {
-    // Determine account sub pages
+  // Add account page
+  if (isEnabled(TENANT_FEATURE_FLAGS.LICENSING)) {
     let accountSubPages = [
       {
         title: "Usage",
@@ -93,7 +77,7 @@ export const menu = derived([admin, auth], ([$admin, $auth]) => {
         title: "Upgrade",
         href: $admin.accountPortalUrl + "/portal/upgrade",
       })
-    } else if (!$admin.cloud && admin) {
+    } else if (!$admin.cloud && $auth.isAdmin) {
       accountSubPages.push({
         title: "Upgrade",
         href: "/builder/portal/account/upgrade",
@@ -108,7 +92,6 @@ export const menu = derived([admin, auth], ([$admin, $auth]) => {
         href: $admin.accountPortalUrl + "/portal/billing",
       })
     }
-
     menu.push({
       title: "Account",
       href: "/builder/portal/account",

From ad4133a77785e21a32ab8d100e2ebebac0d491fe Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 08:29:18 +0000
Subject: [PATCH 10/26] Allow readonly access to users and groups for developer
 users

---
 .../pages/builder/portal/account/usage.svelte | 13 ++++--
 .../portal/users/groups/[groupId].svelte      | 31 ++++++++------
 .../RemoveUserTableRenderer.svelte            |  5 ++-
 .../builder/portal/users/groups/index.svelte  |  5 ++-
 .../portal/users/users/[userId].svelte        | 41 +++++++++++++------
 .../RemoveGroupTableRenderer.svelte           |  5 ++-
 .../builder/portal/users/users/index.svelte   | 14 +++++--
 7 files changed, 78 insertions(+), 36 deletions(-)

diff --git a/packages/builder/src/pages/builder/portal/account/usage.svelte b/packages/builder/src/pages/builder/portal/account/usage.svelte
index f75b6801fc..c541e66fb1 100644
--- a/packages/builder/src/pages/builder/portal/account/usage.svelte
+++ b/packages/builder/src/pages/builder/portal/account/usage.svelte
@@ -184,10 +184,15 @@
       </Body>
     </Layout>
     <Divider />
-    <Body>
-      To upgrade your plan and usage limits visit your
-      <Link size="L" on:click={goToAccountPortal}>account</Link>.
-    </Body>
+    {#if $auth?.user?.accountPortalAccess}
+      <Body>
+        To upgrade your plan and usage limits visit your
+        <Link size="L" on:click={goToAccountPortal}>account</Link>.
+      </Body>
+    {:else}
+      <Body>Contact your account holder to upgrade your plan.</Body>
+    {/if}
+
     <DashCard
       description="YOUR CURRENT PLAN"
       title={planTitle()}
diff --git a/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte b/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte
index 4846fdeeb3..5299e5469b 100644
--- a/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte
+++ b/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte
@@ -14,7 +14,7 @@
   } from "@budibase/bbui"
   import UserGroupPicker from "components/settings/UserGroupPicker.svelte"
   import { createPaginationStore } from "helpers/pagination"
-  import { users, apps, groups } from "stores/portal"
+  import { users, apps, groups, auth } from "stores/portal"
   import { onMount, setContext } from "svelte"
   import { roles } from "stores/backend"
   import ConfirmDialog from "components/common/ConfirmDialog.svelte"
@@ -70,6 +70,7 @@
   let loaded = false
   let editModal, deleteModal
 
+  $: readonly = !$auth.isAdmin
   $: page = $pageInfo.page
   $: fetchUsers(page, searchTerm)
   $: group = $groups.find(x => x._id === groupId)
@@ -164,24 +165,28 @@
     <div class="header">
       <GroupIcon {group} size="L" />
       <Heading>{group?.name}</Heading>
-      <ActionMenu align="right">
-        <span slot="control">
-          <Icon hoverable name="More" />
-        </span>
-        <MenuItem icon="Refresh" on:click={() => editModal.show()}>
-          Edit
-        </MenuItem>
-        <MenuItem icon="Delete" on:click={() => deleteModal.show()}>
-          Delete
-        </MenuItem>
-      </ActionMenu>
+      {#if !readonly}
+        <ActionMenu align="right">
+          <span slot="control">
+            <Icon hoverable name="More" />
+          </span>
+          <MenuItem icon="Refresh" on:click={() => editModal.show()}>
+            Edit
+          </MenuItem>
+          <MenuItem icon="Delete" on:click={() => deleteModal.show()}>
+            Delete
+          </MenuItem>
+        </ActionMenu>
+      {/if}
     </div>
 
     <Layout noPadding gap="S">
       <div class="header">
         <Heading size="S">Users</Heading>
         <div bind:this={popoverAnchor}>
-          <Button on:click={popover.show()} cta>Add user</Button>
+          <Button disabled={readonly} on:click={popover.show()} cta
+            >Add user</Button
+          >
         </div>
         <Popover align="right" bind:this={popover} anchor={popoverAnchor}>
           <UserGroupPicker
diff --git a/packages/builder/src/pages/builder/portal/users/groups/_components/RemoveUserTableRenderer.svelte b/packages/builder/src/pages/builder/portal/users/groups/_components/RemoveUserTableRenderer.svelte
index dcf947d4fe..1efd60a50d 100644
--- a/packages/builder/src/pages/builder/portal/users/groups/_components/RemoveUserTableRenderer.svelte
+++ b/packages/builder/src/pages/builder/portal/users/groups/_components/RemoveUserTableRenderer.svelte
@@ -1,6 +1,7 @@
 <script>
   import { ActionButton } from "@budibase/bbui"
   import { getContext } from "svelte"
+  import { auth } from "stores/portal"
 
   export let value
 
@@ -12,4 +13,6 @@
   }
 </script>
 
-<ActionButton size="S" on:click={onClick}>Remove</ActionButton>
+<ActionButton disabled={!$auth.isAdmin} size="S" on:click={onClick}>
+  Remove
+</ActionButton>
diff --git a/packages/builder/src/pages/builder/portal/users/groups/index.svelte b/packages/builder/src/pages/builder/portal/users/groups/index.svelte
index 25c8702f6b..43561d2d30 100644
--- a/packages/builder/src/pages/builder/portal/users/groups/index.svelte
+++ b/packages/builder/src/pages/builder/portal/users/groups/index.svelte
@@ -39,6 +39,7 @@
     { column: "roles", component: GroupAppsTableRenderer },
   ]
 
+  $: readonly = !$auth.isAdmin
   $: schema = {
     name: { displayName: "Group", width: "2fr", minWidth: "200px" },
     users: { sortable: false, width: "1fr" },
@@ -108,7 +109,9 @@
     <ButtonGroup>
       {#if $licensing.groupsEnabled}
         <!--Show the group create button-->
-        <Button cta on:click={showCreateGroupModal}>Add group</Button>
+        <Button disabled={readonly} cta on:click={showCreateGroupModal}>
+          Add group
+        </Button>
       {:else}
         <Button
           primary
diff --git a/packages/builder/src/pages/builder/portal/users/users/[userId].svelte b/packages/builder/src/pages/builder/portal/users/users/[userId].svelte
index 4c21c03ebf..9498472f66 100644
--- a/packages/builder/src/pages/builder/portal/users/users/[userId].svelte
+++ b/packages/builder/src/pages/builder/portal/users/users/[userId].svelte
@@ -81,6 +81,7 @@
   let user
   let loaded = false
 
+  $: readonly = !$auth.isAdmin
   $: fullName = user?.firstName ? user?.firstName + " " + user?.lastName : ""
   $: privileged = user?.admin?.global || user?.builder?.global
   $: nameLabel = getNameLabel(user)
@@ -235,18 +236,16 @@
     </Breadcrumbs>
 
     <div class="title">
-      <div>
-        <div style="display: flex;">
-          <Avatar size="XXL" {initials} />
-          <div class="subtitle">
-            <Heading size="M">{nameLabel}</Heading>
-            {#if nameLabel !== user?.email}
-              <Body size="S">{user?.email}</Body>
-            {/if}
-          </div>
+      <div class="user-info">
+        <Avatar size="XXL" {initials} />
+        <div class="subtitle">
+          <Heading size="M">{nameLabel}</Heading>
+          {#if nameLabel !== user?.email}
+            <Body size="S">{user?.email}</Body>
+          {/if}
         </div>
       </div>
-      {#if userId !== $auth.user?._id}
+      {#if userId !== $auth.user?._id && !readonly}
         <div>
           <ActionMenu align="right">
             <span slot="control">
@@ -271,17 +270,26 @@
         </div>
         <div class="field">
           <Label size="L">First name</Label>
-          <Input value={user?.firstName} on:blur={updateUserFirstName} />
+          <Input
+            disabled={readonly}
+            value={user?.firstName}
+            on:blur={updateUserFirstName}
+          />
         </div>
         <div class="field">
           <Label size="L">Last name</Label>
-          <Input value={user?.lastName} on:blur={updateUserLastName} />
+          <Input
+            disabled={readonly}
+            value={user?.lastName}
+            on:blur={updateUserLastName}
+          />
         </div>
         <!-- don't let a user remove the privileges that let them be here -->
         {#if userId !== $auth.user._id}
           <div class="field">
             <Label size="L">Role</Label>
             <Select
+              disabled={readonly}
               value={globalRole}
               options={Constants.BudibaseRoleOptions}
               on:change={updateUserRole}
@@ -297,7 +305,9 @@
         <div class="tableTitle">
           <Heading size="S">Groups</Heading>
           <div bind:this={popoverAnchor}>
-            <Button on:click={popover.show()} secondary>Add to group</Button>
+            <Button disabled={readonly} on:click={popover.show()} secondary>
+              Add to group
+            </Button>
           </div>
           <Popover align="right" bind:this={popover} anchor={popoverAnchor}>
             <UserGroupPicker
@@ -375,6 +385,11 @@
     align-items: center;
     justify-content: space-between;
   }
+  .user-info {
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+  }
   .tableTitle {
     display: flex;
     justify-content: space-between;
diff --git a/packages/builder/src/pages/builder/portal/users/users/_components/RemoveGroupTableRenderer.svelte b/packages/builder/src/pages/builder/portal/users/users/_components/RemoveGroupTableRenderer.svelte
index afff99da0f..06108f1fb1 100644
--- a/packages/builder/src/pages/builder/portal/users/users/_components/RemoveGroupTableRenderer.svelte
+++ b/packages/builder/src/pages/builder/portal/users/users/_components/RemoveGroupTableRenderer.svelte
@@ -1,6 +1,7 @@
 <script>
   import { ActionButton } from "@budibase/bbui"
   import { getContext } from "svelte"
+  import { auth } from "stores/portal"
 
   export let value
 
@@ -12,4 +13,6 @@
   }
 </script>
 
-<ActionButton size="S" on:click={onClick}>Remove</ActionButton>
+<ActionButton disabled={!$auth.isAdmin} size="S" on:click={onClick}>
+  Remove
+</ActionButton>
diff --git a/packages/builder/src/pages/builder/portal/users/users/index.svelte b/packages/builder/src/pages/builder/portal/users/users/index.svelte
index ba49bb2946..c8f736e465 100644
--- a/packages/builder/src/pages/builder/portal/users/users/index.svelte
+++ b/packages/builder/src/pages/builder/portal/users/users/index.svelte
@@ -52,6 +52,7 @@
   ]
   let userData = []
 
+  $: readonly = !$auth.isAdmin
   $: debouncedUpdateFetch(searchEmail)
   $: schema = {
     email: {
@@ -223,10 +224,17 @@
     <Divider />
     <div class="controls">
       <ButtonGroup>
-        <Button dataCy="add-user" on:click={createUserModal.show} cta>
+        <Button
+          disabled={readonly}
+          dataCy="add-user"
+          on:click={createUserModal.show}
+          cta
+        >
           Add users
         </Button>
-        <Button on:click={importUsersModal.show} secondary>Import</Button>
+        <Button disabled={readonly} on:click={importUsersModal.show} secondary
+          >Import</Button
+        >
       </ButtonGroup>
       <div class="controls-right">
         <Search bind:value={searchEmail} placeholder="Search" />
@@ -247,7 +255,7 @@
       data={enrichedUsers}
       allowEditColumns={false}
       allowEditRows={false}
-      allowSelectRows={true}
+      allowSelectRows={!readonly}
       {customRenderers}
     />
     <div class="pagination">

From 147bdc751c61314c6363560c6ec70445d056b751 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 08:39:39 +0000
Subject: [PATCH 11/26] Remove logs

---
 .../src/pages/builder/portal/users/groups/[groupId].svelte       | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte b/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte
index 5299e5469b..859e266ef0 100644
--- a/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte
+++ b/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte
@@ -85,7 +85,6 @@
       ...app,
       role: group?.roles?.[apps.getProdAppID(app.devId)],
     }))
-  $: console.log(groupApps)
   $: {
     if (loaded && !group?._id) {
       $goto("./")

From 22affb8d5ff8c8a2e0bdc70d8aab7888bef0bed7 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 08:39:52 +0000
Subject: [PATCH 12/26] Improve users page loading experience

---
 .../builder/portal/users/users/index.svelte   | 112 +++++++++---------
 1 file changed, 55 insertions(+), 57 deletions(-)

diff --git a/packages/builder/src/pages/builder/portal/users/users/index.svelte b/packages/builder/src/pages/builder/portal/users/users/index.svelte
index c8f736e465..3bc18f5ddb 100644
--- a/packages/builder/src/pages/builder/portal/users/users/index.svelte
+++ b/packages/builder/src/pages/builder/portal/users/users/index.svelte
@@ -35,7 +35,7 @@
     },
   })
 
-  let loaded = false
+  let groupsLoaded = !$licensing.groupsEnabled || $groups?.length
   let enrichedUsers = []
   let createUserModal,
     inviteConfirmationModal,
@@ -206,69 +206,67 @@
 
   onMount(async () => {
     try {
-      loaded = false
       await groups.actions.init()
-      loaded = true
+      groupsLoaded = true
     } catch (error) {
-      notifications.error("Error fetching User Group data")
+      notifications.error("Error fetching user group data")
     }
   })
 </script>
 
-{#if loaded && $fetch.loaded}
-  <Layout noPadding gap="M">
-    <Layout gap="XS" noPadding>
-      <Heading>Users</Heading>
-      <Body>Add users and control who gets access to your published apps</Body>
-    </Layout>
-    <Divider />
-    <div class="controls">
-      <ButtonGroup>
-        <Button
-          disabled={readonly}
-          dataCy="add-user"
-          on:click={createUserModal.show}
-          cta
-        >
-          Add users
-        </Button>
-        <Button disabled={readonly} on:click={importUsersModal.show} secondary
-          >Import</Button
-        >
-      </ButtonGroup>
-      <div class="controls-right">
-        <Search bind:value={searchEmail} placeholder="Search" />
-        {#if selectedRows.length > 0}
-          <DeleteRowsButton
-            item="user"
-            on:updaterows
-            {selectedRows}
-            {deleteRows}
-          />
-        {/if}
-      </div>
-    </div>
-    <Table
-      on:click={({ detail }) => $goto(`./${detail._id}`)}
-      {schema}
-      bind:selectedRows
-      data={enrichedUsers}
-      allowEditColumns={false}
-      allowEditRows={false}
-      allowSelectRows={!readonly}
-      {customRenderers}
-    />
-    <div class="pagination">
-      <Pagination
-        page={$fetch.pageNumber + 1}
-        hasPrevPage={$fetch.loading ? false : $fetch.hasPrevPage}
-        hasNextPage={$fetch.loading ? false : $fetch.hasNextPage}
-        goToPrevPage={fetch.prevPage}
-        goToNextPage={fetch.nextPage}
-      />
-    </div>
+<Layout noPadding gap="M">
+  <Layout gap="XS" noPadding>
+    <Heading>Users</Heading>
+    <Body>Add users and control who gets access to your published apps</Body>
   </Layout>
-{/if}
+  <Divider />
+  <div class="controls">
+    <ButtonGroup>
+      <Button
+        disabled={readonly}
+        dataCy="add-user"
+        on:click={createUserModal.show}
+        cta
+      >
+        Add users
+      </Button>
+      <Button disabled={readonly} on:click={importUsersModal.show} secondary>
+        Import
+      </Button>
+    </ButtonGroup>
+    <div class="controls-right">
+      <Search bind:value={searchEmail} placeholder="Search" />
+      {#if selectedRows.length > 0}
+        <DeleteRowsButton
+          item="user"
+          on:updaterows
+          {selectedRows}
+          {deleteRows}
+        />
+      {/if}
+    </div>
+  </div>
+  <Table
+    on:click={({ detail }) => $goto(`./${detail._id}`)}
+    {schema}
+    bind:selectedRows
+    data={enrichedUsers}
+    allowEditColumns={false}
+    allowEditRows={false}
+    allowSelectRows={!readonly}
+    {customRenderers}
+    loading={!$fetch.loaded || !groupsLoaded}
+  />
+  <div class="pagination">
+    <Pagination
+      page={$fetch.pageNumber + 1}
+      hasPrevPage={$fetch.loading ? false : $fetch.hasPrevPage}
+      hasNextPage={$fetch.loading ? false : $fetch.hasNextPage}
+      goToPrevPage={fetch.prevPage}
+      goToNextPage={fetch.nextPage}
+    />
+  </div>
+</Layout>
 
 <Modal bind:this={createUserModal}>
   <AddUserModal {showOnboardingTypeModal} />

From f5936f2583543e58f7b6a2fc5e3616a85512fa2a Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 08:47:15 +0000
Subject: [PATCH 13/26] Improve responsiveness on apps list page and fix
 discussions link styles

---
 packages/builder/src/components/common/HelpIcon.svelte     | 1 +
 .../builder/src/pages/builder/portal/apps/index.svelte     | 7 +++++++
 2 files changed, 8 insertions(+)

diff --git a/packages/builder/src/components/common/HelpIcon.svelte b/packages/builder/src/components/common/HelpIcon.svelte
index bb3256792e..50434b7b16 100644
--- a/packages/builder/src/components/common/HelpIcon.svelte
+++ b/packages/builder/src/components/common/HelpIcon.svelte
@@ -31,6 +31,7 @@
     bottom: var(--spacing-m);
     right: var(--spacing-m);
     border-radius: 55%;
+    z-index: 99999;
   }
   .hidden {
     display: none;
diff --git a/packages/builder/src/pages/builder/portal/apps/index.svelte b/packages/builder/src/pages/builder/portal/apps/index.svelte
index 8efa4b7271..f073693a49 100644
--- a/packages/builder/src/pages/builder/portal/apps/index.svelte
+++ b/packages/builder/src/pages/builder/portal/apps/index.svelte
@@ -346,6 +346,10 @@
     justify-content: flex-start;
     align-items: center;
     gap: var(--spacing-xl);
+    flex-wrap: wrap;
+  }
+  .app-actions :global(.spectrum-Textfield) {
+    max-width: 180px;
   }
 
   .app-table {
@@ -380,6 +384,9 @@
       margin-top: var(--spacing-xl);
       margin-bottom: calc(-1 * var(--spacing-m));
     }
+    .app-actions :global(.spectrum-Textfield) {
+      max-width: none;
+    }
     /*  Hide download apps icon */
     .app-actions :global(> .spectrum-Icon) {
       display: none;

From 31431ac98cf322907f8578faa65d096d148be448 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 09:25:12 +0000
Subject: [PATCH 14/26] Update spacing on user and group detail page and fix
 usage page showing wrong copy

---
 .../builder/src/pages/builder/portal/account/usage.svelte     | 4 +++-
 .../src/pages/builder/portal/users/groups/[groupId].svelte    | 2 +-
 .../src/pages/builder/portal/users/users/[userId].svelte      | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/builder/src/pages/builder/portal/account/usage.svelte b/packages/builder/src/pages/builder/portal/account/usage.svelte
index c541e66fb1..c502d35f79 100644
--- a/packages/builder/src/pages/builder/portal/account/usage.svelte
+++ b/packages/builder/src/pages/builder/portal/account/usage.svelte
@@ -32,6 +32,8 @@
   $: license = $auth.user?.license
   $: accountPortalAccess = $auth?.user?.accountPortalAccess
   $: quotaReset = quotaUsage?.quotaReset
+  $: canManagePlan =
+    ($admin.cloud && accountPortalAccess) || (!$admin.cloud && $auth.isAdmin)
 
   const setMonthlyUsage = () => {
     monthlyUsage = []
@@ -184,7 +186,7 @@
       </Body>
     </Layout>
     <Divider />
-    {#if $auth?.user?.accountPortalAccess}
+    {#if canManagePlan}
       <Body>
         To upgrade your plan and usage limits visit your
         <Link size="L" on:click={goToAccountPortal}>account</Link>.
diff --git a/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte b/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte
index 859e266ef0..ee584dd71b 100644
--- a/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte
+++ b/packages/builder/src/pages/builder/portal/users/groups/[groupId].svelte
@@ -250,7 +250,7 @@
     flex-direction: row;
     justify-content: flex-start;
     align-items: center;
-    gap: var(--spacing-m);
+    gap: var(--spacing-l);
   }
   .header :global(.spectrum-Heading) {
     flex: 1 1 auto;
diff --git a/packages/builder/src/pages/builder/portal/users/users/[userId].svelte b/packages/builder/src/pages/builder/portal/users/users/[userId].svelte
index 9498472f66..26a1d25f44 100644
--- a/packages/builder/src/pages/builder/portal/users/users/[userId].svelte
+++ b/packages/builder/src/pages/builder/portal/users/users/[userId].svelte
@@ -389,6 +389,7 @@
     display: flex;
     align-items: center;
     justify-content: flex-start;
+    gap: var(--spacing-l);
   }
   .tableTitle {
     display: flex;
@@ -396,7 +397,6 @@
     align-items: flex-end;
   }
   .subtitle {
-    padding: 0 0 0 var(--spacing-m);
     display: flex;
     flex-direction: column;
     justify-content: center;

From 66c6b6dec3ffca124f8231305315c8d37d4b9338 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 09:26:35 +0000
Subject: [PATCH 15/26] Fix logo override not working

---
 .../src/pages/builder/portal/_components/Logo.svelte       | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/builder/src/pages/builder/portal/_components/Logo.svelte b/packages/builder/src/pages/builder/portal/_components/Logo.svelte
index 8276510201..811e4a162a 100644
--- a/packages/builder/src/pages/builder/portal/_components/Logo.svelte
+++ b/packages/builder/src/pages/builder/portal/_components/Logo.svelte
@@ -1,9 +1,14 @@
 <script>
   import Logo from "assets/bb-emblem.svg"
   import { goto } from "@roxi/routify"
+  import { organisation } from "stores/portal"
 </script>
 
-<img src={Logo} alt="Budibase Logo" on:click={() => $goto("./apps")} />
+<img
+  src={$organisation.logoUrl || Logo}
+  alt="Budibase Logo"
+  on:click={() => $goto("./apps")}
+/>
 
 <style>
   img {

From 846b470c85cc23de0b6552128378088d554ec60a Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 11:57:30 +0000
Subject: [PATCH 16/26] Pin minio version to an old one that supports the fs
 backend in dev

---
 hosting/docker-compose.dev.yaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/hosting/docker-compose.dev.yaml b/hosting/docker-compose.dev.yaml
index 1626d520b6..9e0ede07bf 100644
--- a/hosting/docker-compose.dev.yaml
+++ b/hosting/docker-compose.dev.yaml
@@ -6,7 +6,7 @@ services:
   minio-service:
     container_name: budi-minio-dev
     restart: on-failure
-    image: minio/minio
+    image: minio/minio:RELEASE.2022-10-24T18-35-07Z
     volumes:
       - minio_data:/data
     ports:

From 9daa4be01f35c3438374396633e43d51fd8d1fcd Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 11:57:46 +0000
Subject: [PATCH 17/26] Shrink upgrade button

---
 .../src/pages/builder/portal/_components/UpgradeButton.svelte    | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte b/packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte
index f1d8b5c762..3e095dce21 100644
--- a/packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte
+++ b/packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte
@@ -17,6 +17,7 @@
 {:else if !$admin.cloud && $auth.isAdmin}
   <Button
     cta
+    size="S"
     on:click={() => $goto("/builder/portal/account/upgrade")}
     on:click
   >

From 2812973eeadc57fc194170472fa769c32a6d3b48 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 11:57:57 +0000
Subject: [PATCH 18/26] Shrink user dropdown

---
 .../src/pages/builder/portal/_components/UserDropdown.svelte    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/builder/src/pages/builder/portal/_components/UserDropdown.svelte b/packages/builder/src/pages/builder/portal/_components/UserDropdown.svelte
index 552e9247fc..44bd3adf0c 100644
--- a/packages/builder/src/pages/builder/portal/_components/UserDropdown.svelte
+++ b/packages/builder/src/pages/builder/portal/_components/UserDropdown.svelte
@@ -23,7 +23,7 @@
 
 <ActionMenu align="right" dataCy="user-menu">
   <div slot="control" class="user-dropdown">
-    <Avatar size="L" initials={$auth.initials} url={$auth.user.pictureUrl} />
+    <Avatar size="M" initials={$auth.initials} url={$auth.user.pictureUrl} />
     <Icon size="XL" name="ChevronDown" />
   </div>
   <MenuItem icon="Moon" on:click={() => themeModal.show()} dataCy="theme">

From fb8d6bb341157d95c293cad260e33c0f600b415b Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 11:58:05 +0000
Subject: [PATCH 19/26] Update assignment modal text

---
 .../overview/[appId]/access/_components/AssignmentModal.svelte  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/builder/src/pages/builder/portal/overview/[appId]/access/_components/AssignmentModal.svelte b/packages/builder/src/pages/builder/portal/overview/[appId]/access/_components/AssignmentModal.svelte
index 37143e25c1..b3aed56a48 100644
--- a/packages/builder/src/pages/builder/portal/overview/[appId]/access/_components/AssignmentModal.svelte
+++ b/packages/builder/src/pages/builder/portal/overview/[appId]/access/_components/AssignmentModal.svelte
@@ -144,7 +144,7 @@
 
 <ModalContent
   size="M"
-  title="Assign users to your app"
+  title="Assign access to your app"
   confirmText="Done"
   cancelText="Cancel"
   onConfirm={() => addData(data)}

From 387c3be2b43fbb98648da0ebfd81153262e110f1 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 12:01:34 +0000
Subject: [PATCH 20/26] Remove clickable visual styles from plugins

---
 packages/bbui/src/Table/Table.svelte                     | 9 +++++++--
 .../src/pages/builder/portal/plugins/index.svelte        | 1 +
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/bbui/src/Table/Table.svelte b/packages/bbui/src/Table/Table.svelte
index 5215a7ed8e..19d361c8b1 100644
--- a/packages/bbui/src/Table/Table.svelte
+++ b/packages/bbui/src/Table/Table.svelte
@@ -33,6 +33,7 @@
   export let allowSelectRows
   export let allowEditRows = true
   export let allowEditColumns = true
+  export let allowClickRows = true
   export let selectedRows = []
   export let customRenderers = []
   export let disableSorting = false
@@ -373,7 +374,7 @@
         {/if}
         {#if sortedRows?.length}
           {#each sortedRows as row, idx}
-            <div class="spectrum-Table-row">
+            <div class="spectrum-Table-row" class:clickable={allowClickRows}>
               {#if showEditColumn}
                 <div
                   class:noBorderCheckbox={!showHeaderBorder}
@@ -566,8 +567,12 @@
   /* Table rows */
   .spectrum-Table-row {
     display: contents;
+    cursor: auto;
   }
-  .spectrum-Table-row:hover .spectrum-Table-cell {
+  .spectrum-Table-row.clickable {
+    cursor: pointer;
+  }
+  .spectrum-Table-row.clickable:hover .spectrum-Table-cell {
     background-color: var(--spectrum-global-color-gray-100);
   }
   .wrapper--quiet .spectrum-Table-row {
diff --git a/packages/builder/src/pages/builder/portal/plugins/index.svelte b/packages/builder/src/pages/builder/portal/plugins/index.svelte
index 6e25944742..e39365710b 100644
--- a/packages/builder/src/pages/builder/portal/plugins/index.svelte
+++ b/packages/builder/src/pages/builder/portal/plugins/index.svelte
@@ -103,6 +103,7 @@
       allowEditColumns={false}
       allowEditRows={false}
       allowSelectRows={false}
+      allowClickRows={false}
       {customRenderers}
     />
   </Layout>

From 84c0e468db16a8d16e25c03d1d6128982e7e4dcf Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 12:02:48 +0000
Subject: [PATCH 21/26] Always show groups section in app access page

---
 .../pages/builder/portal/overview/[appId]/access/index.svelte   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte b/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte
index 43eea4aaa6..e1702b7921 100644
--- a/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte
+++ b/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte
@@ -217,7 +217,7 @@
       </Layout>
     {/if}
 
-    {#if $usersFetch.loaded && $licensing.groupsEnabled && appGroups.length}
+    {#if $usersFetch.loaded && $licensing.groupsEnabled}
       <Layout noPadding gap="S">
         <div class="title">
           <Heading size="S">Groups</Heading>

From a89bdb5e579e164059def63b574308e9d2edd3b1 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 12:04:05 +0000
Subject: [PATCH 22/26] Update app overview button styles to include more CTAs

---
 .../builder/portal/overview/[appId]/access/index.svelte      | 4 ++--
 .../builder/portal/overview/[appId]/backups/index.svelte     | 5 +----
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte b/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte
index e1702b7921..62c5da12ec 100644
--- a/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte
+++ b/packages/builder/src/pages/builder/portal/overview/[appId]/access/index.svelte
@@ -192,7 +192,7 @@
       <Layout noPadding gap="S">
         <div class="title">
           <Heading size="S">Users</Heading>
-          <Button secondary on:click={showUsersModal}>Assign user</Button>
+          <Button cta on:click={showUsersModal}>Assign user</Button>
         </div>
         <Table
           customPlaceholder
@@ -221,7 +221,7 @@
       <Layout noPadding gap="S">
         <div class="title">
           <Heading size="S">Groups</Heading>
-          <Button secondary on:click={showGroupsModal}>Assign group</Button>
+          <Button cta on:click={showGroupsModal}>Assign group</Button>
         </div>
         <Table
           customPlaceholder
diff --git a/packages/builder/src/pages/builder/portal/overview/[appId]/backups/index.svelte b/packages/builder/src/pages/builder/portal/overview/[appId]/backups/index.svelte
index 136d529f2e..c15f944601 100644
--- a/packages/builder/src/pages/builder/portal/overview/[appId]/backups/index.svelte
+++ b/packages/builder/src/pages/builder/portal/overview/[appId]/backups/index.svelte
@@ -1,6 +1,5 @@
 <script>
   import {
-    ActionButton,
     Button,
     DatePicker,
     Divider,
@@ -246,9 +245,7 @@
           />
         </div>
         <div>
-          <ActionButton on:click={modal.show} icon="SaveAsFloppy">
-            Create new backup
-          </ActionButton>
+          <Button cta on:click={modal.show}>Create new backup</Button>
         </div>
       </div>
       <div class="table">

From 00916a9b45a6de68296f27e7b710be062d8128fe Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 12:05:42 +0000
Subject: [PATCH 23/26] Hide edit and view links in more menu on overview page
 unless on mobile

---
 .../pages/builder/portal/overview/[appId]/_layout.svelte    | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/packages/builder/src/pages/builder/portal/overview/[appId]/_layout.svelte b/packages/builder/src/pages/builder/portal/overview/[appId]/_layout.svelte
index b7b4878791..3438e3e25f 100644
--- a/packages/builder/src/pages/builder/portal/overview/[appId]/_layout.svelte
+++ b/packages/builder/src/pages/builder/portal/overview/[appId]/_layout.svelte
@@ -260,10 +260,16 @@
   .desktop {
     display: contents;
   }
+  .mobile {
+    display: none;
+  }
 
   @media (max-width: 640px) {
     .desktop {
       display: none;
     }
+    .mobile {
+      display: contents;
+    }
   }
 </style>

From 355fb6fda2e5dcb04525c870eabd2011092ee756 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 13 Jan 2023 12:11:14 +0000
Subject: [PATCH 24/26] Make usage stats responsive and fix layout issues

---
 .../builder/src/components/usage/Usage.svelte | 29 ++++++++++++-------
 .../pages/builder/portal/account/usage.svelte |  1 +
 2 files changed, 19 insertions(+), 11 deletions(-)

diff --git a/packages/builder/src/components/usage/Usage.svelte b/packages/builder/src/components/usage/Usage.svelte
index 49c4205a4c..6e81abfe63 100644
--- a/packages/builder/src/components/usage/Usage.svelte
+++ b/packages/builder/src/components/usage/Usage.svelte
@@ -39,15 +39,21 @@
       {#if showWarning}
         <Icon name="Alert" />
       {/if}
-      <div class="heading header-item">
-        <Heading size="XS" weight="light">{usage.name}</Heading>
-      </div>
+      <Heading size="XS" weight="light">
+        <span class="nowrap">
+          {usage.name}
+        </span>
+      </Heading>
     </div>
-    {#if unlimited}
-      <Body size="S">{usage.used} / Unlimited</Body>
-    {:else}
-      <Body size="S">{usage.used} / {usage.total}</Body>
-    {/if}
+    <Body size="S">
+      <span class="nowrap">
+        {#if unlimited}
+          {usage.used} / Unlimited
+        {:else}
+          {usage.used} / {usage.total}
+        {/if}
+      </span>
+    </Body>
   </div>
   <div>
     {#if unlimited}
@@ -89,13 +95,14 @@
     display: flex;
     flex-direction: row;
     justify-content: space-between;
+    align-items: flex-end;
     margin-bottom: 12px;
+    gap: var(--spacing-m);
   }
   .header-container {
     display: flex;
   }
-  .heading {
-    margin-top: 3px;
-    margin-left: 5px;
+  .nowrap {
+    white-space: nowrap;
   }
 </style>
diff --git a/packages/builder/src/pages/builder/portal/account/usage.svelte b/packages/builder/src/pages/builder/portal/account/usage.svelte
index c502d35f79..39970a4814 100644
--- a/packages/builder/src/pages/builder/portal/account/usage.svelte
+++ b/packages/builder/src/pages/builder/portal/account/usage.svelte
@@ -249,6 +249,7 @@
     justify-content: flex-start;
     align-items: flex-start;
     gap: 40px;
+    flex-wrap: wrap;
   }
   .column {
     flex: 1 1 0;

From 1b56a83ec424de319fce94b193b3f5a83a801d43 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Mon, 16 Jan 2023 14:58:17 +0000
Subject: [PATCH 25/26] Add comment to docker-compose config

---
 hosting/docker-compose.dev.yaml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/hosting/docker-compose.dev.yaml b/hosting/docker-compose.dev.yaml
index 9e0ede07bf..7906a389fa 100644
--- a/hosting/docker-compose.dev.yaml
+++ b/hosting/docker-compose.dev.yaml
@@ -6,6 +6,7 @@ services:
   minio-service:
     container_name: budi-minio-dev
     restart: on-failure
+    # Last version that supports the "fs" backend
     image: minio/minio:RELEASE.2022-10-24T18-35-07Z
     volumes:
       - minio_data:/data

From cbdd85225dc3337aa961647288fe9e10dacc1c61 Mon Sep 17 00:00:00 2001
From: Gerard Burns <Ghrehh@users.noreply.github.com>
Date: Wed, 18 Jan 2023 12:00:08 +0000
Subject: [PATCH 26/26] Fix Table Creation With No Import (#9373)

---
 .../components/backend/TableNavigator/TableDataImport.svelte  | 2 +-
 .../backend/TableNavigator/modals/CreateTableModal.svelte     | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte b/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte
index a056ea3256..3dbe145084 100644
--- a/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte
+++ b/packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte
@@ -14,7 +14,7 @@
 
   export let rows = []
   export let schema = {}
-  export let allValid = false
+  export let allValid = true
   export let displayColumn = null
 
   const typeOptions = [
diff --git a/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte b/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte
index 9ad0fb726e..175705732f 100644
--- a/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte
+++ b/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte
@@ -33,7 +33,7 @@
   let autoColumns = getAutoColumnInformation()
   let schema = {}
   let rows = []
-  let allValid = false
+  let allValid = true
   let displayColumn = null
 
   function getAutoColumns() {
@@ -99,7 +99,7 @@
   title="Create Table"
   confirmText="Create"
   onConfirm={saveTable}
-  disabled={error || !name || !allValid}
+  disabled={error || !name || (rows.length && !allValid)}
 >
   <Input
     data-cy="table-name-input"