From e4512ba91fa2b107d5f4ee9d7533502e229d1973 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Tue, 7 Mar 2023 12:18:48 +0000
Subject: [PATCH 01/14] Merge commit

---
 .../builder/portal/settings/branding.svelte   | 56 +++++++++++++++++++
 .../portal/settings/organisation.svelte       |  6 +-
 packages/builder/src/stores/portal/menu.js    |  4 ++
 3 files changed, 63 insertions(+), 3 deletions(-)
 create mode 100644 packages/builder/src/pages/builder/portal/settings/branding.svelte
diff --git a/packages/builder/src/pages/builder/portal/settings/branding.svelte b/packages/builder/src/pages/builder/portal/settings/branding.svelte
new file mode 100644
index 0000000000..66ec23f041
--- /dev/null
+++ b/packages/builder/src/pages/builder/portal/settings/branding.svelte
@@ -0,0 +1,56 @@
+<script>
+  import {
+    Layout,
+    Heading,
+    Body,
+    Divider,
+    Label,
+    Dropzone,
+    notifications,
+  } from "@budibase/bbui"
+  import { auth, organisation } from "stores/portal"
+  import { API } from "api"
+
+  $: logo: $organisation.logoUrl
+    ? { url: $organisation.logoUrl, type: "image", name: "Logo" }
+    : null,
+    async function uploadLogo(file) {
+      try {
+        let data = new FormData()
+        data.append("file", file)
+        await API.uploadLogo(data)
+      } catch (error) {
+        notifications.error("Error uploading logo")
+      }
+    }
+</script>
+
+{#if $auth.isAdmin}
+  <Layout noPadding>
+    <Layout gap="XS" noPadding>
+      <Heading size="M">Branding</Heading>
+      <Body />
+    </Layout>
+    <Divider />
+    <div class="fields">
+      <div class="field logo">
+        <Label size="L">Logo</Label>
+        <div class="file">
+          <Dropzone
+            value={[logo]}
+            on:change={e => {
+              if (!e.detail || e.detail.length === 0) {
+                logo = null
+              } else {
+                logo = e.detail[0]
+              }
+            }}
+          />
+        </div>
+      </div>
+    </div>
+  </Layout>
+{/if}
+
+<style>
+</style>
diff --git a/packages/builder/src/pages/builder/portal/settings/organisation.svelte b/packages/builder/src/pages/builder/portal/settings/organisation.svelte
index bba046ce10..f96923ed3d 100644
--- a/packages/builder/src/pages/builder/portal/settings/organisation.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/organisation.svelte
@@ -7,7 +7,7 @@
     Divider,
     Label,
     Input,
-    Dropzone,
+    // Dropzone,
     notifications,
     Toggle,
   } from "@budibase/bbui"
@@ -87,7 +87,7 @@
         <Label size="L">Org. name</Label>
         <Input thin bind:value={$values.company} />
       </div>
-      <div class="field logo">
+      <!-- <div class="field logo">
         <Label size="L">Logo</Label>
         <div class="file">
           <Dropzone
@@ -101,7 +101,7 @@
             }}
           />
         </div>
-      </div>
+      </div> -->
       {#if !$admin.cloud}
         <div class="field">
           <Label
diff --git a/packages/builder/src/stores/portal/menu.js b/packages/builder/src/stores/portal/menu.js
index d791a4ac91..40580cd0ec 100644
--- a/packages/builder/src/stores/portal/menu.js
+++ b/packages/builder/src/stores/portal/menu.js
@@ -50,6 +50,10 @@ export const menu = derived([admin, auth], ([$admin, $auth]) => {
         title: "Organisation",
         href: "/builder/portal/settings/organisation",
       },
+      {
+        title: "Branding",
+        href: "/builder/portal/settings/branding",
+      },
       {
         title: "Environment",
         href: "/builder/portal/settings/environment",

From 5ce52cad066f4bc673a11c6ed5422b0c0f41a8a5 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Mon, 13 Mar 2023 12:33:16 +0000
Subject: [PATCH 02/14] Working commit

---
 packages/bbui/src/Form/Core/File.svelte       | 133 +++++++
 packages/bbui/src/Form/Core/index.js          |   1 +
 packages/bbui/src/Form/File.svelte            |  23 ++
 packages/bbui/src/index.js                    |   1 +
 packages/builder/index.html                   |  10 +-
 .../builder/src/pages/builder/_layout.svelte  |   4 +
 .../src/pages/builder/auth/login.svelte       | 187 +++++-----
 .../builder/portal/settings/branding.svelte   | 333 ++++++++++++++++--
 .../portal/settings/organisation.svelte       |  46 +--
 .../builder/src/stores/portal/licensing.js    |   3 +
 .../builder/src/stores/portal/organisation.js |  12 +
 packages/frontend-core/src/api/configs.js     |  12 +
 .../src/components/TestimonialPage.svelte     |  38 +-
 .../src/api/controllers/static/index.ts       |   4 +-
 .../static/templates/BudibaseApp.svelte       |   1 -
 packages/types/src/documents/global/config.ts |  14 +
 .../src/api/controllers/global/configs.ts     |   8 +
 .../worker/src/constants/templates/core.hbs   |  31 ++
 .../worker/src/constants/templates/index.ts   |   2 +
 packages/worker/src/utilities/email.ts        |  35 +-
 packages/worker/src/utilities/templates.ts    |   5 +
 21 files changed, 721 insertions(+), 182 deletions(-)
 create mode 100644 packages/bbui/src/Form/Core/File.svelte
 create mode 100644 packages/bbui/src/Form/File.svelte
 create mode 100644 packages/worker/src/constants/templates/core.hbs

diff --git a/packages/bbui/src/Form/Core/File.svelte b/packages/bbui/src/Form/Core/File.svelte
new file mode 100644
index 0000000000..3ca749e908
--- /dev/null
+++ b/packages/bbui/src/Form/Core/File.svelte
@@ -0,0 +1,133 @@
+<script>
+  import ActionButton from "../../ActionButton/ActionButton.svelte"
+  import { uuid } from "../../helpers"
+  import Icon from "../../Icon/Icon.svelte"
+  import { createEventDispatcher } from "svelte"
+
+  export let value = null //support multi?
+  export let title = "Upload file"
+  export let disabled = false
+  export let extensions = "*"
+  export let handleFileTooLarge = null
+  export let handleTooManyFiles = null
+  export let fileSizeLimit = BYTES_IN_MB * 20 // Centralise
+  export let id = null
+
+  const dispatch = createEventDispatcher()
+
+  //Is this necessary?
+  const fieldId = id || uuid()
+
+  // Centralise all in new file section?
+  const BYTES_IN_KB = 1000
+  const BYTES_IN_MB = 1000000
+
+  let fileInput
+  // $: file = value[0] || null
+
+  // const imageExtensions = [
+  //   "png",
+  //   "tiff",
+  //   "gif",
+  //   "raw",
+  //   "jpg",
+  //   "jpeg",
+  //   "svg",
+  //   "bmp",
+  //   "jfif",
+  // ]
+
+  // Should support only 1 file for now.
+  // Files[0]
+
+  //What is the limit? 50mb?
+
+  async function processFileList(fileList) {
+    if (
+      handleFileTooLarge &&
+      Array.from(fileList).some(file => file.size >= fileSizeLimit)
+    ) {
+      handleFileTooLarge(fileSizeLimit, value)
+      return
+    }
+
+    const fileCount = fileList.length + value.length
+    if (handleTooManyFiles && maximum && fileCount > maximum) {
+      handleTooManyFiles(maximum)
+      return
+    }
+
+    if (processFiles) {
+      const processedFiles = await processFiles(fileList)
+      const newValue = [...value, ...processedFiles]
+      dispatch("change", newValue)
+      selectedImageIdx = newValue.length - 1
+    } else {
+      dispatch("change", fileList)
+    }
+  }
+
+  function handleFile(evt) {
+    console.log("Hello ", evt.target.files[0])
+    dispatch("change", evt.target.files[0])
+    //processFileList(evt.target.files)
+  }
+
+  function clearFile() {
+    dispatch("change", null)
+  }
+</script>
+
+<input
+  id={fieldId}
+  {disabled}
+  type="file"
+  accept={extensions}
+  bind:this={fileInput}
+  on:change={handleFile}
+/>
+
+<div class="field">
+  {#if value}
+    <div class="file-view">
+      <!-- <img alt="" src={value.url} /> -->
+      <div class="filename">{value.name}</div>
+      {#if value.size}
+        <div class="filesize">
+          {#if value.size <= BYTES_IN_MB}
+            {`${value.size / BYTES_IN_KB} KB`}
+          {:else}
+            {`${value.size / BYTES_IN_MB} MB`}
+          {/if}
+        </div>
+      {/if}
+      {#if !disabled}
+        <div class="delete-button" on:click={clearFile}>
+          <Icon name="Close" size="XS" />
+        </div>
+      {/if}
+    </div>
+  {/if}
+  <ActionButton on:click={fileInput.click()}>{title}</ActionButton>
+</div>
+
+<style>
+  .field {
+    display: flex;
+    gap: var(--spacing-m);
+  }
+  .file-view {
+    display: flex;
+    gap: var(--spacing-l);
+    align-items: center;
+    border: 1px solid var(--spectrum-alias-border-color);
+    border-radius: var(--spectrum-global-dimension-size-50);
+    padding: 0px var(--spectrum-alias-item-padding-m);
+  }
+  input[type="file"] {
+    display: none;
+  }
+  .delete-button {
+    cursor: pointer;
+  }
+</style>
diff --git a/packages/bbui/src/Form/Core/index.js b/packages/bbui/src/Form/Core/index.js
index 7c81cfd70b..b0edf52748 100644
--- a/packages/bbui/src/Form/Core/index.js
+++ b/packages/bbui/src/Form/Core/index.js
@@ -13,3 +13,4 @@ export { default as CoreDropzone } from "./Dropzone.svelte"
 export { default as CoreStepper } from "./Stepper.svelte"
 export { default as CoreRichTextField } from "./RichTextField.svelte"
 export { default as CoreSlider } from "./Slider.svelte"
+export { default as CoreFile } from "./File.svelte"
diff --git a/packages/bbui/src/Form/File.svelte b/packages/bbui/src/Form/File.svelte
new file mode 100644
index 0000000000..edc096c902
--- /dev/null
+++ b/packages/bbui/src/Form/File.svelte
@@ -0,0 +1,23 @@
+<script>
+  import Field from "./Field.svelte"
+  import { CoreFile } from "./Core"
+  import { createEventDispatcher } from "svelte"
+
+  export let label = null
+  export let labelPosition = "above"
+  export let disabled = false
+  export let error = null
+  export let title = null
+  export let value = null
+  export let tooltip = null
+
+  const dispatch = createEventDispatcher()
+  const onChange = e => {
+    value = e.detail
+    dispatch("change", e.detail)
+  }
+</script>
+
+<Field {label} {labelPosition} {error} {tooltip}>
+  <CoreFile {error} {disabled} {title} {value} on:change={onChange} />
+</Field>
diff --git a/packages/bbui/src/index.js b/packages/bbui/src/index.js
index d7457508fd..9aa377b147 100644
--- a/packages/bbui/src/index.js
+++ b/packages/bbui/src/index.js
@@ -78,6 +78,7 @@ export { default as IconSideNav } from "./IconSideNav/IconSideNav.svelte"
 export { default as IconSideNavItem } from "./IconSideNav/IconSideNavItem.svelte"
 export { default as Slider } from "./Form/Slider.svelte"
 export { default as Accordion } from "./Accordion/Accordion.svelte"
+export { default as File } from "./Form/File.svelte"
 
 // Renderers
 export { default as BoldRenderer } from "./Table/BoldRenderer.svelte"
diff --git a/packages/builder/index.html b/packages/builder/index.html
index e3383cda39..96abc8e582 100644
--- a/packages/builder/index.html
+++ b/packages/builder/index.html
@@ -1,17 +1,17 @@
 <!doctype html>
 <html class="spectrum spectrum--medium spectrum--darkest" lang="en" dir="ltr">
+
 <head>
 	<meta charset='utf8'>
 	<meta name='viewport' content='width=device-width'>
 	<title>Budibase</title>
-	<link rel='icon' href='/src/favicon.png'>
 	<link rel="preconnect" href="https://fonts.gstatic.com" />
-	<link
-		href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600;700&display=swap"
-		rel="stylesheet"
-	/>
+	<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600;700&display=swap"
+		rel="stylesheet" />
 </head>
+
 <body id="app">
 	<script type="module" src='/src/main.js'></script>
 </body>
+
 </html>
\ No newline at end of file
diff --git a/packages/builder/src/pages/builder/_layout.svelte b/packages/builder/src/pages/builder/_layout.svelte
index 8d604e8790..086f2513b4 100644
--- a/packages/builder/src/pages/builder/_layout.svelte
+++ b/packages/builder/src/pages/builder/_layout.svelte
@@ -4,6 +4,7 @@
   import { onMount } from "svelte"
   import { CookieUtils, Constants } from "@budibase/frontend-core"
   import { API } from "api"
+  import Branding from "./Branding.svelte"
 
   let loaded = false
 
@@ -146,6 +147,9 @@
   }
 </script>
 
+<!--Portal branding overrides -->
+<Branding />
+
 {#if loaded}
   <slot />
 {/if}
diff --git a/packages/builder/src/pages/builder/auth/login.svelte b/packages/builder/src/pages/builder/auth/login.svelte
index 06e09e4fee..10d01293ab 100644
--- a/packages/builder/src/pages/builder/auth/login.svelte
+++ b/packages/builder/src/pages/builder/auth/login.svelte
@@ -64,99 +64,106 @@
 </script>
 
 <svelte:window on:keydown={handleKeydown} />
-
-<TestimonialPage>
-  <Layout gap="L" noPadding>
-    <Layout justifyItems="center" noPadding>
-      {#if loaded}
-        <img alt="logo" src={$organisation.logoUrl || Logo} />
-      {/if}
-      <Heading size="M">Log in to Budibase</Heading>
-    </Layout>
-    <Layout gap="S" noPadding>
-      {#if loaded && ($organisation.google || $organisation.oidc)}
-        <FancyForm>
-          <OIDCButton oidcIcon={$oidc.logo} oidcName={$oidc.name} />
-          <GoogleButton />
-        </FancyForm>
-      {/if}
+{#if loaded}
+  <TestimonialPage enabled={$organisation.testimonialsEnabled}>
+    <Layout gap="L" noPadding>
+      <Layout justifyItems="center" noPadding>
+        {#if loaded}
+          <img alt="logo" src={$organisation.logoUrl || Logo} />
+        {/if}
+        <Heading size="M">
+          {$organisation.loginHeading || "Log in to Budibase"}
+        </Heading>
+      </Layout>
+      <Layout gap="S" noPadding>
+        {#if loaded && ($organisation.google || $organisation.oidc)}
+          <FancyForm>
+            <OIDCButton oidcIcon={$oidc.logo} oidcName={$oidc.name} />
+            <GoogleButton />
+          </FancyForm>
+        {/if}
+        {#if !$organisation.isSSOEnforced}
+          <Divider />
+          <FancyForm bind:this={form}>
+            <FancyInput
+              label="Your work email"
+              value={formData.username}
+              on:change={e => {
+                formData = {
+                  ...formData,
+                  username: e.detail,
+                }
+              }}
+              validate={() => {
+                let fieldError = {
+                  username: !formData.username
+                    ? "Please enter a valid email"
+                    : undefined,
+                }
+                errors = handleError({ ...errors, ...fieldError })
+              }}
+              error={errors.username}
+            />
+            <FancyInput
+              label="Password"
+              value={formData.password}
+              type="password"
+              on:change={e => {
+                formData = {
+                  ...formData,
+                  password: e.detail,
+                }
+              }}
+              validate={() => {
+                let fieldError = {
+                  password: !formData.password
+                    ? "Please enter your password"
+                    : undefined,
+                }
+                errors = handleError({ ...errors, ...fieldError })
+              }}
+              error={errors.password}
+            />
+          </FancyForm>
+        {/if}
+      </Layout>
       {#if !$organisation.isSSOEnforced}
-        <Divider />
-        <FancyForm bind:this={form}>
-          <FancyInput
-            label="Your work email"
-            value={formData.username}
-            on:change={e => {
-              formData = {
-                ...formData,
-                username: e.detail,
-              }
-            }}
-            validate={() => {
-              let fieldError = {
-                username: !formData.username
-                  ? "Please enter a valid email"
-                  : undefined,
-              }
-              errors = handleError({ ...errors, ...fieldError })
-            }}
-            error={errors.username}
-          />
-          <FancyInput
-            label="Password"
-            value={formData.password}
-            type="password"
-            on:change={e => {
-              formData = {
-                ...formData,
-                password: e.detail,
-              }
-            }}
-            validate={() => {
-              let fieldError = {
-                password: !formData.password
-                  ? "Please enter your password"
-                  : undefined,
-              }
-              errors = handleError({ ...errors, ...fieldError })
-            }}
-            error={errors.password}
-          />
-        </FancyForm>
+        <Layout gap="XS" noPadding justifyItems="center">
+          <Button
+            size="L"
+            cta
+            disabled={Object.keys(errors).length > 0}
+            on:click={login}
+          >
+            {$organisation.loginButton || `Log in to {company}`}
+          </Button>
+        </Layout>
+        <Layout gap="XS" noPadding justifyItems="center">
+          <div class="user-actions">
+            <ActionButton size="L" quiet on:click={() => $goto("./forgot")}>
+              Forgot password?
+            </ActionButton>
+          </div>
+        </Layout>
+      {/if}
+
+      {#if cloud && $organisation.licenceAgreementEnabled}
+        <Body size="xs" textAlign="center">
+          By using Budibase Cloud
+          <br />
+          you are agreeing to our
+          <Link
+            href="https://budibase.com/eula"
+            target="_blank"
+            secondary={true}
+          >
+            License Agreement
+          </Link>
+        </Body>
       {/if}
     </Layout>
-    {#if !$organisation.isSSOEnforced}
-      <Layout gap="XS" noPadding justifyItems="center">
-        <Button
-          size="L"
-          cta
-          disabled={Object.keys(errors).length > 0}
-          on:click={login}
-        >
-          Log in to {company}
-        </Button>
-      </Layout>
-      <Layout gap="XS" noPadding justifyItems="center">
-        <div class="user-actions">
-          <ActionButton size="L" quiet on:click={() => $goto("./forgot")}>
-            Forgot password?
-          </ActionButton>
-        </div>
-      </Layout>
-    {/if}
-
-    {#if cloud}
-      <Body size="xs" textAlign="center">
-        By using Budibase Cloud
-        <br />
-        you are agreeing to our
-        <Link href="https://budibase.com/eula" target="_blank" secondary={true}>
-          License Agreement
-        </Link>
-      </Body>
-    {/if}
-  </Layout>
-</TestimonialPage>
+  </TestimonialPage>
+{/if}
 
 <style>
   .user-actions {
diff --git a/packages/builder/src/pages/builder/portal/settings/branding.svelte b/packages/builder/src/pages/builder/portal/settings/branding.svelte
index 66ec23f041..73569e93a3 100644
--- a/packages/builder/src/pages/builder/portal/settings/branding.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/branding.svelte
@@ -4,53 +4,328 @@
     Heading,
     Body,
     Divider,
-    Label,
-    Dropzone,
+    File,
     notifications,
+    Tags,
+    Tag,
+    Button,
+    Toggle,
+    Input,
+    Label,
   } from "@budibase/bbui"
-  import { auth, organisation } from "stores/portal"
+  import { auth, organisation, licensing, admin } from "stores/portal"
   import { API } from "api"
+  import { onMount } from "svelte"
 
-  $: logo: $organisation.logoUrl
-    ? { url: $organisation.logoUrl, type: "image", name: "Logo" }
-    : null,
-    async function uploadLogo(file) {
-      try {
-        let data = new FormData()
-        data.append("file", file)
-        await API.uploadLogo(data)
-      } catch (error) {
-        notifications.error("Error uploading logo")
+  let loaded = false
+  let saving = false
+  let logoFile = null
+  let faviconFile = null
+
+  let config = {}
+  let updated = false
+  $: onConfigUpdate(config)
+
+  const onConfigUpdate = config => {
+    if (!loaded || updated) {
+      return
+    }
+    updated = true
+    console.log("config updated ", config)
+  }
+
+  $: logo = config.logoUrl
+    ? { url: config.logoUrl, type: "image", name: "Logo" }
+    : null
+
+  $: favicon = config.faviconUrl
+    ? { url: config.logoUrl, type: "image", name: "Favicon" }
+    : null
+
+  async function uploadLogo(file) {
+    let response = {}
+    try {
+      let data = new FormData()
+      data.append("file", file)
+      response = await API.uploadLogo(data)
+    } catch (error) {
+      notifications.error("Error uploading logo")
+    }
+    return response
+  }
+
+  // Limit file types
+  // PNG, GIF, or ICO?
+  async function uploadFavicon(file) {
+    let response = {}
+    try {
+      let data = new FormData()
+      data.append("file", file)
+      response = await API.uploadFavicon(data)
+    } catch (error) {
+      notifications.error("Error uploading favicon")
+    }
+    return response
+  }
+
+  async function saveConfig() {
+    saving = true
+
+    console.log("Save Config")
+
+    if (logoFile) {
+      const logoResp = await uploadLogo(logoFile)
+      if (logoResp.url) {
+        config = {
+          ...config,
+          logoUrl: logoResp.url,
+        }
+      } else {
+        //would have to delete
       }
     }
+
+    if (faviconFile) {
+      const faviconResp = await uploadFavicon(faviconFile)
+      if (faviconResp.url) {
+        config = {
+          ...config,
+          faviconUrl: faviconResp.url,
+        }
+      }
+    }
+    console.log("SAVE CONFIG ", config)
+    try {
+      // Update settings
+      await organisation.save(config)
+      await organisation.init()
+      notifications.success("Branding settings updated")
+    } catch (e) {
+      console.error("Branding updated failed", e)
+      notifications.error("Branding updated failed")
+    }
+
+    saving = false
+  }
+
+  onMount(async () => {
+    await organisation.init()
+
+    const {
+      faviconUrl,
+      logoUrl,
+      platformTitle,
+      emailBrandingEnabled,
+      appFooterEnabled,
+      loginHeading,
+      loginButton,
+      licenceAgreementEnabled,
+      testimonialsEnabled,
+    } = $organisation
+
+    config = {
+      faviconUrl,
+      logoUrl,
+      platformTitle,
+      emailBrandingEnabled,
+      appFooterEnabled,
+      loginHeading,
+      loginButton,
+      licenceAgreementEnabled,
+      testimonialsEnabled,
+    }
+
+    loaded = true
+  })
 </script>
 
-{#if $auth.isAdmin}
+{#if $auth.isAdmin && loaded}
   <Layout noPadding>
     <Layout gap="XS" noPadding>
-      <Heading size="M">Branding</Heading>
-      <Body />
+      <div class="title">
+        <Heading size="M">Branding</Heading>
+        {#if !$licensing.isBusinessPlan}
+          <Tags>
+            <Tag icon="LockClosed">Business</Tag>
+          </Tags>
+        {/if}
+      </div>
+      <Body>Remove all Budibase branding and use your own.</Body>
     </Layout>
     <Divider />
-    <div class="fields">
-      <div class="field logo">
+    <div class="branding fields">
+      <div class="field">
         <Label size="L">Logo</Label>
-        <div class="file">
-          <Dropzone
-            value={[logo]}
-            on:change={e => {
-              if (!e.detail || e.detail.length === 0) {
-                logo = null
-              } else {
-                logo = e.detail[0]
-              }
-            }}
-          />
+        <File
+          title="Upload image"
+          on:change={e => {
+            console.log("Updated Logo")
+            let clone = { ...config }
+            if (e.detail) {
+              logoFile = e.detail
+            } else {
+              clone.logoUrl = ""
+            }
+            config = clone
+          }}
+          value={logo}
+        />
+      </div>
+
+      <div class="field">
+        <Label size="L">Favicon</Label>
+        <File
+          title="Upload image"
+          on:change={e => {
+            console.log("Updated Favicon")
+            let clone = { ...config }
+            if (e.detail) {
+              faviconFile = e.detail
+            } else {
+              clone.faviconUrl = ""
+            }
+            config = clone
+          }}
+          value={favicon}
+        />
+      </div>
+      <div class="field">
+        <Label size="L">Title</Label>
+        <Input
+          on:change={e => {
+            let clone = { ...config }
+            clone.platformTitle = e.detail ? e.detail : ""
+            config = clone
+          }}
+          value={config.platformTitle || "Budibase"}
+        />
+      </div>
+      <div>
+        <Toggle
+          text={"Remove Buidbase brand from emails"}
+          on:change={e => {
+            let clone = { ...config }
+            clone.emailBrandingEnabled = !e.detail
+            config = clone
+          }}
+          value={!config.emailBrandingEnabled}
+        />
+        <Toggle
+          text={"Remove Budibase footer from apps"}
+          on:change={e => {
+            let clone = { ...config }
+            clone.appFooterEnabled = !e.detail
+            config = clone
+          }}
+          value={!config.appFooterEnabled}
+        />
+      </div>
+    </div>
+
+    <!-- Should this be displayed? -->
+    {#if !$admin.cloud}
+      <Divider />
+      <Layout gap="XS" noPadding>
+        <Heading size="S">Login page (Self host)</Heading>
+        <Body>You can only customise your login page in self host</Body>
+      </Layout>
+      <div class="login">
+        <div class="fields">
+          <div class="field">
+            <Label size="L">Header</Label>
+            <Input
+              on:change={e => {
+                let clone = { ...config }
+                clone.loginHeading = e.detail ? e.detail : ""
+                config = clone
+              }}
+              value={config.loginHeading || "Log in to Budibase"}
+            />
+          </div>
+
+          <div class="field">
+            <Label size="L">Button</Label>
+            <Input
+              on:change={e => {
+                let clone = { ...config }
+                clone.loginButton = e.detail ? e.detail : ""
+                config = clone
+              }}
+              value={config.loginButton || "Log in to Budibase"}
+            />
+          </div>
+          <div>
+            <Toggle
+              text={"Remove customer testimonials"}
+              on:change={e => {
+                let clone = { ...config }
+                clone.testimonialsEnabled = !e.detail
+                config = clone
+              }}
+              value={!config.testimonialsEnabled}
+            />
+            <Toggle
+              text={"Remove licence agreement"}
+              on:change={e => {
+                let clone = { ...config }
+                clone.licenceAgreementEnabled = !e.detail
+                config = clone
+              }}
+              value={!config.licenceAgreementEnabled}
+            />
+          </div>
         </div>
       </div>
+    {/if}
+    <Divider />
+    <Layout gap="XS" noPadding>
+      <Heading size="S">Application previews</Heading>
+      <Body>Customise the meta tags on your app preview</Body>
+    </Layout>
+    <div class="app-previews">
+      <div class="fields">
+        <div class="field">
+          <!-- <Label size="L">Header</Label>
+            <Input
+              on:change={e => {
+                let clone = { ...config }
+                clone.loginHeading = e.detail ? e.detail : ""
+                config = clone
+              }}
+              value={config.loginHeading || "Log in to Budibase"}
+            /> -->
+        </div>
+      </div>
+    </div>
+    <div>
+      <Button on:click={saveConfig} cta disabled={saving || !updated}>
+        Save
+      </Button>
     </div>
   </Layout>
 {/if}
 
 <style>
+  .title {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: flex-start;
+    gap: var(--spacing-m);
+  }
+
+  .branding,
+  .login {
+    width: 60%;
+  }
+  .fields {
+    display: grid;
+    grid-gap: var(--spacing-m);
+  }
+  .field {
+    display: grid;
+    grid-template-columns: 80px 1fr;
+    grid-gap: var(--spacing-l);
+    align-items: center;
+  }
 </style>
diff --git a/packages/builder/src/pages/builder/portal/settings/organisation.svelte b/packages/builder/src/pages/builder/portal/settings/organisation.svelte
index f96923ed3d..7816600fe6 100644
--- a/packages/builder/src/pages/builder/portal/settings/organisation.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/organisation.svelte
@@ -28,21 +28,21 @@
     company: $organisation.company,
     platformUrl: $organisation.platformUrl,
     analyticsEnabled: $organisation.analyticsEnabled,
-    logo: $organisation.logoUrl
-      ? { url: $organisation.logoUrl, type: "image", name: "Logo" }
-      : null,
+    // logo: $organisation.logoUrl
+    //   ? { url: $organisation.logoUrl, type: "image", name: "Logo" }
+    //   : null,
   })
   let loading = false
 
-  async function uploadLogo(file) {
-    try {
-      let data = new FormData()
-      data.append("file", file)
-      await API.uploadLogo(data)
-    } catch (error) {
-      notifications.error("Error uploading logo")
-    }
-  }
+  // async function uploadLogo(file) {
+  //   try {
+  //     let data = new FormData()
+  //     data.append("file", file)
+  //     await API.uploadLogo(data)
+  //   } catch (error) {
+  //     notifications.error("Error uploading logo")
+  //   }
+  // }
 
   async function saveConfig() {
     loading = true
@@ -87,21 +87,7 @@
         <Label size="L">Org. name</Label>
         <Input thin bind:value={$values.company} />
       </div>
-      <!-- <div class="field logo">
-        <Label size="L">Logo</Label>
-        <div class="file">
-          <Dropzone
-            value={[$values.logo]}
-            on:change={e => {
-              if (!e.detail || e.detail.length === 0) {
-                $values.logo = null
-              } else {
-                $values.logo = e.detail[0]
-              }
-            }}
-          />
-        </div>
-      </div> -->
+
       {#if !$admin.cloud}
         <div class="field">
           <Label
@@ -137,10 +123,4 @@
     grid-gap: var(--spacing-l);
     align-items: center;
   }
-  .file {
-    max-width: 30ch;
-  }
-  .logo {
-    align-items: start;
-  }
 </style>
diff --git a/packages/builder/src/stores/portal/licensing.js b/packages/builder/src/stores/portal/licensing.js
index cf04eed9e6..bb90d6d561 100644
--- a/packages/builder/src/stores/portal/licensing.js
+++ b/packages/builder/src/stores/portal/licensing.js
@@ -13,6 +13,7 @@ export const createLicensingStore = () => {
     license: undefined,
     isFreePlan: true,
     isEnterprisePlan: true,
+    isBusinessPlan: true,
     // features
     groupsEnabled: false,
     backupsEnabled: false,
@@ -57,6 +58,7 @@ export const createLicensingStore = () => {
       const planType = license?.plan.type
       const isEnterprisePlan = planType === Constants.PlanType.ENTERPRISE
       const isFreePlan = planType === Constants.PlanType.FREE
+      const isBusinessPlan = planType === Constants.PlanType.BUSINESS
       const groupsEnabled = license.features.includes(
         Constants.Features.USER_GROUPS
       )
@@ -79,6 +81,7 @@ export const createLicensingStore = () => {
           license,
           isEnterprisePlan,
           isFreePlan,
+          isBusinessPlan,
           groupsEnabled,
           backupsEnabled,
           environmentVariablesEnabled,
diff --git a/packages/builder/src/stores/portal/organisation.js b/packages/builder/src/stores/portal/organisation.js
index 36bf98b0ba..4b633bd5e9 100644
--- a/packages/builder/src/stores/portal/organisation.js
+++ b/packages/builder/src/stores/portal/organisation.js
@@ -5,7 +5,19 @@ import _ from "lodash"
 
 const DEFAULT_CONFIG = {
   platformUrl: "",
+
   logoUrl: undefined,
+  faviconUrl: undefined,
+
+  emailBrandingEnabled: true,
+  appFooterEnabled: true,
+  // Self host only
+  testimonialsEnabled: true,
+  licenceAgreementEnabled: true,
+  platformTitle: "Budibase",
+  loginHeading: undefined,
+  loginButton: undefined,
+
   docsUrl: undefined,
   company: "Budibase",
   oidc: undefined,
diff --git a/packages/frontend-core/src/api/configs.js b/packages/frontend-core/src/api/configs.js
index 8447e0d79d..8d0d176a55 100644
--- a/packages/frontend-core/src/api/configs.js
+++ b/packages/frontend-core/src/api/configs.js
@@ -73,6 +73,18 @@ export const buildConfigEndpoints = API => ({
     })
   },
 
+  /**
+   * Updates the company favicon for the environment.
+   * @param data the favicon form data
+   */
+  uploadFavicon: async data => {
+    return await API.post({
+      url: "/api/global/configs/upload/settings/faviconUrl",
+      body: data,
+      json: false,
+    })
+  },
+
   /**
    * Uploads a logo for an OIDC provider.
    * @param name the name of the OIDC provider
diff --git a/packages/frontend-core/src/components/TestimonialPage.svelte b/packages/frontend-core/src/components/TestimonialPage.svelte
index 25ed4ac08d..bbb61d2276 100644
--- a/packages/frontend-core/src/components/TestimonialPage.svelte
+++ b/packages/frontend-core/src/components/TestimonialPage.svelte
@@ -5,6 +5,8 @@
   import Covanta from "../../assets/covanta.png"
   import Schnellecke from "../../assets/schnellecke.png"
 
+  export let enabled = true
+
   const testimonials = [
     {
       text: "Budibase was the only solution that checked all the boxes for Covanta. Covanta expects to realize $3.2MM in savings due to the elimination of redundant data entry.",
@@ -33,23 +35,25 @@
 
 <SplitPage>
   <slot />
-  <div class="wrapper" slot="right">
-    <div class="testimonial">
-      <Layout noPadding gap="S">
-        <img
-          width={testimonial.imageSize}
-          alt="a-happy-budibase-user"
-          src={testimonial.image}
-        />
-        <div class="text">
-          "{testimonial.text}"
-        </div>
-        <div class="author">
-          <div class="name">{testimonial.name}</div>
-          <div class="company">{testimonial.role}</div>
-        </div>
-      </Layout>
-    </div>
+  <div class:wrapper={enabled} slot="right">
+    {#if enabled}
+      <div class="testimonial">
+        <Layout noPadding gap="S">
+          <img
+            width={testimonial.imageSize}
+            alt="a-happy-budibase-user"
+            src={testimonial.image}
+          />
+          <div class="text">
+            "{testimonial.text}"
+          </div>
+          <div class="author">
+            <div class="name">{testimonial.name}</div>
+            <div class="company">{testimonial.role}</div>
+          </div>
+        </Layout>
+      </div>
+    {/if}
   </div>
 </SplitPage>
 
diff --git a/packages/server/src/api/controllers/static/index.ts b/packages/server/src/api/controllers/static/index.ts
index c58e1a374d..a12e1b5713 100644
--- a/packages/server/src/api/controllers/static/index.ts
+++ b/packages/server/src/api/controllers/static/index.ts
@@ -105,14 +105,16 @@ export const serveApp = async function (ctx: any) {
   if (!env.isJest()) {
     const App = require("./templates/BudibaseApp.svelte").default
     const plugins = objectStore.enrichPluginURLs(appInfo.usedPlugins)
+    console.log(appInfo)
     const { head, html, css } = App.render({
       metaImage:
         "https://res.cloudinary.com/daog6scxm/image/upload/v1666109324/meta-images/budibase-meta-image_uukc1m.png",
-      title: appInfo.name,
+      title: appInfo.name, //Replace Title here?
       production: env.isProd(),
       appId,
       clientLibPath: objectStore.clientLibraryUrl(appId!, appInfo.version),
       usedPlugins: plugins,
+      favicon: objectStore.getGlobalFileUrl("settings", "faviconUrl"),
     })
 
     const appHbs = loadHandlebarsFile(`${__dirname}/templates/app.hbs`)
diff --git a/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte b/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte
index 27dad289b4..be06c4f46e 100644
--- a/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte
+++ b/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte
@@ -22,7 +22,6 @@
   <meta property="og:title" content="{title} - built with Budibase" />
   <meta property="og:type" content="website" />
   <meta property="og:image" content={metaImage} />
-
   <title>{title}</title>
   <link rel="icon" type="image/png" href={favicon} />
   <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
diff --git a/packages/types/src/documents/global/config.ts b/packages/types/src/documents/global/config.ts
index 6e86ed2674..1146c5910e 100644
--- a/packages/types/src/documents/global/config.ts
+++ b/packages/types/src/documents/global/config.ts
@@ -27,6 +27,20 @@ export interface SettingsInnerConfig {
   company?: string
   logoUrl?: string // Populated on read
   logoUrlEtag?: string
+
+  faviconUrl?: string
+  faviconUrlEtag?: string
+
+  emailBrandingEnabled?: boolean
+
+  // Self host only
+  appFooterEnabled?: boolean
+  testimonialsEnabled?: boolean
+  licenceAgreementEnabled?: boolean
+  platformTitle?: string
+  loginHeading?: string
+  loginButton?: string
+
   uniqueTenantId?: string
   analyticsEnabled?: boolean
   isSSOEnforced?: boolean
diff --git a/packages/worker/src/api/controllers/global/configs.ts b/packages/worker/src/api/controllers/global/configs.ts
index 02459855c2..eced642155 100644
--- a/packages/worker/src/api/controllers/global/configs.ts
+++ b/packages/worker/src/api/controllers/global/configs.ts
@@ -285,6 +285,14 @@ export async function publicSettings(
       )
     }
 
+    if (config.faviconUrl && config.faviconUrl !== "") {
+      config.faviconUrl = objectStore.getGlobalFileUrl(
+        "settings",
+        "faviconUrl",
+        config.faviconUrl
+      )
+    }
+
     // google
     const googleConfig = await configs.getGoogleConfig()
     const preActivated = googleConfig?.activated == null
diff --git a/packages/worker/src/constants/templates/core.hbs b/packages/worker/src/constants/templates/core.hbs
new file mode 100644
index 0000000000..3511aaa460
--- /dev/null
+++ b/packages/worker/src/constants/templates/core.hbs
@@ -0,0 +1,31 @@
+{{#if enableEmailBranding}}
+  <tr>
+    <td cellpadding="0" cellspacing="0">
+      <table
+        align="center"
+        width="570"
+        cellpadding="0"
+        cellspacing="0"
+        role="presentation"
+      >
+        <tbody>
+          <tr>
+            <td
+              style="padding:0 35px;vertical-align: middle;"
+              cellpadding="0"
+              cellspacing="0"
+            >
+              <img
+                width="32px"
+                style="margin-right: 16px;"
+                alt="Budibase Logo"
+                src="https://i.imgur.com/Xhdt1YP.png"
+              />
+              <h2 style="margin: 0px">Budibase</h2>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </td>
+  </tr>
+{{/if}}
\ No newline at end of file
diff --git a/packages/worker/src/constants/templates/index.ts b/packages/worker/src/constants/templates/index.ts
index b0b6029c36..8c3899b1df 100644
--- a/packages/worker/src/constants/templates/index.ts
+++ b/packages/worker/src/constants/templates/index.ts
@@ -21,6 +21,8 @@ export const EmailTemplates = {
     join(__dirname, "welcome.hbs")
   ),
   [EmailTemplatePurpose.CUSTOM]: readStaticFile(join(__dirname, "custom.hbs")),
+  //Core wrapper
+  ["branding"]: readStaticFile(join(__dirname, "core.hbs")),
 }
 
 export function addBaseTemplates(templates: Template[], type?: string) {
diff --git a/packages/worker/src/utilities/email.ts b/packages/worker/src/utilities/email.ts
index 4fd8a82161..870dcc33fd 100644
--- a/packages/worker/src/utilities/email.ts
+++ b/packages/worker/src/utilities/email.ts
@@ -1,6 +1,6 @@
 import env from "../environment"
 import { EmailTemplatePurpose, TemplateType } from "../constants"
-import { getTemplateByPurpose } from "../constants/templates"
+import { getTemplateByPurpose, EmailTemplates } from "../constants/templates"
 import { getSettingsTemplateContext } from "./templates"
 import { processString } from "@budibase/string-templates"
 import { getResetPasswordCode, getInviteCode } from "./redis"
@@ -108,30 +108,53 @@ async function buildEmail(
   let [base, body] = await Promise.all([
     getTemplateByPurpose(TYPE, EmailTemplatePurpose.BASE),
     getTemplateByPurpose(TYPE, purpose),
+    //getTemplateByPurpose(TYPE, "branding"), //should generalise to 'branding'
   ])
-  if (!base || !body) {
+
+  let branding = EmailTemplates["branding"]
+
+  if (!base || !body || !branding) {
     throw "Unable to build email, missing base components"
   }
   base = base.contents
   body = body.contents
+
+  //branding = branding.contents
+
   let name = user ? user.name : undefined
   if (user && !name && user.firstName) {
     name = user.lastName ? `${user.firstName} ${user.lastName}` : user.firstName
   }
   context = {
-    ...context,
+    ...context, //enableEmailBranding
     contents,
     email,
     name,
     user: user || {},
   }
 
-  body = await processString(body, context)
-  // this should now be the complete email HTML
+  const core = branding + body
+
+  body = await processString(core, context)
+
+  // Conditional elements
+  // branding = await processString(branding, {
+  //   ...context,
+  //   body,
+  // })
+
+  // this should now be the core email HTML
   return processString(base, {
     ...context,
-    body,
+    body, //: branding, // pass as body as usual
   })
+
+  // body = await processString(body, context)
+  // // this should now be the coree email HTML
+  // return processString(base, {
+  //   ...context,
+  //   body,
+  // })
 }
 
 /**
diff --git a/packages/worker/src/utilities/templates.ts b/packages/worker/src/utilities/templates.ts
index 1597325c7c..f801bdbb03 100644
--- a/packages/worker/src/utilities/templates.ts
+++ b/packages/worker/src/utilities/templates.ts
@@ -25,6 +25,11 @@ export async function getSettingsTemplateContext(
     [InternalTemplateBinding.CURRENT_DATE]: new Date().toISOString(),
     [InternalTemplateBinding.CURRENT_YEAR]: new Date().getFullYear(),
   }
+
+  // Need to be careful with the binding as it shouldn't be surfacable
+  // Also default to false if not explicit
+  context["enableEmailBranding"] = settings.emailBrandingEnabled
+
   // attach purpose specific context
   switch (purpose) {
     case EmailTemplatePurpose.PASSWORD_RECOVERY:

From 253ee413a28689e8311f188af674aa1437afe179 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Thu, 16 Mar 2023 09:07:21 +0000
Subject: [PATCH 03/14] Working commit

---
 packages/bbui/src/Form/Core/File.svelte       |  85 ++++-----
 packages/bbui/src/Form/File.svelte            |  14 +-
 .../builder/src/pages/builder/Branding.svelte |  59 ++++++
 .../src/pages/builder/auth/login.svelte       |   2 +-
 .../builder/portal/settings/branding.svelte   | 180 +++++++++++++-----
 .../portal/settings/organisation.svelte       |  16 +-
 .../builder/src/stores/portal/organisation.js |   9 +-
 .../src/api/controllers/static/index.ts       |  12 +-
 .../static/templates/BudibaseApp.svelte       |  27 ++-
 packages/types/src/documents/global/config.ts |   8 +-
 packages/worker/src/constants/index.ts        |   1 +
 .../worker/src/constants/templates/core.hbs   |  14 +-
 .../worker/src/constants/templates/index.ts   |   3 +-
 packages/worker/src/utilities/email.ts        |  30 +--
 14 files changed, 296 insertions(+), 164 deletions(-)
 create mode 100644 packages/builder/src/pages/builder/Branding.svelte

diff --git a/packages/bbui/src/Form/Core/File.svelte b/packages/bbui/src/Form/Core/File.svelte
index 3ca749e908..313ff409df 100644
--- a/packages/bbui/src/Form/Core/File.svelte
+++ b/packages/bbui/src/Form/Core/File.svelte
@@ -4,73 +4,35 @@
   import Icon from "../../Icon/Icon.svelte"
   import { createEventDispatcher } from "svelte"
 
-  export let value = null //support multi?
+  export let value = null
   export let title = "Upload file"
   export let disabled = false
-  export let extensions = "*"
+  export let extensions = null
   export let handleFileTooLarge = null
-  export let handleTooManyFiles = null
-  export let fileSizeLimit = BYTES_IN_MB * 20 // Centralise
+  export let fileSizeLimit = BYTES_IN_MB * 20
   export let id = null
+  export let previewUrl = null
 
-  const dispatch = createEventDispatcher()
-
-  //Is this necessary?
   const fieldId = id || uuid()
-
-  // Centralise all in new file section?
   const BYTES_IN_KB = 1000
   const BYTES_IN_MB = 1000000
 
+  const dispatch = createEventDispatcher()
+
   let fileInput
-  // $: file = value[0] || null
 
-  // const imageExtensions = [
-  //   "png",
-  //   "tiff",
-  //   "gif",
-  //   "raw",
-  //   "jpg",
-  //   "jpeg",
-  //   "svg",
-  //   "bmp",
-  //   "jfif",
-  // ]
+  $: inputAccept = Array.isArray(extensions) ? extensions.join(",") : "*"
 
-  // Should support only 1 file for now.
-  // Files[0]
-
-  //What is the limit? 50mb?
-
-  async function processFileList(fileList) {
-    if (
-      handleFileTooLarge &&
-      Array.from(fileList).some(file => file.size >= fileSizeLimit)
-    ) {
-      handleFileTooLarge(fileSizeLimit, value)
+  async function processFile(targetFile) {
+    if (handleFileTooLarge && targetFile?.size >= fileSizeLimit) {
+      handleFileTooLarge(targetFile)
       return
     }
-
-    const fileCount = fileList.length + value.length
-    if (handleTooManyFiles && maximum && fileCount > maximum) {
-      handleTooManyFiles(maximum)
-      return
-    }
-
-    if (processFiles) {
-      const processedFiles = await processFiles(fileList)
-      const newValue = [...value, ...processedFiles]
-      dispatch("change", newValue)
-      selectedImageIdx = newValue.length - 1
-    } else {
-      dispatch("change", fileList)
-    }
+    dispatch("change", targetFile)
   }
 
   function handleFile(evt) {
-    console.log("Hello ", evt.target.files[0])
-    dispatch("change", evt.target.files[0])
-    //processFileList(evt.target.files)
+    processFile(evt.target.files[0])
   }
 
   function clearFile() {
@@ -82,7 +44,7 @@
   id={fieldId}
   {disabled}
   type="file"
-  accept={extensions}
+  accept={inputAccept}
   bind:this={fileInput}
   on:change={handleFile}
 />
@@ -90,7 +52,9 @@
 <div class="field">
   {#if value}
     <div class="file-view">
-      <!-- <img alt="" src={value.url} /> -->
+      {#if previewUrl}
+        <img class="preview" alt="" src={previewUrl} />
+      {/if}
       <div class="filename">{value.name}</div>
       {#if value.size}
         <div class="filesize">
@@ -128,6 +92,23 @@
     display: none;
   }
   .delete-button {
+    transition: all 0.3s;
+    margin-left: 10px;
+    display: flex;
+  }
+  .delete-button:hover {
     cursor: pointer;
+    color: var(--red);
+  }
+  .filesize {
+    white-space: nowrap;
+  }
+  .filename {
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+  .preview {
+    height: 1.5em;
   }
 </style>
diff --git a/packages/bbui/src/Form/File.svelte b/packages/bbui/src/Form/File.svelte
index edc096c902..6be47d6a69 100644
--- a/packages/bbui/src/Form/File.svelte
+++ b/packages/bbui/src/Form/File.svelte
@@ -6,6 +6,9 @@
   export let label = null
   export let labelPosition = "above"
   export let disabled = false
+  export let handleFileTooLarge = () => {}
+  export let previewUrl = null
+  export let extensions = null
   export let error = null
   export let title = null
   export let value = null
@@ -19,5 +22,14 @@
 </script>
 
 <Field {label} {labelPosition} {error} {tooltip}>
-  <CoreFile {error} {disabled} {title} {value} on:change={onChange} />
+  <CoreFile
+    {error}
+    {disabled}
+    {title}
+    {value}
+    {previewUrl}
+    {handleFileTooLarge}
+    {extensions}
+    on:change={onChange}
+  />
 </Field>
diff --git a/packages/builder/src/pages/builder/Branding.svelte b/packages/builder/src/pages/builder/Branding.svelte
new file mode 100644
index 0000000000..c286088a6e
--- /dev/null
+++ b/packages/builder/src/pages/builder/Branding.svelte
@@ -0,0 +1,59 @@
+<script>
+  import { organisation, auth, admin } from "stores/portal"
+  import { onMount } from "svelte"
+
+  let loaded = false
+  let platformTitle = null
+
+  $: platformTitleText = $organisation.platformTitle
+  $: platformTitleText,
+    (platformTitle =
+      !$admin.isCloud && !$auth.user ? platformTitleText : "Budibase")
+
+  onMount(async () => {
+    await organisation.init()
+    loaded = true
+  })
+</script>
+
+<!--
+  In order to update the org elements, an update will have to be made to clear them.
+-->
+
+<svelte:head>
+  <title>{platformTitle}</title>
+
+  {#if loaded && !$auth.user}
+    <link
+      rel="icon"
+      href={$organisation.faviconUrl || "https://i.imgur.com/Xhdt1YP.png"}
+    />
+  {:else}
+    <!-- A default must be set or the browser defaults to favicon.ico behaviour -->
+    <link rel="icon" href={"https://i.imgur.com/Xhdt1YP.png"} />
+  {/if}
+
+  <!-- Primary Meta Tags -->
+  <!-- <meta name="title" content={metaTitle} /> -->
+  <!-- 
+      metaTitle should match the title... 
+      should title override metaTitle, if set??
+    -->
+
+  <!-- <meta name="description" content={metaDescription} /> -->
+
+  <!-- Opengraph Meta Tags -->
+  <!-- <meta property="og:site_name" content="Budibase" />
+    <meta property="og:title" content="{title} - built with Budibase" />
+    <meta property="og:description" content={metaDescription} />
+    <meta property="og:type" content="website" />
+    <meta property="og:image" content={metaImage} /> -->
+
+  <!-- Twitter -->
+  <!-- <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:site" content="@budibase" />
+    <meta name="twitter:image" content={metaImage} /> -->
+  <!-- Consider adding this twitter:image:alt -->
+  <!-- <meta name="twitter:title" content="{title} - built with Budibase" />
+    <meta property="twitter:description" content={metaDescription} /> -->
+</svelte:head>
diff --git a/packages/builder/src/pages/builder/auth/login.svelte b/packages/builder/src/pages/builder/auth/login.svelte
index 10d01293ab..372516ebb9 100644
--- a/packages/builder/src/pages/builder/auth/login.svelte
+++ b/packages/builder/src/pages/builder/auth/login.svelte
@@ -147,7 +147,7 @@
         </Layout>
       {/if}
 
-      {#if cloud && $organisation.licenceAgreementEnabled}
+      {#if cloud && $organisation.licenseAgreementEnabled}
         <Body size="xs" textAlign="center">
           By using Budibase Cloud
           <br />
diff --git a/packages/builder/src/pages/builder/portal/settings/branding.svelte b/packages/builder/src/pages/builder/portal/settings/branding.svelte
index 73569e93a3..bc6f678bc3 100644
--- a/packages/builder/src/pages/builder/portal/settings/branding.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/branding.svelte
@@ -12,15 +12,34 @@
     Toggle,
     Input,
     Label,
+    TextArea,
   } from "@budibase/bbui"
   import { auth, organisation, licensing, admin } from "stores/portal"
   import { API } from "api"
   import { onMount } from "svelte"
 
+  const imageExtensions = [
+    ".png",
+    ".tiff",
+    ".gif",
+    ".raw",
+    ".jpg",
+    ".jpeg",
+    ".svg",
+    ".bmp",
+    ".jfif",
+  ]
+
+  const faviconExtensions = [".png", ".ico", ".gif"]
+
   let loaded = false
   let saving = false
+
   let logoFile = null
+  let logoPreview = null
+
   let faviconFile = null
+  let faviconPreview = null
 
   let config = {}
   let updated = false
@@ -39,9 +58,45 @@
     : null
 
   $: favicon = config.faviconUrl
-    ? { url: config.logoUrl, type: "image", name: "Favicon" }
+    ? { url: config.faviconUrl, type: "image", name: "Favicon" }
     : null
 
+  //If type of file do this IN the picker
+  //If string use the string
+  //If object?.url us that
+  const previewUrl = async localFile => {
+    if (!localFile) {
+      return Promise.resolve(null)
+    }
+
+    return new Promise(resolve => {
+      let reader = new FileReader()
+      try {
+        reader.onload = e => {
+          resolve({
+            result: e.target.result,
+          })
+        }
+        reader.readAsDataURL(localFile)
+      } catch (error) {
+        console.error(error)
+        resolve(null)
+      }
+    })
+  }
+
+  $: previewUrl(logoFile).then(response => {
+    if (response) {
+      logoPreview = response.result
+    }
+  })
+
+  $: previewUrl(faviconFile).then(response => {
+    if (response) {
+      faviconPreview = response.result
+    }
+  })
+
   async function uploadLogo(file) {
     let response = {}
     try {
@@ -54,8 +109,6 @@
     return response
   }
 
-  // Limit file types
-  // PNG, GIF, or ICO?
   async function uploadFavicon(file) {
     let response = {}
     try {
@@ -70,9 +123,7 @@
 
   async function saveConfig() {
     saving = true
-
-    console.log("Save Config")
-
+    console.log("SAVING CONFIG ")
     if (logoFile) {
       const logoResp = await uploadLogo(logoFile)
       if (logoResp.url) {
@@ -80,8 +131,8 @@
           ...config,
           logoUrl: logoResp.url,
         }
-      } else {
-        //would have to delete
+        logoFile = null
+        logoPreview = null
       }
     }
 
@@ -92,6 +143,8 @@
           ...config,
           faviconUrl: faviconResp.url,
         }
+        faviconFile = null
+        faviconPreview = null
       }
     }
     console.log("SAVE CONFIG ", config)
@@ -111,28 +164,19 @@
   onMount(async () => {
     await organisation.init()
 
-    const {
-      faviconUrl,
-      logoUrl,
-      platformTitle,
-      emailBrandingEnabled,
-      appFooterEnabled,
-      loginHeading,
-      loginButton,
-      licenceAgreementEnabled,
-      testimonialsEnabled,
-    } = $organisation
-
     config = {
-      faviconUrl,
-      logoUrl,
-      platformTitle,
-      emailBrandingEnabled,
-      appFooterEnabled,
-      loginHeading,
-      loginButton,
-      licenceAgreementEnabled,
-      testimonialsEnabled,
+      faviconUrl: $organisation.faviconUrl,
+      logoUrl: $organisation.logoUrl,
+      platformTitle: $organisation.platformTitle,
+      emailBrandingEnabled: $organisation.emailBrandingEnabled,
+      appFooterEnabled: $organisation.appFooterEnabled,
+      loginHeading: $organisation.loginHeading,
+      loginButton: $organisation.loginButton,
+      licenseAgreementEnabled: $organisation.licenseAgreementEnabled,
+      testimonialsEnabled: $organisation.testimonialsEnabled,
+      metaDescription: $organisation.metaDescription,
+      metaImageUrl: $organisation.metaImageUrl,
+      metaTitle: $organisation.metaTitle,
     }
 
     loaded = true
@@ -158,17 +202,24 @@
         <Label size="L">Logo</Label>
         <File
           title="Upload image"
+          handleFileTooLarge={() => {
+            notifications.warn("File too large. 20mb limit")
+          }}
+          extensions={imageExtensions}
+          previewUrl={logoPreview || logo?.url}
           on:change={e => {
             console.log("Updated Logo")
             let clone = { ...config }
             if (e.detail) {
               logoFile = e.detail
+              logoPreview = null
             } else {
+              logoFile = null
               clone.logoUrl = ""
             }
             config = clone
           }}
-          value={logo}
+          value={logoFile || logo}
         />
       </div>
 
@@ -176,17 +227,22 @@
         <Label size="L">Favicon</Label>
         <File
           title="Upload image"
+          handleFileTooLarge={() => {
+            notifications.warn("File too large. 20mb limit")
+          }}
+          extensions={faviconExtensions}
+          previewUrl={faviconPreview || favicon?.url}
           on:change={e => {
-            console.log("Updated Favicon")
             let clone = { ...config }
             if (e.detail) {
               faviconFile = e.detail
+              faviconPreview = null
             } else {
               clone.faviconUrl = ""
             }
             config = clone
           }}
-          value={favicon}
+          value={faviconFile || favicon}
         />
       </div>
       <div class="field">
@@ -197,12 +253,12 @@
             clone.platformTitle = e.detail ? e.detail : ""
             config = clone
           }}
-          value={config.platformTitle || "Budibase"}
+          value={config.platformTitle || ""}
         />
       </div>
       <div>
         <Toggle
-          text={"Remove Buidbase brand from emails"}
+          text={"Remove Budibase brand from emails"}
           on:change={e => {
             let clone = { ...config }
             clone.emailBrandingEnabled = !e.detail
@@ -222,7 +278,6 @@
       </div>
     </div>
 
-    <!-- Should this be displayed? -->
     {#if !$admin.cloud}
       <Divider />
       <Layout gap="XS" noPadding>
@@ -239,7 +294,7 @@
                 clone.loginHeading = e.detail ? e.detail : ""
                 config = clone
               }}
-              value={config.loginHeading || "Log in to Budibase"}
+              value={config.loginHeading || ""}
             />
           </div>
 
@@ -251,7 +306,7 @@
                 clone.loginButton = e.detail ? e.detail : ""
                 config = clone
               }}
-              value={config.loginButton || "Log in to Budibase"}
+              value={config.loginButton || ""}
             />
           </div>
           <div>
@@ -265,13 +320,13 @@
               value={!config.testimonialsEnabled}
             />
             <Toggle
-              text={"Remove licence agreement"}
+              text={"Remove license agreement"}
               on:change={e => {
                 let clone = { ...config }
-                clone.licenceAgreementEnabled = !e.detail
+                clone.licenseAgreementEnabled = !e.detail
                 config = clone
               }}
-              value={!config.licenceAgreementEnabled}
+              value={!config.licenseAgreementEnabled}
             />
           </div>
         </div>
@@ -285,15 +340,37 @@
     <div class="app-previews">
       <div class="fields">
         <div class="field">
-          <!-- <Label size="L">Header</Label>
-            <Input
-              on:change={e => {
-                let clone = { ...config }
-                clone.loginHeading = e.detail ? e.detail : ""
-                config = clone
-              }}
-              value={config.loginHeading || "Log in to Budibase"}
-            /> -->
+          <Label size="L">Image URL</Label>
+          <Input
+            on:change={e => {
+              let clone = { ...config }
+              clone.metaImageUrl = e.detail ? e.detail : ""
+              config = clone
+            }}
+            value={config.metaImageUrl}
+          />
+        </div>
+        <div class="field">
+          <Label size="L">Title</Label>
+          <Input
+            on:change={e => {
+              let clone = { ...config }
+              clone.metaTitle = e.detail ? e.detail : ""
+              config = clone
+            }}
+            value={config.metaTitle}
+          />
+        </div>
+        <div class="field">
+          <Label size="L">Description</Label>
+          <TextArea
+            on:change={e => {
+              let clone = { ...config }
+              clone.metaDescription = e.detail ? e.detail : ""
+              config = clone
+            }}
+            value={config.metaDescription}
+          />
         </div>
       </div>
     </div>
@@ -316,7 +393,8 @@
 
   .branding,
   .login {
-    width: 60%;
+    width: 70%;
+    max-width: 70%;
   }
   .fields {
     display: grid;
@@ -324,7 +402,7 @@
   }
   .field {
     display: grid;
-    grid-template-columns: 80px 1fr;
+    grid-template-columns: 80px auto;
     grid-gap: var(--spacing-l);
     align-items: center;
   }
diff --git a/packages/builder/src/pages/builder/portal/settings/organisation.svelte b/packages/builder/src/pages/builder/portal/settings/organisation.svelte
index 7816600fe6..48919b5f0b 100644
--- a/packages/builder/src/pages/builder/portal/settings/organisation.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/organisation.svelte
@@ -7,12 +7,10 @@
     Divider,
     Label,
     Input,
-    // Dropzone,
     notifications,
     Toggle,
   } from "@budibase/bbui"
   import { auth, organisation, admin } from "stores/portal"
-  import { API } from "api"
   import { writable } from "svelte/store"
   import { redirect } from "@roxi/routify"
 
@@ -28,21 +26,9 @@
     company: $organisation.company,
     platformUrl: $organisation.platformUrl,
     analyticsEnabled: $organisation.analyticsEnabled,
-    // logo: $organisation.logoUrl
-    //   ? { url: $organisation.logoUrl, type: "image", name: "Logo" }
-    //   : null,
   })
-  let loading = false
 
-  // async function uploadLogo(file) {
-  //   try {
-  //     let data = new FormData()
-  //     data.append("file", file)
-  //     await API.uploadLogo(data)
-  //   } catch (error) {
-  //     notifications.error("Error uploading logo")
-  //   }
-  // }
+  let loading = false
 
   async function saveConfig() {
     loading = true
diff --git a/packages/builder/src/stores/portal/organisation.js b/packages/builder/src/stores/portal/organisation.js
index 4b633bd5e9..839764871e 100644
--- a/packages/builder/src/stores/portal/organisation.js
+++ b/packages/builder/src/stores/portal/organisation.js
@@ -7,17 +7,20 @@ const DEFAULT_CONFIG = {
   platformUrl: "",
 
   logoUrl: undefined,
-  faviconUrl: undefined,
 
+  faviconUrl: undefined,
   emailBrandingEnabled: true,
   appFooterEnabled: true,
-  // Self host only
   testimonialsEnabled: true,
-  licenceAgreementEnabled: true,
+  licenseAgreementEnabled: true,
   platformTitle: "Budibase",
   loginHeading: undefined,
   loginButton: undefined,
 
+  metaDescription: undefined,
+  metaImageUrl: undefined,
+  metaTitle: undefined,
+
   docsUrl: undefined,
   company: "Budibase",
   oidc: undefined,
diff --git a/packages/server/src/api/controllers/static/index.ts b/packages/server/src/api/controllers/static/index.ts
index a12e1b5713..069a798c5e 100644
--- a/packages/server/src/api/controllers/static/index.ts
+++ b/packages/server/src/api/controllers/static/index.ts
@@ -11,10 +11,11 @@ import {
 } from "../../../utilities/fileSystem"
 import env from "../../../environment"
 import { DocumentType } from "../../../db/utils"
-import { context, objectStore, utils } from "@budibase/backend-core"
+import { context, objectStore, utils, configs } from "@budibase/backend-core"
 import AWS from "aws-sdk"
 import fs from "fs"
 import sdk from "../../../sdk"
+
 const send = require("koa-send")
 
 async function prepareUpload({ s3Key, bucket, metadata, file }: any) {
@@ -98,6 +99,8 @@ export const deleteObjects = async function (ctx: any) {
 }
 
 export const serveApp = async function (ctx: any) {
+  const { config } = await configs.getSettingsConfigDoc()
+
   const db = context.getAppDB({ skip_setup: true })
   const appInfo = await db.get(DocumentType.APP_METADATA)
   let appId = context.getAppId()
@@ -105,16 +108,19 @@ export const serveApp = async function (ctx: any) {
   if (!env.isJest()) {
     const App = require("./templates/BudibaseApp.svelte").default
     const plugins = objectStore.enrichPluginURLs(appInfo.usedPlugins)
-    console.log(appInfo)
     const { head, html, css } = App.render({
       metaImage:
+        config?.metaImageUrl ||
         "https://res.cloudinary.com/daog6scxm/image/upload/v1666109324/meta-images/budibase-meta-image_uukc1m.png",
-      title: appInfo.name, //Replace Title here?
+      metaDescription: config?.metaDescription || "",
+      metaTitle: `${appInfo.name} - built with Budibase` || config?.metaTitle,
+      title: appInfo.name,
       production: env.isProd(),
       appId,
       clientLibPath: objectStore.clientLibraryUrl(appId!, appInfo.version),
       usedPlugins: plugins,
       favicon: objectStore.getGlobalFileUrl("settings", "faviconUrl"),
+      //logo: objectStore.getGlobalFileUrl("settings", "logoUrl"),
     })
 
     const appHbs = loadHandlebarsFile(`${__dirname}/templates/app.hbs`)
diff --git a/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte b/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte
index be06c4f46e..0667e8d2b8 100644
--- a/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte
+++ b/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte
@@ -1,7 +1,10 @@
 <script>
   export let title = ""
   export let favicon = ""
+
   export let metaImage = ""
+  export let metaTitle = ""
+  export let metaDescription = ""
 
   export let clientLibPath
   export let usedPlugins
@@ -13,15 +16,31 @@
     name="viewport"
     content="width=device-width, initial-scale=1.0, viewport-fit=cover"
   />
+
+  <!-- Primary Meta Tags -->
+  <meta name="title" content={metaTitle} />
+  <meta name="description" content={metaDescription} />
+
+  <!-- 
+    metaTitle should match the title... 
+    should title override metaTitle, if set??
+  -->
+
   <!-- Opengraph Meta Tags -->
-  <meta name="twitter:card" content="summary_large_image" />
-  <meta name="twitter:site" content="@budibase" />
-  <meta name="twitter:image" content={metaImage} />
-  <meta name="twitter:title" content="{title} - built with Budibase" />
   <meta property="og:site_name" content="Budibase" />
   <meta property="og:title" content="{title} - built with Budibase" />
+  <meta property="og:description" content={metaDescription} />
   <meta property="og:type" content="website" />
   <meta property="og:image" content={metaImage} />
+
+  <!-- Twitter -->
+  <meta property="twitter:card" content="summary_large_image" />
+  <meta property="twitter:site" content="@budibase" />
+  <meta property="twitter:image" content={metaImage} />
+  <!-- Consider adding this twitter:image:alt -->
+  <meta property="twitter:title" content="{title} - built with Budibase" />
+  <meta property="twitter:description" content={metaDescription} />
+
   <title>{title}</title>
   <link rel="icon" type="image/png" href={favicon} />
   <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
diff --git a/packages/types/src/documents/global/config.ts b/packages/types/src/documents/global/config.ts
index 1146c5910e..95a98641d6 100644
--- a/packages/types/src/documents/global/config.ts
+++ b/packages/types/src/documents/global/config.ts
@@ -32,15 +32,17 @@ export interface SettingsInnerConfig {
   faviconUrlEtag?: string
 
   emailBrandingEnabled?: boolean
-
-  // Self host only
   appFooterEnabled?: boolean
   testimonialsEnabled?: boolean
-  licenceAgreementEnabled?: boolean
+  licenseAgreementEnabled?: boolean
   platformTitle?: string
   loginHeading?: string
   loginButton?: string
 
+  metaDescription?: string
+  metaImageUrl?: string
+  metaTitle?: string
+
   uniqueTenantId?: string
   analyticsEnabled?: boolean
   isSSOEnforced?: boolean
diff --git a/packages/worker/src/constants/index.ts b/packages/worker/src/constants/index.ts
index dba058eabb..4301569a3a 100644
--- a/packages/worker/src/constants/index.ts
+++ b/packages/worker/src/constants/index.ts
@@ -20,6 +20,7 @@ export enum TemplateType {
 }
 
 export enum EmailTemplatePurpose {
+  CORE = "core",
   BASE = "base",
   PASSWORD_RECOVERY = "password_recovery",
   INVITATION = "invitation",
diff --git a/packages/worker/src/constants/templates/core.hbs b/packages/worker/src/constants/templates/core.hbs
index 3511aaa460..614cf8dc9d 100644
--- a/packages/worker/src/constants/templates/core.hbs
+++ b/packages/worker/src/constants/templates/core.hbs
@@ -10,18 +10,18 @@
       >
         <tbody>
           <tr>
-            <td
-              style="padding:0 35px;vertical-align: middle;"
-              cellpadding="0"
-              cellspacing="0"
-            >
+            <td style="padding:0 35px;" cellpadding="0" cellspacing="0">
               <img
                 width="32px"
-                style="margin-right: 16px;"
+                style="margin-right:16px; vertical-align: middle;"
                 alt="Budibase Logo"
                 src="https://i.imgur.com/Xhdt1YP.png"
               />
-              <h2 style="margin: 0px">Budibase</h2>
+              <strong
+                style="color:#333333; vertical-align: middle; font-size: 1.1em"
+              >
+                Budibase
+              </strong>
             </td>
           </tr>
         </tbody>
diff --git a/packages/worker/src/constants/templates/index.ts b/packages/worker/src/constants/templates/index.ts
index 8c3899b1df..1feac62040 100644
--- a/packages/worker/src/constants/templates/index.ts
+++ b/packages/worker/src/constants/templates/index.ts
@@ -21,8 +21,7 @@ export const EmailTemplates = {
     join(__dirname, "welcome.hbs")
   ),
   [EmailTemplatePurpose.CUSTOM]: readStaticFile(join(__dirname, "custom.hbs")),
-  //Core wrapper
-  ["branding"]: readStaticFile(join(__dirname, "core.hbs")),
+  [EmailTemplatePurpose.CORE]: readStaticFile(join(__dirname, "core.hbs")),
 }
 
 export function addBaseTemplates(templates: Template[], type?: string) {
diff --git a/packages/worker/src/utilities/email.ts b/packages/worker/src/utilities/email.ts
index 870dcc33fd..192126907b 100644
--- a/packages/worker/src/utilities/email.ts
+++ b/packages/worker/src/utilities/email.ts
@@ -108,53 +108,39 @@ async function buildEmail(
   let [base, body] = await Promise.all([
     getTemplateByPurpose(TYPE, EmailTemplatePurpose.BASE),
     getTemplateByPurpose(TYPE, purpose),
-    //getTemplateByPurpose(TYPE, "branding"), //should generalise to 'branding'
   ])
 
-  let branding = EmailTemplates["branding"]
+  // Change from branding to core
+  let core = EmailTemplates.core
 
-  if (!base || !body || !branding) {
+  if (!base || !body || !core) {
     throw "Unable to build email, missing base components"
   }
   base = base.contents
   body = body.contents
 
-  //branding = branding.contents
-
   let name = user ? user.name : undefined
   if (user && !name && user.firstName) {
     name = user.lastName ? `${user.firstName} ${user.lastName}` : user.firstName
   }
   context = {
-    ...context, //enableEmailBranding
+    ...context,
     contents,
     email,
     name,
     user: user || {},
   }
 
-  const core = branding + body
+  // Prepend the core template
+  const fullBody = core + body
 
-  body = await processString(core, context)
-
-  // Conditional elements
-  // branding = await processString(branding, {
-  //   ...context,
-  //   body,
-  // })
+  body = await processString(fullBody, context)
 
   // this should now be the core email HTML
   return processString(base, {
     ...context,
-    body, //: branding, // pass as body as usual
+    body,
   })
-
-  // body = await processString(body, context)
-  // // this should now be the coree email HTML
-  // return processString(base, {
-  //   ...context,
-  //   body,
-  // })
 }
 
 /**

From bfd7e49c72a88933d31c317915eef1d83a07dcdd Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Tue, 21 Mar 2023 09:20:43 +0000
Subject: [PATCH 04/14] Template fixes and updates to the file picker. Error
 handling added to display a warning when navigating to an unpublished or
 invalid app url.

---
 packages/bbui/src/Form/Core/File.svelte       |   5 +-
 packages/bbui/src/Form/File.svelte            |   2 +
 .../builder/src/pages/builder/Branding.svelte |  35 +-----
 .../src/pages/builder/auth/login.svelte       |   4 +-
 .../builder/portal/settings/branding.svelte   | 115 +++++++++++-------
 .../builder/src/stores/portal/organisation.js |   5 -
 packages/client/src/stores/index.js           |   1 +
 packages/client/src/stores/initialise.js      |   2 +
 packages/client/src/stores/org.js             |  27 ++++
 packages/client/src/stores/screens.js         |   8 ++
 .../src/api/controllers/static/index.ts       |  93 +++++++++-----
 .../static/templates/BudibaseApp.svelte       |  29 +++--
 packages/types/src/documents/global/config.ts |   1 -
 .../worker/src/constants/templates/core.hbs   |  10 +-
 packages/worker/src/utilities/templates.ts    |   4 +-
 15 files changed, 209 insertions(+), 132 deletions(-)
 create mode 100644 packages/client/src/stores/org.js

diff --git a/packages/bbui/src/Form/Core/File.svelte b/packages/bbui/src/Form/Core/File.svelte
index 313ff409df..618cccd941 100644
--- a/packages/bbui/src/Form/Core/File.svelte
+++ b/packages/bbui/src/Form/Core/File.svelte
@@ -7,6 +7,7 @@
   export let value = null
   export let title = "Upload file"
   export let disabled = false
+  export let allowClear = null
   export let extensions = null
   export let handleFileTooLarge = null
   export let fileSizeLimit = BYTES_IN_MB * 20
@@ -65,14 +66,14 @@
           {/if}
         </div>
       {/if}
-      {#if !disabled}
+      {#if !disabled || (allowClear === true && disabled)}
         <div class="delete-button" on:click={clearFile}>
           <Icon name="Close" size="XS" />
         </div>
       {/if}
     </div>
   {/if}
-  <ActionButton on:click={fileInput.click()}>{title}</ActionButton>
+  <ActionButton {disabled} on:click={fileInput.click()}>{title}</ActionButton>
 </div>
 
 <style>
diff --git a/packages/bbui/src/Form/File.svelte b/packages/bbui/src/Form/File.svelte
index 6be47d6a69..03cacea814 100644
--- a/packages/bbui/src/Form/File.svelte
+++ b/packages/bbui/src/Form/File.svelte
@@ -6,6 +6,7 @@
   export let label = null
   export let labelPosition = "above"
   export let disabled = false
+  export let allowClear = null
   export let handleFileTooLarge = () => {}
   export let previewUrl = null
   export let extensions = null
@@ -25,6 +26,7 @@
   <CoreFile
     {error}
     {disabled}
+    {allowClear}
     {title}
     {value}
     {previewUrl}
diff --git a/packages/builder/src/pages/builder/Branding.svelte b/packages/builder/src/pages/builder/Branding.svelte
index c286088a6e..1b5acd9b8d 100644
--- a/packages/builder/src/pages/builder/Branding.svelte
+++ b/packages/builder/src/pages/builder/Branding.svelte
@@ -8,7 +8,9 @@
   $: platformTitleText = $organisation.platformTitle
   $: platformTitleText,
     (platformTitle =
-      !$admin.isCloud && !$auth.user ? platformTitleText : "Budibase")
+      !$admin.isCloud || !$auth.user ? platformTitleText : "Budibase")
+
+  $: faviconUrl = $organisation.faviconUrl || "https://i.imgur.com/Xhdt1YP.png"
 
   onMount(async () => {
     await organisation.init()
@@ -23,37 +25,10 @@
 <svelte:head>
   <title>{platformTitle}</title>
 
-  {#if loaded && !$auth.user}
-    <link
-      rel="icon"
-      href={$organisation.faviconUrl || "https://i.imgur.com/Xhdt1YP.png"}
-    />
+  {#if loaded && !$auth.user && faviconUrl}
+    <link rel="icon" href={faviconUrl} />
   {:else}
     <!-- A default must be set or the browser defaults to favicon.ico behaviour -->
     <link rel="icon" href={"https://i.imgur.com/Xhdt1YP.png"} />
   {/if}
-
-  <!-- Primary Meta Tags -->
-  <!-- <meta name="title" content={metaTitle} /> -->
-  <!-- 
-      metaTitle should match the title... 
-      should title override metaTitle, if set??
-    -->
-
-  <!-- <meta name="description" content={metaDescription} /> -->
-
-  <!-- Opengraph Meta Tags -->
-  <!-- <meta property="og:site_name" content="Budibase" />
-    <meta property="og:title" content="{title} - built with Budibase" />
-    <meta property="og:description" content={metaDescription} />
-    <meta property="og:type" content="website" />
-    <meta property="og:image" content={metaImage} /> -->
-
-  <!-- Twitter -->
-  <!-- <meta name="twitter:card" content="summary_large_image" />
-    <meta name="twitter:site" content="@budibase" />
-    <meta name="twitter:image" content={metaImage} /> -->
-  <!-- Consider adding this twitter:image:alt -->
-  <!-- <meta name="twitter:title" content="{title} - built with Budibase" />
-    <meta property="twitter:description" content={metaDescription} /> -->
 </svelte:head>
diff --git a/packages/builder/src/pages/builder/auth/login.svelte b/packages/builder/src/pages/builder/auth/login.svelte
index 372516ebb9..91031b3d04 100644
--- a/packages/builder/src/pages/builder/auth/login.svelte
+++ b/packages/builder/src/pages/builder/auth/login.svelte
@@ -30,7 +30,7 @@
   async function login() {
     form.validate()
     if (Object.keys(errors).length > 0) {
-      console.log("errors")
+      console.log("errors", errors)
       return
     }
     try {
@@ -135,7 +135,7 @@
             disabled={Object.keys(errors).length > 0}
             on:click={login}
           >
-            {$organisation.loginButton || `Log in to {company}`}
+            {$organisation.loginButton || `Log in to ${company}`}
           </Button>
         </Layout>
         <Layout gap="XS" noPadding justifyItems="center">
diff --git a/packages/builder/src/pages/builder/portal/settings/branding.svelte b/packages/builder/src/pages/builder/portal/settings/branding.svelte
index bc6f678bc3..1406e29d4c 100644
--- a/packages/builder/src/pages/builder/portal/settings/branding.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/branding.svelte
@@ -17,6 +17,7 @@
   import { auth, organisation, licensing, admin } from "stores/portal"
   import { API } from "api"
   import { onMount } from "svelte"
+  import { goto } from "@roxi/routify"
 
   const imageExtensions = [
     ".png",
@@ -32,25 +33,32 @@
 
   const faviconExtensions = [".png", ".ico", ".gif"]
 
-  let loaded = false
+  let mounted = false
   let saving = false
 
   let logoFile = null
   let logoPreview = null
-
   let faviconFile = null
   let faviconPreview = null
 
   let config = {}
   let updated = false
-  $: onConfigUpdate(config)
+
+  $: onConfigUpdate(config, mounted)
+  $: init = Object.keys(config).length > 0
+
+  $: cloudPremium = !$licensing.isFreePlan
+  $: selfhostPremium = $licensing.isEnterprisePlan || $licensing.isBusinessPlan
+  $: isCloud = $admin.cloud
+
+  $: isLicenseLocked =
+    (isCloud && !cloudPremium) || (!isCloud && !selfhostPremium)
 
   const onConfigUpdate = config => {
-    if (!loaded || updated) {
+    if (!mounted || updated || !init) {
       return
     }
     updated = true
-    console.log("config updated ", config)
   }
 
   $: logo = config.logoUrl
@@ -61,9 +69,6 @@
     ? { url: config.faviconUrl, type: "image", name: "Favicon" }
     : null
 
-  //If type of file do this IN the picker
-  //If string use the string
-  //If object?.url us that
   const previewUrl = async localFile => {
     if (!localFile) {
       return Promise.resolve(null)
@@ -123,7 +128,7 @@
 
   async function saveConfig() {
     saving = true
-    console.log("SAVING CONFIG ")
+
     if (logoFile) {
       const logoResp = await uploadLogo(logoFile)
       if (logoResp.url) {
@@ -147,7 +152,6 @@
         faviconPreview = null
       }
     }
-    console.log("SAVE CONFIG ", config)
     try {
       // Update settings
       await organisation.save(config)
@@ -157,7 +161,7 @@
       console.error("Branding updated failed", e)
       notifications.error("Branding updated failed")
     }
-
+    updated = false
     saving = false
   }
 
@@ -169,7 +173,6 @@
       logoUrl: $organisation.logoUrl,
       platformTitle: $organisation.platformTitle,
       emailBrandingEnabled: $organisation.emailBrandingEnabled,
-      appFooterEnabled: $organisation.appFooterEnabled,
       loginHeading: $organisation.loginHeading,
       loginButton: $organisation.loginButton,
       licenseAgreementEnabled: $organisation.licenseAgreementEnabled,
@@ -178,21 +181,25 @@
       metaImageUrl: $organisation.metaImageUrl,
       metaTitle: $organisation.metaTitle,
     }
-
-    loaded = true
+    mounted = true
   })
 </script>
 
-{#if $auth.isAdmin && loaded}
+{#if $auth.isAdmin && mounted}
   <Layout noPadding>
     <Layout gap="XS" noPadding>
       <div class="title">
         <Heading size="M">Branding</Heading>
-        {#if !$licensing.isBusinessPlan}
+        {#if !isCloud && !selfhostPremium}
           <Tags>
             <Tag icon="LockClosed">Business</Tag>
           </Tags>
         {/if}
+        {#if isCloud && !cloudPremium}
+          <Tags>
+            <Tag icon="LockClosed">Pro</Tag>
+          </Tags>
+        {/if}
       </div>
       <Body>Remove all Budibase branding and use your own.</Body>
     </Layout>
@@ -208,7 +215,6 @@
           extensions={imageExtensions}
           previewUrl={logoPreview || logo?.url}
           on:change={e => {
-            console.log("Updated Logo")
             let clone = { ...config }
             if (e.detail) {
               logoFile = e.detail
@@ -220,6 +226,8 @@
             config = clone
           }}
           value={logoFile || logo}
+          disabled={isLicenseLocked || saving}
+          allowClear={true}
         />
       </div>
 
@@ -243,19 +251,24 @@
             config = clone
           }}
           value={faviconFile || favicon}
+          disabled={isLicenseLocked || saving}
+          allowClear={true}
         />
       </div>
-      <div class="field">
-        <Label size="L">Title</Label>
-        <Input
-          on:change={e => {
-            let clone = { ...config }
-            clone.platformTitle = e.detail ? e.detail : ""
-            config = clone
-          }}
-          value={config.platformTitle || ""}
-        />
-      </div>
+      {#if !isCloud}
+        <div class="field">
+          <Label size="L">Title</Label>
+          <Input
+            on:change={e => {
+              let clone = { ...config }
+              clone.platformTitle = e.detail ? e.detail : ""
+              config = clone
+            }}
+            value={config.platformTitle || ""}
+            disabled={!selfhostPremium || saving}
+          />
+        </div>
+      {/if}
       <div>
         <Toggle
           text={"Remove Budibase brand from emails"}
@@ -265,24 +278,16 @@
             config = clone
           }}
           value={!config.emailBrandingEnabled}
-        />
-        <Toggle
-          text={"Remove Budibase footer from apps"}
-          on:change={e => {
-            let clone = { ...config }
-            clone.appFooterEnabled = !e.detail
-            config = clone
-          }}
-          value={!config.appFooterEnabled}
+          disabled={isLicenseLocked || saving}
         />
       </div>
     </div>
 
-    {#if !$admin.cloud}
+    {#if !isCloud}
       <Divider />
       <Layout gap="XS" noPadding>
-        <Heading size="S">Login page (Self host)</Heading>
-        <Body>You can only customise your login page in self host</Body>
+        <Heading size="S">Login page</Heading>
+        <Body />
       </Layout>
       <div class="login">
         <div class="fields">
@@ -295,6 +300,7 @@
                 config = clone
               }}
               value={config.loginHeading || ""}
+              disabled={!selfhostPremium || saving}
             />
           </div>
 
@@ -307,6 +313,7 @@
                 config = clone
               }}
               value={config.loginButton || ""}
+              disabled={!selfhostPremium || saving}
             />
           </div>
           <div>
@@ -318,6 +325,7 @@
                 config = clone
               }}
               value={!config.testimonialsEnabled}
+              disabled={!selfhostPremium || saving}
             />
             <Toggle
               text={"Remove license agreement"}
@@ -327,6 +335,7 @@
                 config = clone
               }}
               value={!config.licenseAgreementEnabled}
+              disabled={!selfhostPremium || saving}
             />
           </div>
         </div>
@@ -348,6 +357,7 @@
               config = clone
             }}
             value={config.metaImageUrl}
+            disabled={isLicenseLocked || saving}
           />
         </div>
         <div class="field">
@@ -359,6 +369,7 @@
               config = clone
             }}
             value={config.metaTitle}
+            disabled={isLicenseLocked || saving}
           />
         </div>
         <div class="field">
@@ -370,12 +381,28 @@
               config = clone
             }}
             value={config.metaDescription}
+            disabled={isLicenseLocked || saving}
           />
         </div>
       </div>
     </div>
-    <div>
-      <Button on:click={saveConfig} cta disabled={saving || !updated}>
+    <div class="buttons">
+      {#if isLicenseLocked}
+        <Button
+          on:click={() => {
+            if (isCloud && $auth?.user?.accountPortalAccess) {
+              window.open($admin.accountPortalUrl + "/portal/upgrade", "_blank")
+            } else if ($auth.isAdmin) {
+              $goto("/builder/portal/account/upgrade")
+            }
+          }}
+          secondary
+          disabled={saving}
+        >
+          Upgrade
+        </Button>
+      {/if}
+      <Button on:click={saveConfig} cta disabled={saving || !updated || !init}>
         Save
       </Button>
     </div>
@@ -383,6 +410,10 @@
 {/if}
 
 <style>
+  .buttons {
+    display: flex;
+    gap: var(--spacing-m);
+  }
   .title {
     display: flex;
     flex-direction: row;
diff --git a/packages/builder/src/stores/portal/organisation.js b/packages/builder/src/stores/portal/organisation.js
index 839764871e..c9bb80d6e9 100644
--- a/packages/builder/src/stores/portal/organisation.js
+++ b/packages/builder/src/stores/portal/organisation.js
@@ -5,22 +5,17 @@ import _ from "lodash"
 
 const DEFAULT_CONFIG = {
   platformUrl: "",
-
   logoUrl: undefined,
-
   faviconUrl: undefined,
   emailBrandingEnabled: true,
-  appFooterEnabled: true,
   testimonialsEnabled: true,
   licenseAgreementEnabled: true,
   platformTitle: "Budibase",
   loginHeading: undefined,
   loginButton: undefined,
-
   metaDescription: undefined,
   metaImageUrl: undefined,
   metaTitle: undefined,
-
   docsUrl: undefined,
   company: "Budibase",
   oidc: undefined,
diff --git a/packages/client/src/stores/index.js b/packages/client/src/stores/index.js
index 7548d31817..9530792353 100644
--- a/packages/client/src/stores/index.js
+++ b/packages/client/src/stores/index.js
@@ -16,6 +16,7 @@ export { rowSelectionStore } from "./rowSelection.js"
 export { blockStore } from "./blocks.js"
 export { environmentStore } from "./environment"
 export { eventStore } from "./events.js"
+export { orgStore } from "./org.js"
 export {
   dndStore,
   dndIndex,
diff --git a/packages/client/src/stores/initialise.js b/packages/client/src/stores/initialise.js
index 1900e62ce1..d74fbdfb10 100644
--- a/packages/client/src/stores/initialise.js
+++ b/packages/client/src/stores/initialise.js
@@ -1,7 +1,9 @@
 import { routeStore } from "./routes"
 import { appStore } from "./app"
+import { orgStore } from "./org"
 
 export async function initialise() {
   await routeStore.actions.fetchRoutes()
   await appStore.actions.fetchAppDefinition()
+  await orgStore.init()
 }
diff --git a/packages/client/src/stores/org.js b/packages/client/src/stores/org.js
new file mode 100644
index 0000000000..0cf9d6a5ba
--- /dev/null
+++ b/packages/client/src/stores/org.js
@@ -0,0 +1,27 @@
+import { API } from "api"
+import { writable, get } from "svelte/store"
+import { appStore } from "./app"
+
+const createOrgStore = () => {
+  const store = writable(null)
+
+  const { subscribe, set } = store
+
+  async function init() {
+    const tenantId = get(appStore).application?.tenantId
+    if (!tenantId) return
+    try {
+      const settingsConfigDoc = await API.getTenantConfig(tenantId)
+      set({ logoUrl: settingsConfigDoc.config.logoUrl })
+    } catch (e) {
+      console.log("Could not init org ", e)
+    }
+  }
+
+  return {
+    subscribe,
+    init,
+  }
+}
+
+export const orgStore = createOrgStore()
diff --git a/packages/client/src/stores/screens.js b/packages/client/src/stores/screens.js
index 6ef164dc9d..5250cc08a9 100644
--- a/packages/client/src/stores/screens.js
+++ b/packages/client/src/stores/screens.js
@@ -2,6 +2,7 @@ import { derived } from "svelte/store"
 import { routeStore } from "./routes"
 import { builderStore } from "./builder"
 import { appStore } from "./app"
+import { orgStore } from "./org"
 import { dndIndex, dndParent, dndIsNewComponent, dndBounds } from "./dnd.js"
 import { RoleUtils } from "@budibase/frontend-core"
 import { findComponentById, findComponentParent } from "../utils/components.js"
@@ -14,6 +15,7 @@ const createScreenStore = () => {
       appStore,
       routeStore,
       builderStore,
+      orgStore,
       dndParent,
       dndIndex,
       dndIsNewComponent,
@@ -23,6 +25,7 @@ const createScreenStore = () => {
       $appStore,
       $routeStore,
       $builderStore,
+      $orgStore,
       $dndParent,
       $dndIndex,
       $dndIsNewComponent,
@@ -146,6 +149,11 @@ const createScreenStore = () => {
           if (!navigationSettings.title && !navigationSettings.hideTitle) {
             navigationSettings.title = $appStore.application?.name
           }
+
+          if (!navigationSettings.logoUrl) {
+            navigationSettings.logoUrl =
+              $orgStore?.logoUrl || navigationSettings.logoUrl
+          }
         }
         activeLayout = {
           _id: "layout",
diff --git a/packages/server/src/api/controllers/static/index.ts b/packages/server/src/api/controllers/static/index.ts
index 069a798c5e..21dcce6610 100644
--- a/packages/server/src/api/controllers/static/index.ts
+++ b/packages/server/src/api/controllers/static/index.ts
@@ -99,40 +99,71 @@ export const deleteObjects = async function (ctx: any) {
 }
 
 export const serveApp = async function (ctx: any) {
+  //Public Settings
   const { config } = await configs.getSettingsConfigDoc()
+  let db
+  try {
+    db = context.getAppDB({ skip_setup: true })
+    const appInfo = await db.get(DocumentType.APP_METADATA)
+    let appId = context.getAppId()
 
-  const db = context.getAppDB({ skip_setup: true })
-  const appInfo = await db.get(DocumentType.APP_METADATA)
-  let appId = context.getAppId()
+    if (!env.isJest()) {
+      const App = require("./templates/BudibaseApp.svelte").default
+      const plugins = objectStore.enrichPluginURLs(appInfo.usedPlugins)
+      const { head, html, css } = App.render({
+        metaImage:
+          config?.metaImageUrl ||
+          "https://res.cloudinary.com/daog6scxm/image/upload/v1666109324/meta-images/budibase-meta-image_uukc1m.png",
+        metaDescription: config?.metaDescription || "",
+        metaTitle: config?.metaTitle || `${appInfo.name} - built with Budibase`,
+        title: appInfo.name,
+        production: env.isProd(),
+        appId,
+        clientLibPath: objectStore.clientLibraryUrl(appId!, appInfo.version),
+        usedPlugins: plugins,
+        favicon:
+          config.faviconUrl !== ""
+            ? objectStore.getGlobalFileUrl("settings", "faviconUrl")
+            : "",
+        logo:
+          config?.logoUrl !== ""
+            ? objectStore.getGlobalFileUrl("settings", "logoUrl")
+            : "",
+      })
+      const appHbs = loadHandlebarsFile(`${__dirname}/templates/app.hbs`)
+      ctx.body = await processString(appHbs, {
+        head,
+        body: html,
+        style: css.code,
+        appId,
+      })
+    } else {
+      // just return the app info for jest to assert on
+      ctx.body = appInfo
+    }
+  } catch (error) {
+    if (!env.isJest()) {
+      const App = require("./templates/BudibaseApp.svelte").default
+      const { head, html, css } = App.render({
+        title: config?.metaTitle,
+        metaTitle: config?.metaTitle,
+        metaImage:
+          config?.metaImageUrl ||
+          "https://res.cloudinary.com/daog6scxm/image/upload/v1666109324/meta-images/budibase-meta-image_uukc1m.png",
+        metaDescription: config?.metaDescription || "",
+        favicon:
+          config.faviconUrl !== ""
+            ? objectStore.getGlobalFileUrl("settings", "faviconUrl")
+            : "",
+      })
 
-  if (!env.isJest()) {
-    const App = require("./templates/BudibaseApp.svelte").default
-    const plugins = objectStore.enrichPluginURLs(appInfo.usedPlugins)
-    const { head, html, css } = App.render({
-      metaImage:
-        config?.metaImageUrl ||
-        "https://res.cloudinary.com/daog6scxm/image/upload/v1666109324/meta-images/budibase-meta-image_uukc1m.png",
-      metaDescription: config?.metaDescription || "",
-      metaTitle: `${appInfo.name} - built with Budibase` || config?.metaTitle,
-      title: appInfo.name,
-      production: env.isProd(),
-      appId,
-      clientLibPath: objectStore.clientLibraryUrl(appId!, appInfo.version),
-      usedPlugins: plugins,
-      favicon: objectStore.getGlobalFileUrl("settings", "faviconUrl"),
-      //logo: objectStore.getGlobalFileUrl("settings", "logoUrl"),
-    })
-
-    const appHbs = loadHandlebarsFile(`${__dirname}/templates/app.hbs`)
-    ctx.body = await processString(appHbs, {
-      head,
-      body: html,
-      style: css.code,
-      appId,
-    })
-  } else {
-    // just return the app info for jest to assert on
-    ctx.body = appInfo
+      const appHbs = loadHandlebarsFile(`${__dirname}/templates/app.hbs`)
+      ctx.body = await processString(appHbs, {
+        head,
+        body: html,
+        style: css.code,
+      })
+    }
   }
 }
 
diff --git a/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte b/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte
index 0667e8d2b8..8a495aec93 100644
--- a/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte
+++ b/packages/server/src/api/controllers/static/templates/BudibaseApp.svelte
@@ -21,11 +21,6 @@
   <meta name="title" content={metaTitle} />
   <meta name="description" content={metaDescription} />
 
-  <!-- 
-    metaTitle should match the title... 
-    should title override metaTitle, if set??
-  -->
-
   <!-- Opengraph Meta Tags -->
   <meta property="og:site_name" content="Budibase" />
   <meta property="og:title" content="{title} - built with Budibase" />
@@ -37,12 +32,17 @@
   <meta property="twitter:card" content="summary_large_image" />
   <meta property="twitter:site" content="@budibase" />
   <meta property="twitter:image" content={metaImage} />
-  <!-- Consider adding this twitter:image:alt -->
+  <meta property="twitter:image:alt" content="{title} - built with Budibase" />
   <meta property="twitter:title" content="{title} - built with Budibase" />
   <meta property="twitter:description" content={metaDescription} />
 
   <title>{title}</title>
-  <link rel="icon" type="image/png" href={favicon} />
+  {#if favicon !== ""}
+    <link rel="icon" type="image/png" href={favicon} />
+  {:else}
+    <link rel="icon" type="image/png" href="https://i.imgur.com/Xhdt1YP.png" />
+  {/if}
+
   <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
   <link rel="preconnect" href="https://fonts.gstatic.com" />
   <link
@@ -101,11 +101,16 @@
 
 <body id="app">
   <div id="error">
-    <h1>There was an error loading your app</h1>
-    <h2>
-      The Budibase client library could not be loaded. Try republishing your
-      app.
-    </h2>
+    {#if clientLibPath}
+      <h1>There was an error loading your app</h1>
+      <h2>
+        The Budibase client library could not be loaded. Try republishing your
+        app.
+      </h2>
+    {:else}
+      <h2>We couldn't find that application</h2>
+      <p />
+    {/if}
   </div>
   <script type="application/javascript">
     window.INIT_TIME = Date.now()
diff --git a/packages/types/src/documents/global/config.ts b/packages/types/src/documents/global/config.ts
index 95a98641d6..8e0c188d79 100644
--- a/packages/types/src/documents/global/config.ts
+++ b/packages/types/src/documents/global/config.ts
@@ -32,7 +32,6 @@ export interface SettingsInnerConfig {
   faviconUrlEtag?: string
 
   emailBrandingEnabled?: boolean
-  appFooterEnabled?: boolean
   testimonialsEnabled?: boolean
   licenseAgreementEnabled?: boolean
   platformTitle?: string
diff --git a/packages/worker/src/constants/templates/core.hbs b/packages/worker/src/constants/templates/core.hbs
index 614cf8dc9d..b7f9658d8c 100644
--- a/packages/worker/src/constants/templates/core.hbs
+++ b/packages/worker/src/constants/templates/core.hbs
@@ -10,16 +10,18 @@
       >
         <tbody>
           <tr>
-            <td style="padding:0 35px;" cellpadding="0" cellspacing="0">
+            <td
+              style="padding:0 35px; padding-top: 15px;"
+              cellpadding="0"
+              cellspacing="0"
+            >
               <img
                 width="32px"
                 style="margin-right:16px; vertical-align: middle;"
                 alt="Budibase Logo"
                 src="https://i.imgur.com/Xhdt1YP.png"
               />
-              <strong
-                style="color:#333333; vertical-align: middle; font-size: 1.1em"
-              >
+              <strong style="vertical-align: middle; font-size: 1.1em">
                 Budibase
               </strong>
             </td>
diff --git a/packages/worker/src/utilities/templates.ts b/packages/worker/src/utilities/templates.ts
index f801bdbb03..d311ab7ba6 100644
--- a/packages/worker/src/utilities/templates.ts
+++ b/packages/worker/src/utilities/templates.ts
@@ -26,9 +26,7 @@ export async function getSettingsTemplateContext(
     [InternalTemplateBinding.CURRENT_YEAR]: new Date().getFullYear(),
   }
 
-  // Need to be careful with the binding as it shouldn't be surfacable
-  // Also default to false if not explicit
-  context["enableEmailBranding"] = settings.emailBrandingEnabled
+  context["enableEmailBranding"] = settings.emailBrandingEnabled === true
 
   // attach purpose specific context
   switch (purpose) {

From f0a8732631f8c19178e1b353b9d54a1ca3a606e3 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Tue, 21 Mar 2023 14:32:52 +0000
Subject: [PATCH 05/14] Fix for the page title logic for the login page

---
 packages/builder/src/pages/builder/Branding.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/builder/src/pages/builder/Branding.svelte b/packages/builder/src/pages/builder/Branding.svelte
index 1b5acd9b8d..4e737054d8 100644
--- a/packages/builder/src/pages/builder/Branding.svelte
+++ b/packages/builder/src/pages/builder/Branding.svelte
@@ -8,7 +8,7 @@
   $: platformTitleText = $organisation.platformTitle
   $: platformTitleText,
     (platformTitle =
-      !$admin.isCloud || !$auth.user ? platformTitleText : "Budibase")
+      !$admin.isCloud && !$auth.user ? platformTitleText : "Budibase")
 
   $: faviconUrl = $organisation.faviconUrl || "https://i.imgur.com/Xhdt1YP.png"
 

From d19a70061271b66b6dac769ecf2983cdf0cb4a30 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Tue, 21 Mar 2023 15:19:52 +0000
Subject: [PATCH 06/14] Linting

---
 .../src/pages/builder/portal/settings/branding.svelte |  2 +-
 .../pages/builder/portal/settings/organisation.svelte | 11 -----------
 2 files changed, 1 insertion(+), 12 deletions(-)

diff --git a/packages/builder/src/pages/builder/portal/settings/branding.svelte b/packages/builder/src/pages/builder/portal/settings/branding.svelte
index 1406e29d4c..fd003aecc9 100644
--- a/packages/builder/src/pages/builder/portal/settings/branding.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/branding.svelte
@@ -54,7 +54,7 @@
   $: isLicenseLocked =
     (isCloud && !cloudPremium) || (!isCloud && !selfhostPremium)
 
-  const onConfigUpdate = config => {
+  const onConfigUpdate = () => {
     if (!mounted || updated || !init) {
       return
     }
diff --git a/packages/builder/src/pages/builder/portal/settings/organisation.svelte b/packages/builder/src/pages/builder/portal/settings/organisation.svelte
index 48919b5f0b..d2af329cb9 100644
--- a/packages/builder/src/pages/builder/portal/settings/organisation.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/organisation.svelte
@@ -34,12 +34,6 @@
     loading = true
 
     try {
-      // Upload logo if required
-      if ($values.logo && !$values.logo.url) {
-        await uploadLogo($values.logo)
-        await organisation.init()
-      }
-
       const config = {
         isSSOEnforced: $values.isSSOEnforced,
         company: $values.company ?? "",
@@ -47,11 +41,6 @@
         analyticsEnabled: $values.analyticsEnabled,
       }
 
-      // Remove logo if required
-      if (!$values.logo) {
-        config.logoUrl = ""
-      }
-
       // Update settings
       await organisation.save(config)
     } catch (error) {

From 8131d9dc6feb520fb7223bf9aa9eb9abf93d667d Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Mon, 27 Mar 2023 15:17:14 +0100
Subject: [PATCH 07/14] Branding feature flag changes, config trimming and some
 fixes

---
 .../builder/src/pages/builder/Branding.svelte |  2 +-
 .../builder/portal/settings/branding.svelte   | 55 ++++++++++++-------
 .../builder/src/stores/portal/licensing.js    |  6 +-
 packages/frontend-core/src/constants.js       |  1 +
 packages/types/src/sdk/licensing/feature.ts   |  1 +
 5 files changed, 44 insertions(+), 21 deletions(-)

diff --git a/packages/builder/src/pages/builder/Branding.svelte b/packages/builder/src/pages/builder/Branding.svelte
index 4e737054d8..106b7574fc 100644
--- a/packages/builder/src/pages/builder/Branding.svelte
+++ b/packages/builder/src/pages/builder/Branding.svelte
@@ -8,7 +8,7 @@
   $: platformTitleText = $organisation.platformTitle
   $: platformTitleText,
     (platformTitle =
-      !$admin.isCloud && !$auth.user ? platformTitleText : "Budibase")
+      !$auth.user && platformTitleText ? platformTitleText : "Budibase")
 
   $: faviconUrl = $organisation.faviconUrl || "https://i.imgur.com/Xhdt1YP.png"
 
diff --git a/packages/builder/src/pages/builder/portal/settings/branding.svelte b/packages/builder/src/pages/builder/portal/settings/branding.svelte
index fd003aecc9..3a99373e65 100644
--- a/packages/builder/src/pages/builder/portal/settings/branding.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/branding.svelte
@@ -47,12 +47,8 @@
   $: onConfigUpdate(config, mounted)
   $: init = Object.keys(config).length > 0
 
-  $: cloudPremium = !$licensing.isFreePlan
-  $: selfhostPremium = $licensing.isEnterprisePlan || $licensing.isBusinessPlan
   $: isCloud = $admin.cloud
-
-  $: isLicenseLocked =
-    (isCloud && !cloudPremium) || (!isCloud && !selfhostPremium)
+  $: brandingEnabled = $licensing.brandingEnabled
 
   const onConfigUpdate = () => {
     if (!mounted || updated || !init) {
@@ -152,6 +148,27 @@
         faviconPreview = null
       }
     }
+
+    // Trim
+    const userStrings = [
+      "metaTitle",
+      "platformTitle",
+      "loginButton",
+      "loginHeading",
+      "metaDescription",
+      "metaImageUrl",
+    ]
+
+    const trimmed = userStrings.reduce((acc, fieldName) => {
+      acc[fieldName] = config[fieldName] ? config[fieldName].trim() : undefined
+      return acc
+    }, {})
+
+    config = {
+      ...config,
+      ...trimmed,
+    }
+
     try {
       // Update settings
       await organisation.save(config)
@@ -190,12 +207,12 @@
     <Layout gap="XS" noPadding>
       <div class="title">
         <Heading size="M">Branding</Heading>
-        {#if !isCloud && !selfhostPremium}
+        {#if !isCloud && !brandingEnabled}
           <Tags>
             <Tag icon="LockClosed">Business</Tag>
           </Tags>
         {/if}
-        {#if isCloud && !cloudPremium}
+        {#if isCloud && !brandingEnabled}
           <Tags>
             <Tag icon="LockClosed">Pro</Tag>
           </Tags>
@@ -226,7 +243,7 @@
             config = clone
           }}
           value={logoFile || logo}
-          disabled={isLicenseLocked || saving}
+          disabled={!brandingEnabled || saving}
           allowClear={true}
         />
       </div>
@@ -251,7 +268,7 @@
             config = clone
           }}
           value={faviconFile || favicon}
-          disabled={isLicenseLocked || saving}
+          disabled={!brandingEnabled || saving}
           allowClear={true}
         />
       </div>
@@ -265,7 +282,7 @@
               config = clone
             }}
             value={config.platformTitle || ""}
-            disabled={!selfhostPremium || saving}
+            disabled={!brandingEnabled || saving}
           />
         </div>
       {/if}
@@ -278,7 +295,7 @@
             config = clone
           }}
           value={!config.emailBrandingEnabled}
-          disabled={isLicenseLocked || saving}
+          disabled={!brandingEnabled || saving}
         />
       </div>
     </div>
@@ -300,7 +317,7 @@
                 config = clone
               }}
               value={config.loginHeading || ""}
-              disabled={!selfhostPremium || saving}
+              disabled={!brandingEnabled || saving}
             />
           </div>
 
@@ -313,7 +330,7 @@
                 config = clone
               }}
               value={config.loginButton || ""}
-              disabled={!selfhostPremium || saving}
+              disabled={!brandingEnabled || saving}
             />
           </div>
           <div>
@@ -325,7 +342,7 @@
                 config = clone
               }}
               value={!config.testimonialsEnabled}
-              disabled={!selfhostPremium || saving}
+              disabled={!brandingEnabled || saving}
             />
             <Toggle
               text={"Remove license agreement"}
@@ -335,7 +352,7 @@
                 config = clone
               }}
               value={!config.licenseAgreementEnabled}
-              disabled={!selfhostPremium || saving}
+              disabled={!brandingEnabled || saving}
             />
           </div>
         </div>
@@ -357,7 +374,7 @@
               config = clone
             }}
             value={config.metaImageUrl}
-            disabled={isLicenseLocked || saving}
+            disabled={!brandingEnabled || saving}
           />
         </div>
         <div class="field">
@@ -369,7 +386,7 @@
               config = clone
             }}
             value={config.metaTitle}
-            disabled={isLicenseLocked || saving}
+            disabled={!brandingEnabled || saving}
           />
         </div>
         <div class="field">
@@ -381,13 +398,13 @@
               config = clone
             }}
             value={config.metaDescription}
-            disabled={isLicenseLocked || saving}
+            disabled={!brandingEnabled || saving}
           />
         </div>
       </div>
     </div>
     <div class="buttons">
-      {#if isLicenseLocked}
+      {#if !brandingEnabled}
         <Button
           on:click={() => {
             if (isCloud && $auth?.user?.accountPortalAccess) {
diff --git a/packages/builder/src/stores/portal/licensing.js b/packages/builder/src/stores/portal/licensing.js
index bb90d6d561..8640df5ef6 100644
--- a/packages/builder/src/stores/portal/licensing.js
+++ b/packages/builder/src/stores/portal/licensing.js
@@ -17,6 +17,7 @@ export const createLicensingStore = () => {
     // features
     groupsEnabled: false,
     backupsEnabled: false,
+    brandingEnabled: false,
     // the currently used quotas from the db
     quotaUsage: undefined,
     // derived quota metrics for percentages used
@@ -71,7 +72,9 @@ export const createLicensingStore = () => {
       const enforceableSSO = license.features.includes(
         Constants.Features.ENFORCEABLE_SSO
       )
-
+      const brandingEnabled = license.features.includes(
+        Constants.Features.BRANDING
+      )
       const auditLogsEnabled = license.features.includes(
         Constants.Features.AUDIT_LOGS
       )
@@ -84,6 +87,7 @@ export const createLicensingStore = () => {
           isBusinessPlan,
           groupsEnabled,
           backupsEnabled,
+          brandingEnabled,
           environmentVariablesEnabled,
           auditLogsEnabled,
           enforceableSSO,
diff --git a/packages/frontend-core/src/constants.js b/packages/frontend-core/src/constants.js
index bdf7abe36f..3c8efcd658 100644
--- a/packages/frontend-core/src/constants.js
+++ b/packages/frontend-core/src/constants.js
@@ -68,6 +68,7 @@ export const Features = {
   ENVIRONMENT_VARIABLES: "environmentVariables",
   AUDIT_LOGS: "auditLogs",
   ENFORCEABLE_SSO: "enforceableSSO",
+  BRANDING: "branding",
 }
 
 // Role IDs
diff --git a/packages/types/src/sdk/licensing/feature.ts b/packages/types/src/sdk/licensing/feature.ts
index 9f6090623b..1ff4f8febb 100644
--- a/packages/types/src/sdk/licensing/feature.ts
+++ b/packages/types/src/sdk/licensing/feature.ts
@@ -4,4 +4,5 @@ export enum Feature {
   ENVIRONMENT_VARIABLES = "environmentVariables",
   AUDIT_LOGS = "auditLogs",
   ENFORCEABLE_SSO = "enforceableSSO",
+  BRANDING = "branding",
 }

From eb3e38bb61dd0fff9068767b51c141fe1092d948 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Mon, 27 Mar 2023 15:32:45 +0100
Subject: [PATCH 08/14] Removed the license agreement toggle

---
 packages/builder/src/pages/builder/Branding.svelte    |  2 +-
 packages/builder/src/pages/builder/auth/login.svelte  |  2 +-
 .../src/pages/builder/portal/settings/branding.svelte | 11 -----------
 packages/builder/src/stores/portal/organisation.js    |  1 -
 packages/types/src/documents/global/config.ts         |  1 -
 5 files changed, 2 insertions(+), 15 deletions(-)

diff --git a/packages/builder/src/pages/builder/Branding.svelte b/packages/builder/src/pages/builder/Branding.svelte
index 106b7574fc..a591acd20b 100644
--- a/packages/builder/src/pages/builder/Branding.svelte
+++ b/packages/builder/src/pages/builder/Branding.svelte
@@ -1,5 +1,5 @@
 <script>
-  import { organisation, auth, admin } from "stores/portal"
+  import { organisation, auth } from "stores/portal"
   import { onMount } from "svelte"
 
   let loaded = false
diff --git a/packages/builder/src/pages/builder/auth/login.svelte b/packages/builder/src/pages/builder/auth/login.svelte
index 91031b3d04..547c914621 100644
--- a/packages/builder/src/pages/builder/auth/login.svelte
+++ b/packages/builder/src/pages/builder/auth/login.svelte
@@ -147,7 +147,7 @@
         </Layout>
       {/if}
 
-      {#if cloud && $organisation.licenseAgreementEnabled}
+      {#if cloud}
         <Body size="xs" textAlign="center">
           By using Budibase Cloud
           <br />
diff --git a/packages/builder/src/pages/builder/portal/settings/branding.svelte b/packages/builder/src/pages/builder/portal/settings/branding.svelte
index 3a99373e65..2184280e89 100644
--- a/packages/builder/src/pages/builder/portal/settings/branding.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/branding.svelte
@@ -192,7 +192,6 @@
       emailBrandingEnabled: $organisation.emailBrandingEnabled,
       loginHeading: $organisation.loginHeading,
       loginButton: $organisation.loginButton,
-      licenseAgreementEnabled: $organisation.licenseAgreementEnabled,
       testimonialsEnabled: $organisation.testimonialsEnabled,
       metaDescription: $organisation.metaDescription,
       metaImageUrl: $organisation.metaImageUrl,
@@ -344,16 +343,6 @@
               value={!config.testimonialsEnabled}
               disabled={!brandingEnabled || saving}
             />
-            <Toggle
-              text={"Remove license agreement"}
-              on:change={e => {
-                let clone = { ...config }
-                clone.licenseAgreementEnabled = !e.detail
-                config = clone
-              }}
-              value={!config.licenseAgreementEnabled}
-              disabled={!brandingEnabled || saving}
-            />
           </div>
         </div>
       </div>
diff --git a/packages/builder/src/stores/portal/organisation.js b/packages/builder/src/stores/portal/organisation.js
index c9bb80d6e9..486b45642d 100644
--- a/packages/builder/src/stores/portal/organisation.js
+++ b/packages/builder/src/stores/portal/organisation.js
@@ -9,7 +9,6 @@ const DEFAULT_CONFIG = {
   faviconUrl: undefined,
   emailBrandingEnabled: true,
   testimonialsEnabled: true,
-  licenseAgreementEnabled: true,
   platformTitle: "Budibase",
   loginHeading: undefined,
   loginButton: undefined,
diff --git a/packages/types/src/documents/global/config.ts b/packages/types/src/documents/global/config.ts
index 8e0c188d79..d1e7eac39b 100644
--- a/packages/types/src/documents/global/config.ts
+++ b/packages/types/src/documents/global/config.ts
@@ -33,7 +33,6 @@ export interface SettingsInnerConfig {
 
   emailBrandingEnabled?: boolean
   testimonialsEnabled?: boolean
-  licenseAgreementEnabled?: boolean
   platformTitle?: string
   loginHeading?: string
   loginButton?: string

From 6db03768e6da6fe60238913877040797cc1f7823 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Mon, 27 Mar 2023 17:28:12 +0100
Subject: [PATCH 09/14] Review updates

---
 .../src/api/controllers/global/configs.ts       | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/packages/worker/src/api/controllers/global/configs.ts b/packages/worker/src/api/controllers/global/configs.ts
index ac502e5054..e17442eb79 100644
--- a/packages/worker/src/api/controllers/global/configs.ts
+++ b/packages/worker/src/api/controllers/global/configs.ts
@@ -15,6 +15,7 @@ import {
   Config,
   ConfigType,
   Ctx,
+  Feature,
   GetPublicOIDCConfigResponse,
   GetPublicSettingsResponse,
   GoogleInnerConfig,
@@ -29,6 +30,7 @@ import {
   UserCtx,
 } from "@budibase/types"
 import * as pro from "@budibase/pro"
+import { licensing } from "@budibase/pro"
 
 const getEventFns = async (config: Config, existing?: Config) => {
   const fns = []
@@ -276,6 +278,20 @@ export async function publicSettings(
     // settings
     const configDoc = await configs.getSettingsConfigDoc()
     const config = configDoc.config
+
+    // License/Feature Checks
+    const license = await licensing.getLicense()
+
+    const licensedConfig: any = {}
+    if (!license || license?.features.indexOf(Feature.BRANDING) == -1) {
+      licensedConfig["emailBrandingEnabled"] = true
+      licensedConfig["testimonialsEnabled"] = true
+      licensedConfig["platformTitle"] = undefined
+      licensedConfig["metaDescription"] = undefined
+      licensedConfig["metaImageUrl"] = undefined
+      licensedConfig["metaTitle"] = undefined
+    }
+
     // enrich the logo url - empty url means deleted
     if (config.logoUrl && config.logoUrl !== "") {
       config.logoUrl = objectStore.getGlobalFileUrl(
@@ -313,6 +329,7 @@ export async function publicSettings(
       _rev: configDoc._rev,
       config: {
         ...config,
+        ...licensedConfig,
         google,
         oidc,
         isSSOEnforced,

From 4de8333f80899ed828c1d79bf5a81c073d857a65 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Mon, 27 Mar 2023 18:00:57 +0100
Subject: [PATCH 10/14] Review updates

---
 .../src/api/controllers/global/configs.ts     | 38 +++++++++++++------
 .../api/routes/global/tests/configs.spec.ts   |  2 +
 packages/worker/src/utilities/email.ts        |  2 +-
 3 files changed, 29 insertions(+), 13 deletions(-)

diff --git a/packages/worker/src/api/controllers/global/configs.ts b/packages/worker/src/api/controllers/global/configs.ts
index e17442eb79..d77b9c81d5 100644
--- a/packages/worker/src/api/controllers/global/configs.ts
+++ b/packages/worker/src/api/controllers/global/configs.ts
@@ -271,6 +271,31 @@ export async function publicOidc(ctx: Ctx<void, GetPublicOIDCConfigResponse>) {
   }
 }
 
+export async function getLicensedConfig() {
+  let licensedConfig: object = {}
+  const defaults = {
+    emailBrandingEnabled: true,
+    testimonialsEnabled: true,
+    platformTitle: undefined,
+    metaDescription: undefined,
+    metaImageUrl: undefined,
+    metaTitle: undefined,
+  }
+
+  try {
+    // License/Feature Checks
+    const license = await licensing.getLicense()
+
+    if (!license || license?.features.indexOf(Feature.BRANDING) == -1) {
+      licensedConfig = { ...defaults }
+    }
+  } catch (e) {
+    licensedConfig = { ...defaults }
+    console.info("Could not retrieve license", e)
+  }
+  return licensedConfig
+}
+
 export async function publicSettings(
   ctx: Ctx<void, GetPublicSettingsResponse>
 ) {
@@ -279,18 +304,7 @@ export async function publicSettings(
     const configDoc = await configs.getSettingsConfigDoc()
     const config = configDoc.config
 
-    // License/Feature Checks
-    const license = await licensing.getLicense()
-
-    const licensedConfig: any = {}
-    if (!license || license?.features.indexOf(Feature.BRANDING) == -1) {
-      licensedConfig["emailBrandingEnabled"] = true
-      licensedConfig["testimonialsEnabled"] = true
-      licensedConfig["platformTitle"] = undefined
-      licensedConfig["metaDescription"] = undefined
-      licensedConfig["metaImageUrl"] = undefined
-      licensedConfig["metaTitle"] = undefined
-    }
+    const licensedConfig: object = await getLicensedConfig()
 
     // enrich the logo url - empty url means deleted
     if (config.logoUrl && config.logoUrl !== "") {
diff --git a/packages/worker/src/api/routes/global/tests/configs.spec.ts b/packages/worker/src/api/routes/global/tests/configs.spec.ts
index 1abe575b02..8c31adff2b 100644
--- a/packages/worker/src/api/routes/global/tests/configs.spec.ts
+++ b/packages/worker/src/api/routes/global/tests/configs.spec.ts
@@ -286,6 +286,7 @@ describe("configs", () => {
         type: "settings",
         config: {
           company: "Budibase",
+          emailBrandingEnabled: true,
           logoUrl: "",
           analyticsEnabled: false,
           google: false,
@@ -294,6 +295,7 @@ describe("configs", () => {
           oidc: false,
           oidcCallbackUrl: `http://localhost:10000/api/global/auth/${config.tenantId}/oidc/callback`,
           platformUrl: "http://localhost:10000",
+          testimonialsEnabled: true,
         },
       }
       delete body._rev
diff --git a/packages/worker/src/utilities/email.ts b/packages/worker/src/utilities/email.ts
index 192126907b..fcd022cd92 100644
--- a/packages/worker/src/utilities/email.ts
+++ b/packages/worker/src/utilities/email.ts
@@ -111,7 +111,7 @@ async function buildEmail(
   ])
 
   // Change from branding to core
-  let core = EmailTemplates.core
+  let core = EmailTemplates[EmailTemplatePurpose.CORE]
 
   if (!base || !body || !core) {
     throw "Unable to build email, missing base components"

From 56e1d102fcddcfb56a81419aa6ae3031181ca241 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Mon, 27 Mar 2023 21:15:09 +0100
Subject: [PATCH 11/14] Added feature flag function for branding to ensure it
 uses the cached license

---
 .../src/api/controllers/global/configs.ts     | 60 ++++++++++---------
 packages/worker/src/utilities/configs.ts      | 27 +++++++++
 packages/worker/src/utilities/templates.ts    | 10 +++-
 3 files changed, 69 insertions(+), 28 deletions(-)
 create mode 100644 packages/worker/src/utilities/configs.ts

diff --git a/packages/worker/src/api/controllers/global/configs.ts b/packages/worker/src/api/controllers/global/configs.ts
index d77b9c81d5..a84bd173a8 100644
--- a/packages/worker/src/api/controllers/global/configs.ts
+++ b/packages/worker/src/api/controllers/global/configs.ts
@@ -11,11 +11,11 @@ import {
   tenancy,
 } from "@budibase/backend-core"
 import { checkAnyUserExists } from "../../../utilities/users"
+import { getLicensedConfig } from "../../../utilities/configs"
 import {
   Config,
   ConfigType,
   Ctx,
-  Feature,
   GetPublicOIDCConfigResponse,
   GetPublicSettingsResponse,
   GoogleInnerConfig,
@@ -30,7 +30,6 @@ import {
   UserCtx,
 } from "@budibase/types"
 import * as pro from "@budibase/pro"
-import { licensing } from "@budibase/pro"
 
 const getEventFns = async (config: Config, existing?: Config) => {
   const fns = []
@@ -213,6 +212,38 @@ export async function save(ctx: UserCtx<Config>) {
     ctx.throw(400, err)
   }
 
+  // Ignore branding changes if the license does not permit it
+  // Favicon and Logo Url are excluded.
+  try {
+    const brandingEnabled = await pro.features.isBrandingEnabled()
+    if (existingConfig?.config && !brandingEnabled) {
+      const {
+        emailBrandingEnabled,
+        testimonialsEnabled,
+        platformTitle,
+        metaDescription,
+        loginHeading,
+        loginButton,
+        metaImageUrl,
+        metaTitle,
+      } = existingConfig.config
+
+      body.config = {
+        ...body.config,
+        emailBrandingEnabled,
+        testimonialsEnabled,
+        platformTitle,
+        metaDescription,
+        loginHeading,
+        loginButton,
+        metaImageUrl,
+        metaTitle,
+      }
+    }
+  } catch (e) {
+    console.error("There was an issue retrieving the license", e)
+  }
+
   try {
     body._id = configs.generateConfigID(type)
     const response = await configs.save(body)
@@ -271,31 +302,6 @@ export async function publicOidc(ctx: Ctx<void, GetPublicOIDCConfigResponse>) {
   }
 }
 
-export async function getLicensedConfig() {
-  let licensedConfig: object = {}
-  const defaults = {
-    emailBrandingEnabled: true,
-    testimonialsEnabled: true,
-    platformTitle: undefined,
-    metaDescription: undefined,
-    metaImageUrl: undefined,
-    metaTitle: undefined,
-  }
-
-  try {
-    // License/Feature Checks
-    const license = await licensing.getLicense()
-
-    if (!license || license?.features.indexOf(Feature.BRANDING) == -1) {
-      licensedConfig = { ...defaults }
-    }
-  } catch (e) {
-    licensedConfig = { ...defaults }
-    console.info("Could not retrieve license", e)
-  }
-  return licensedConfig
-}
-
 export async function publicSettings(
   ctx: Ctx<void, GetPublicSettingsResponse>
 ) {
diff --git a/packages/worker/src/utilities/configs.ts b/packages/worker/src/utilities/configs.ts
new file mode 100644
index 0000000000..97420582c7
--- /dev/null
+++ b/packages/worker/src/utilities/configs.ts
@@ -0,0 +1,27 @@
+import * as pro from "@budibase/pro"
+
+export async function getLicensedConfig() {
+  let licensedConfig: object = {}
+  const defaults = {
+    emailBrandingEnabled: true,
+    testimonialsEnabled: true,
+    platformTitle: undefined,
+    metaDescription: undefined,
+    loginHeading: undefined,
+    loginButton: undefined,
+    metaImageUrl: undefined,
+    metaTitle: undefined,
+  }
+
+  try {
+    // License/Feature Checks
+    const enabled = await pro.features.isBrandingEnabled()
+    if (!enabled) {
+      licensedConfig = { ...defaults }
+    }
+  } catch (e) {
+    licensedConfig = { ...defaults }
+    console.info("Could not retrieve license", e)
+  }
+  return licensedConfig
+}
diff --git a/packages/worker/src/utilities/templates.ts b/packages/worker/src/utilities/templates.ts
index d311ab7ba6..759d221e51 100644
--- a/packages/worker/src/utilities/templates.ts
+++ b/packages/worker/src/utilities/templates.ts
@@ -1,10 +1,13 @@
 import { tenancy, configs } from "@budibase/backend-core"
+import { SettingsInnerConfig } from "@budibase/types"
 import {
   InternalTemplateBinding,
   LOGO_URL,
   EmailTemplatePurpose,
 } from "../constants"
 import { checkSlashesInUrl } from "./index"
+import { getLicensedConfig } from "./configs"
+
 const BASE_COMPANY = "Budibase"
 
 export async function getSettingsTemplateContext(
@@ -26,7 +29,12 @@ export async function getSettingsTemplateContext(
     [InternalTemplateBinding.CURRENT_YEAR]: new Date().getFullYear(),
   }
 
-  context["enableEmailBranding"] = settings.emailBrandingEnabled === true
+  try {
+    const config: SettingsInnerConfig = await getLicensedConfig()
+    context["enableEmailBranding"] = config?.emailBrandingEnabled || true
+  } catch (e) {
+    context["enableEmailBranding"] = true
+  }
 
   // attach purpose specific context
   switch (purpose) {

From 60650b031b8b183f0757f876e9d3e46c9c4d655d Mon Sep 17 00:00:00 2001
From: Rory Powell <rory.codes@gmail.com>
Date: Mon, 27 Mar 2023 22:28:25 +0100
Subject: [PATCH 12/14] Move branding read behind pro

---
 .../src/api/controllers/static/index.ts       | 21 ++++++-----
 packages/types/src/documents/global/config.ts | 16 +++++----
 .../src/api/controllers/global/configs.ts     | 36 +++----------------
 packages/worker/src/utilities/templates.ts    |  6 ++--
 4 files changed, 31 insertions(+), 48 deletions(-)

diff --git a/packages/server/src/api/controllers/static/index.ts b/packages/server/src/api/controllers/static/index.ts
index 21dcce6610..c46c14bed3 100644
--- a/packages/server/src/api/controllers/static/index.ts
+++ b/packages/server/src/api/controllers/static/index.ts
@@ -15,6 +15,7 @@ import { context, objectStore, utils, configs } from "@budibase/backend-core"
 import AWS from "aws-sdk"
 import fs from "fs"
 import sdk from "../../../sdk"
+import * as pro from "@budibase/pro"
 
 const send = require("koa-send")
 
@@ -101,6 +102,8 @@ export const deleteObjects = async function (ctx: any) {
 export const serveApp = async function (ctx: any) {
   //Public Settings
   const { config } = await configs.getSettingsConfigDoc()
+  const branding = await pro.branding.getBrandingConfig(config)
+
   let db
   try {
     db = context.getAppDB({ skip_setup: true })
@@ -112,17 +115,17 @@ export const serveApp = async function (ctx: any) {
       const plugins = objectStore.enrichPluginURLs(appInfo.usedPlugins)
       const { head, html, css } = App.render({
         metaImage:
-          config?.metaImageUrl ||
+          branding?.metaImageUrl ||
           "https://res.cloudinary.com/daog6scxm/image/upload/v1666109324/meta-images/budibase-meta-image_uukc1m.png",
-        metaDescription: config?.metaDescription || "",
-        metaTitle: config?.metaTitle || `${appInfo.name} - built with Budibase`,
+        metaDescription: branding?.metaDescription || "",
+        metaTitle: branding?.metaTitle || `${appInfo.name} - built with Budibase`,
         title: appInfo.name,
         production: env.isProd(),
         appId,
         clientLibPath: objectStore.clientLibraryUrl(appId!, appInfo.version),
         usedPlugins: plugins,
         favicon:
-          config.faviconUrl !== ""
+          branding.faviconUrl !== ""
             ? objectStore.getGlobalFileUrl("settings", "faviconUrl")
             : "",
         logo:
@@ -145,14 +148,14 @@ export const serveApp = async function (ctx: any) {
     if (!env.isJest()) {
       const App = require("./templates/BudibaseApp.svelte").default
       const { head, html, css } = App.render({
-        title: config?.metaTitle,
-        metaTitle: config?.metaTitle,
+        title: branding?.metaTitle,
+        metaTitle: branding?.metaTitle,
         metaImage:
-          config?.metaImageUrl ||
+          branding?.metaImageUrl ||
           "https://res.cloudinary.com/daog6scxm/image/upload/v1666109324/meta-images/budibase-meta-image_uukc1m.png",
-        metaDescription: config?.metaDescription || "",
+        metaDescription: branding?.metaDescription || "",
         favicon:
-          config.faviconUrl !== ""
+          branding.faviconUrl !== ""
             ? objectStore.getGlobalFileUrl("settings", "faviconUrl")
             : "",
       })
diff --git a/packages/types/src/documents/global/config.ts b/packages/types/src/documents/global/config.ts
index d1e7eac39b..f2e266a5e2 100644
--- a/packages/types/src/documents/global/config.ts
+++ b/packages/types/src/documents/global/config.ts
@@ -22,12 +22,10 @@ export interface SMTPConfig extends Config {
   config: SMTPInnerConfig
 }
 
-export interface SettingsInnerConfig {
-  platformUrl?: string
-  company?: string
-  logoUrl?: string // Populated on read
-  logoUrlEtag?: string
-
+/**
+ * Accessible only via pro.
+ */
+export interface SettingsBrandingConfig {
   faviconUrl?: string
   faviconUrlEtag?: string
 
@@ -40,7 +38,13 @@ export interface SettingsInnerConfig {
   metaDescription?: string
   metaImageUrl?: string
   metaTitle?: string
+}
 
+export interface SettingsInnerConfig {
+  platformUrl?: string
+  company?: string
+  logoUrl?: string // Populated on read
+  logoUrlEtag?: string
   uniqueTenantId?: string
   analyticsEnabled?: boolean
   isSSOEnforced?: boolean
diff --git a/packages/worker/src/api/controllers/global/configs.ts b/packages/worker/src/api/controllers/global/configs.ts
index d77b9c81d5..1d666ca93d 100644
--- a/packages/worker/src/api/controllers/global/configs.ts
+++ b/packages/worker/src/api/controllers/global/configs.ts
@@ -15,7 +15,6 @@ import {
   Config,
   ConfigType,
   Ctx,
-  Feature,
   GetPublicOIDCConfigResponse,
   GetPublicSettingsResponse,
   GoogleInnerConfig,
@@ -30,7 +29,6 @@ import {
   UserCtx,
 } from "@budibase/types"
 import * as pro from "@budibase/pro"
-import { licensing } from "@budibase/pro"
 
 const getEventFns = async (config: Config, existing?: Config) => {
   const fns = []
@@ -271,31 +269,6 @@ export async function publicOidc(ctx: Ctx<void, GetPublicOIDCConfigResponse>) {
   }
 }
 
-export async function getLicensedConfig() {
-  let licensedConfig: object = {}
-  const defaults = {
-    emailBrandingEnabled: true,
-    testimonialsEnabled: true,
-    platformTitle: undefined,
-    metaDescription: undefined,
-    metaImageUrl: undefined,
-    metaTitle: undefined,
-  }
-
-  try {
-    // License/Feature Checks
-    const license = await licensing.getLicense()
-
-    if (!license || license?.features.indexOf(Feature.BRANDING) == -1) {
-      licensedConfig = { ...defaults }
-    }
-  } catch (e) {
-    licensedConfig = { ...defaults }
-    console.info("Could not retrieve license", e)
-  }
-  return licensedConfig
-}
-
 export async function publicSettings(
   ctx: Ctx<void, GetPublicSettingsResponse>
 ) {
@@ -304,7 +277,7 @@ export async function publicSettings(
     const configDoc = await configs.getSettingsConfigDoc()
     const config = configDoc.config
 
-    const licensedConfig: object = await getLicensedConfig()
+    const branding = await pro.branding.getBrandingConfig(config)
 
     // enrich the logo url - empty url means deleted
     if (config.logoUrl && config.logoUrl !== "") {
@@ -315,11 +288,12 @@ export async function publicSettings(
       )
     }
 
-    if (config.faviconUrl && config.faviconUrl !== "") {
+    if (branding.faviconUrl && branding.faviconUrl !== "") {
+      // @ts-ignore
       config.faviconUrl = objectStore.getGlobalFileUrl(
         "settings",
         "faviconUrl",
-        config.faviconUrl
+        branding.faviconUrl
       )
     }
 
@@ -343,7 +317,7 @@ export async function publicSettings(
       _rev: configDoc._rev,
       config: {
         ...config,
-        ...licensedConfig,
+        ...branding,
         google,
         oidc,
         isSSOEnforced,
diff --git a/packages/worker/src/utilities/templates.ts b/packages/worker/src/utilities/templates.ts
index d311ab7ba6..adc18831db 100644
--- a/packages/worker/src/utilities/templates.ts
+++ b/packages/worker/src/utilities/templates.ts
@@ -6,12 +6,14 @@ import {
 } from "../constants"
 import { checkSlashesInUrl } from "./index"
 const BASE_COMPANY = "Budibase"
+import * as pro from "@budibase/pro"
 
 export async function getSettingsTemplateContext(
   purpose: EmailTemplatePurpose,
   code?: string | null
 ) {
-  let settings = await configs.getSettingsConfig()
+  const settings = await configs.getSettingsConfig()
+  const branding = await pro.branding.getBrandingConfig(settings)
   const URL = settings.platformUrl
   const context: any = {
     [InternalTemplateBinding.LOGO_URL]:
@@ -26,7 +28,7 @@ export async function getSettingsTemplateContext(
     [InternalTemplateBinding.CURRENT_YEAR]: new Date().getFullYear(),
   }
 
-  context["enableEmailBranding"] = settings.emailBrandingEnabled === true
+  context["enableEmailBranding"] = branding.emailBrandingEnabled === true
 
   // attach purpose specific context
   switch (purpose) {

From cd3b2ba199978f9cabef266197a78b2a88b5c78a Mon Sep 17 00:00:00 2001
From: Rory Powell <rory.codes@gmail.com>
Date: Mon, 27 Mar 2023 22:39:35 +0100
Subject: [PATCH 13/14] Lint

---
 packages/client/yarn.lock                           | 5 -----
 packages/server/src/api/controllers/static/index.ts | 3 ++-
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/packages/client/yarn.lock b/packages/client/yarn.lock
index 189c93c120..e7140f7af3 100644
--- a/packages/client/yarn.lock
+++ b/packages/client/yarn.lock
@@ -23,11 +23,6 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
-"@budibase/types@2.4.8-alpha.4":
-  version "2.4.8-alpha.4"
-  resolved "https://registry.yarnpkg.com/@budibase/types/-/types-2.4.8-alpha.4.tgz#4e6dec50eef381994432ef4d08587a9a7156dd84"
-  integrity sha512-aiHHOvsDLHQ2OFmLgaSUttQwSuaPBqF1lbyyCkEJIbbl/qo9EPNZGl+AkB7wo12U5HdqWhr9OpFL12EqkcD4GA==
-
 "@jridgewell/gen-mapping@^0.3.0":
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz#c1aedc61e853f2bb9f5dfe6d4442d3b565b253b9"
diff --git a/packages/server/src/api/controllers/static/index.ts b/packages/server/src/api/controllers/static/index.ts
index c46c14bed3..c19fd1bb05 100644
--- a/packages/server/src/api/controllers/static/index.ts
+++ b/packages/server/src/api/controllers/static/index.ts
@@ -118,7 +118,8 @@ export const serveApp = async function (ctx: any) {
           branding?.metaImageUrl ||
           "https://res.cloudinary.com/daog6scxm/image/upload/v1666109324/meta-images/budibase-meta-image_uukc1m.png",
         metaDescription: branding?.metaDescription || "",
-        metaTitle: branding?.metaTitle || `${appInfo.name} - built with Budibase`,
+        metaTitle:
+          branding?.metaTitle || `${appInfo.name} - built with Budibase`,
         title: appInfo.name,
         production: env.isProd(),
         appId,

From c914ded42ce72e64b06db3263b435269310d3700 Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Tue, 28 Mar 2023 11:18:49 +0100
Subject: [PATCH 14/14] Feedback updates

---
 packages/builder/src/pages/builder/Branding.svelte | 6 ++----
 packages/client/src/stores/initialise.js           | 2 +-
 packages/client/src/stores/org.js                  | 4 +++-
 packages/client/src/stores/screens.js              | 4 ++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/builder/src/pages/builder/Branding.svelte b/packages/builder/src/pages/builder/Branding.svelte
index a591acd20b..142473abb8 100644
--- a/packages/builder/src/pages/builder/Branding.svelte
+++ b/packages/builder/src/pages/builder/Branding.svelte
@@ -3,12 +3,10 @@
   import { onMount } from "svelte"
 
   let loaded = false
-  let platformTitle = null
 
   $: platformTitleText = $organisation.platformTitle
-  $: platformTitleText,
-    (platformTitle =
-      !$auth.user && platformTitleText ? platformTitleText : "Budibase")
+  $: platformTitle =
+    !$auth.user && platformTitleText ? platformTitleText : "Budibase"
 
   $: faviconUrl = $organisation.faviconUrl || "https://i.imgur.com/Xhdt1YP.png"
 
diff --git a/packages/client/src/stores/initialise.js b/packages/client/src/stores/initialise.js
index d74fbdfb10..f34d775a4e 100644
--- a/packages/client/src/stores/initialise.js
+++ b/packages/client/src/stores/initialise.js
@@ -5,5 +5,5 @@ import { orgStore } from "./org"
 export async function initialise() {
   await routeStore.actions.fetchRoutes()
   await appStore.actions.fetchAppDefinition()
-  await orgStore.init()
+  await orgStore.actions.init()
 }
diff --git a/packages/client/src/stores/org.js b/packages/client/src/stores/org.js
index 0cf9d6a5ba..af0fc955f9 100644
--- a/packages/client/src/stores/org.js
+++ b/packages/client/src/stores/org.js
@@ -20,7 +20,9 @@ const createOrgStore = () => {
 
   return {
     subscribe,
-    init,
+    actions: {
+      init,
+    },
   }
 }
 
diff --git a/packages/client/src/stores/screens.js b/packages/client/src/stores/screens.js
index 5250cc08a9..ba373ad8e0 100644
--- a/packages/client/src/stores/screens.js
+++ b/packages/client/src/stores/screens.js
@@ -150,9 +150,9 @@ const createScreenStore = () => {
             navigationSettings.title = $appStore.application?.name
           }
 
+          // Default to the org logo
           if (!navigationSettings.logoUrl) {
-            navigationSettings.logoUrl =
-              $orgStore?.logoUrl || navigationSettings.logoUrl
+            navigationSettings.logoUrl = $orgStore?.logoUrl
           }
         }
         activeLayout = {
