From 1d950bed7d9331e002f3ce95851bc8f117e666b0 Mon Sep 17 00:00:00 2001 From: mike12345567 Date: Mon, 16 May 2022 18:13:59 +0100 Subject: [PATCH 1/6] Porting UI, still needs testing. --- .../src/components/billing/Usage.svelte | 55 ++++++++ .../src/pages/builder/portal/_layout.svelte | 4 + .../builder/portal/settings/billing.svelte | 127 ++++++++++++++++++ packages/builder/src/stores/portal/index.js | 1 + .../builder/src/stores/portal/licensing.js | 29 ++++ packages/frontend-core/src/api/licensing.js | 6 + 6 files changed, 222 insertions(+) create mode 100644 packages/builder/src/components/billing/Usage.svelte create mode 100644 packages/builder/src/pages/builder/portal/settings/billing.svelte create mode 100644 packages/builder/src/stores/portal/licensing.js diff --git a/packages/builder/src/components/billing/Usage.svelte b/packages/builder/src/components/billing/Usage.svelte new file mode 100644 index 0000000000..b3777007c6 --- /dev/null +++ b/packages/builder/src/components/billing/Usage.svelte @@ -0,0 +1,55 @@ + + +
+
+ + {#if unlimited} + {usage.used} + {:else} + {usage.used} / {usage.total} + {/if} +
+
+ {#if unlimited} + Unlimited + {:else} + + {/if} +
+
+ + diff --git a/packages/builder/src/pages/builder/portal/_layout.svelte b/packages/builder/src/pages/builder/portal/_layout.svelte index 39a5def7d6..99cf84e912 100644 --- a/packages/builder/src/pages/builder/portal/_layout.svelte +++ b/packages/builder/src/pages/builder/portal/_layout.svelte @@ -61,6 +61,10 @@ ]) if (isEnabled(FEATURE_FLAGS.LICENSING)) { + menu = menu.concat({ + title: "Billing", + href: "/builder/portal/settings/billing", + }) menu = menu.concat({ title: "Upgrade", href: "/builder/portal/settings/upgrade", diff --git a/packages/builder/src/pages/builder/portal/settings/billing.svelte b/packages/builder/src/pages/builder/portal/settings/billing.svelte new file mode 100644 index 0000000000..12d4a587e7 --- /dev/null +++ b/packages/builder/src/pages/builder/portal/settings/billing.svelte @@ -0,0 +1,127 @@ + + + + {#if loaded} + + Billing + Get information about your current usage and manage your plan + + + + + + + Your plan + {capitalise(license?.plan.type)} + + + Usage +
+ {#each staticUsage as usage} +
+ +
+ {/each} +
+
+ {#if monthlyUsage.length} + + Monthly +
+ {#each monthlyUsage as usage} +
+ +
+ {/each} +
+
+
+ {/if} + + {/if} + + + diff --git a/packages/builder/src/stores/portal/index.js b/packages/builder/src/stores/portal/index.js index a5d33b3b15..8810ce6b74 100644 --- a/packages/builder/src/stores/portal/index.js +++ b/packages/builder/src/stores/portal/index.js @@ -6,3 +6,4 @@ export { email } from "./email" export { auth } from "./auth" export { oidc } from "./oidc" export { templates } from "./templates" +export { licensing } from "./licensing" diff --git a/packages/builder/src/stores/portal/licensing.js b/packages/builder/src/stores/portal/licensing.js new file mode 100644 index 0000000000..653dab52ed --- /dev/null +++ b/packages/builder/src/stores/portal/licensing.js @@ -0,0 +1,29 @@ +import { writable } from "svelte/store" +import { API } from "api" + +export const createLicensingStore = () => { + const DEFAULT = { + plans: {}, + } + + const store = writable(DEFAULT) + + const actions = { + getQuotaUsage: async () => { + const quotaUsage = await API.getQuotaUsage() + store.update(state => { + return { + ...state, + quotaUsage, + } + }) + }, + } + + return { + subscribe: store.subscribe, + ...actions, + } +} + +export const licensing = createLicensingStore() diff --git a/packages/frontend-core/src/api/licensing.js b/packages/frontend-core/src/api/licensing.js index a3e5583325..0ee04fbc0b 100644 --- a/packages/frontend-core/src/api/licensing.js +++ b/packages/frontend-core/src/api/licensing.js @@ -27,4 +27,10 @@ export const buildLicensingEndpoints = API => ({ url: "/api/global/license/refresh", }) }, + + getQuotaUsage: async () => { + return API.get({ + url: "/api/license/usage", + }) + }, }) From 36a190b0ed532021bec6850d0bb2140211f8b14e Mon Sep 17 00:00:00 2001 From: mike12345567 Date: Tue, 17 May 2022 17:44:40 +0100 Subject: [PATCH 2/6] Finishing off UI, expanding settings menus from 80ch to 90ch as they were quite restricted and made the usage UI a bit difficult to view. Added a DISABLE_DEVELOPER_LICENSE env variable for testing. --- packages/backend-core/package.json | 1 + packages/backend-core/src/environment.js | 11 +- packages/backend-core/yarn.lock | 5 + packages/builder/cypress/setup.js | 1 - .../src/components/billing/Usage.svelte | 3 +- .../src/pages/builder/portal/_layout.svelte | 15 +- .../builder/portal/manage/_layout.svelte | 2 +- .../builder/portal/manage/auth/index.svelte | 4 +- .../builder/portal/manage/email/index.svelte | 4 +- .../builder/portal/settings/_layout.svelte | 2 +- .../settings/{billing.svelte => usage.svelte} | 65 +-- packages/frontend-core/src/api/licensing.js | 5 +- packages/server/scripts/likeCypress.ts | 1 - packages/server/src/environment.js | 21 +- packages/server/src/utilities/budibaseDir.js | 7 - packages/server/yarn.lock | 506 +----------------- .../src/api/controllers/global/license.ts | 3 +- packages/worker/src/environment.js | 1 + packages/worker/yarn.lock | 18 +- 19 files changed, 100 insertions(+), 575 deletions(-) rename packages/builder/src/pages/builder/portal/settings/{billing.svelte => usage.svelte} (67%) diff --git a/packages/backend-core/package.json b/packages/backend-core/package.json index 71b01817ff..fc1fa48c6c 100644 --- a/packages/backend-core/package.json +++ b/packages/backend-core/package.json @@ -13,6 +13,7 @@ "@techpass/passport-openidconnect": "^0.3.0", "aws-sdk": "^2.901.0", "bcryptjs": "^2.4.3", + "dotenv": "^16.0.1", "emitter-listener": "^1.1.2", "ioredis": "^4.27.1", "jsonwebtoken": "^8.5.1", diff --git a/packages/backend-core/src/environment.js b/packages/backend-core/src/environment.js index f628e899ad..e0b70d4007 100644 --- a/packages/backend-core/src/environment.js +++ b/packages/backend-core/src/environment.js @@ -10,7 +10,15 @@ function isDev() { return process.env.NODE_ENV !== "production" } +let LOADED = false +if (!LOADED && isDev() && !isTest()) { + require("dotenv").config() + LOADED = true +} + module.exports = { + isTest, + isDev, JWT_SECRET: process.env.JWT_SECRET, COUCH_DB_URL: process.env.COUCH_DB_URL || "http://localhost:4005", COUCH_DB_USERNAME: process.env.COUCH_DB_USER, @@ -41,8 +49,7 @@ module.exports = { GLOBAL_CLOUD_BUCKET_NAME: process.env.GLOBAL_CLOUD_BUCKET_NAME || "prod-budi-tenant-uploads", USE_COUCH: process.env.USE_COUCH || true, - isTest, - isDev, + DISABLE_DEVELOPER_LICENSE: process.env.DISABLE_DEVELOPER_LICENSE, _set(key, value) { process.env[key] = value module.exports[key] = value diff --git a/packages/backend-core/yarn.lock b/packages/backend-core/yarn.lock index 7dfa64810e..80f292140d 100644 --- a/packages/backend-core/yarn.lock +++ b/packages/backend-core/yarn.lock @@ -1485,6 +1485,11 @@ domexception@^2.0.1: dependencies: webidl-conversions "^5.0.0" +dotenv@^16.0.1: + version "16.0.1" + resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-16.0.1.tgz#8f8f9d94876c35dac989876a5d3a82a267fdce1d" + integrity sha512-1K6hR6wtk2FviQ4kEiSjFiH5rpzEVi8WW0x96aztHVMhEspNpc4DVOUTEHtEva5VThQ8IaBX1Pe4gSzpVVUsKQ== + double-ended-queue@2.1.0-0: version "2.1.0-0" resolved "https://registry.yarnpkg.com/double-ended-queue/-/double-ended-queue-2.1.0-0.tgz#103d3527fd31528f40188130c841efdd78264e5c" diff --git a/packages/builder/cypress/setup.js b/packages/builder/cypress/setup.js index e19c931ed9..d10990573a 100644 --- a/packages/builder/cypress/setup.js +++ b/packages/builder/cypress/setup.js @@ -7,7 +7,6 @@ const tmpdir = path.join(require("os").tmpdir(), ".budibase") const SERVER_PORT = cypressConfig.env.PORT const WORKER_PORT = cypressConfig.env.WORKER_PORT -process.env.BUDIBASE_API_KEY = "6BE826CB-6B30-4AEC-8777-2E90464633DE" process.env.NODE_ENV = "cypress" process.env.ENABLE_ANALYTICS = "false" process.env.JWT_SECRET = cypressConfig.env.JWT_SECRET diff --git a/packages/builder/src/components/billing/Usage.svelte b/packages/builder/src/components/billing/Usage.svelte index b3777007c6..cd9071785d 100644 --- a/packages/builder/src/components/billing/Usage.svelte +++ b/packages/builder/src/components/billing/Usage.svelte @@ -14,7 +14,7 @@ } const getPercentage = () => { - return (usage.used / usage.total) * 100 + return Math.min(Math.ceil((usage.used / usage.total) * 100), 100) } onMount(() => { @@ -51,5 +51,6 @@ display: flex; flex-direction: row; justify-content: space-between; + gap: var(--spacing-m); } diff --git a/packages/builder/src/pages/builder/portal/_layout.svelte b/packages/builder/src/pages/builder/portal/_layout.svelte index 99cf84e912..b3200c936c 100644 --- a/packages/builder/src/pages/builder/portal/_layout.svelte +++ b/packages/builder/src/pages/builder/portal/_layout.svelte @@ -31,7 +31,16 @@ $: menu = buildMenu($auth.isAdmin) const buildMenu = admin => { - let menu = [{ title: "Apps", href: "/builder/portal/apps" }] + let menu = [ + { + title: "Apps", + href: "/builder/portal/apps", + }, + { + title: "Usage", + href: "/builder/portal/settings/usage", + }, + ] if (admin) { menu = menu.concat([ { @@ -61,10 +70,6 @@ ]) if (isEnabled(FEATURE_FLAGS.LICENSING)) { - menu = menu.concat({ - title: "Billing", - href: "/builder/portal/settings/billing", - }) menu = menu.concat({ title: "Upgrade", href: "/builder/portal/settings/upgrade", diff --git a/packages/builder/src/pages/builder/portal/manage/_layout.svelte b/packages/builder/src/pages/builder/portal/manage/_layout.svelte index e6c73bc596..b4ffa4910c 100644 --- a/packages/builder/src/pages/builder/portal/manage/_layout.svelte +++ b/packages/builder/src/pages/builder/portal/manage/_layout.svelte @@ -12,7 +12,7 @@ {#if $auth.isAdmin} - + {/if} diff --git a/packages/builder/src/pages/builder/portal/manage/auth/index.svelte b/packages/builder/src/pages/builder/portal/manage/auth/index.svelte index 242b21d945..40ece9d39b 100644 --- a/packages/builder/src/pages/builder/portal/manage/auth/index.svelte +++ b/packages/builder/src/pages/builder/portal/manage/auth/index.svelte @@ -297,7 +297,7 @@ {#if providers.google} - +
@@ -336,7 +336,7 @@ {/if} {#if providers.oidc} - +
diff --git a/packages/builder/src/pages/builder/portal/manage/email/index.svelte b/packages/builder/src/pages/builder/portal/manage/email/index.svelte index 56242f0fe4..5f7342364e 100644 --- a/packages/builder/src/pages/builder/portal/manage/email/index.svelte +++ b/packages/builder/src/pages/builder/portal/manage/email/index.svelte @@ -112,7 +112,7 @@ values below and click activate. - + {#if smtpConfig} SMTP @@ -159,7 +159,7 @@
- + Templates diff --git a/packages/builder/src/pages/builder/portal/settings/_layout.svelte b/packages/builder/src/pages/builder/portal/settings/_layout.svelte index f9c2067a94..6e3c76840d 100644 --- a/packages/builder/src/pages/builder/portal/settings/_layout.svelte +++ b/packages/builder/src/pages/builder/portal/settings/_layout.svelte @@ -2,6 +2,6 @@ import { Page } from "@budibase/bbui" - + diff --git a/packages/builder/src/pages/builder/portal/settings/billing.svelte b/packages/builder/src/pages/builder/portal/settings/usage.svelte similarity index 67% rename from packages/builder/src/pages/builder/portal/settings/billing.svelte rename to packages/builder/src/pages/builder/portal/settings/usage.svelte index 12d4a587e7..3c25ab7885 100644 --- a/packages/builder/src/pages/builder/portal/settings/billing.svelte +++ b/packages/builder/src/pages/builder/portal/settings/usage.svelte @@ -1,12 +1,5 @@ - - {#if loaded} - - Billing - Get information about your current usage and manage your plan +{#if loaded} + + Usage + Get information about your current usage within Budibase. + + + + + + + YOUR PLAN + {capitalise(license?.plan.type)} - + USAGE +
+ {#each staticUsage as usage} +
+ +
+ {/each} +
- - - Your plan - {capitalise(license?.plan.type)} - + {#if monthlyUsage.length} - Usage + MONTHLY
- {#each staticUsage as usage} + {#each monthlyUsage as usage}
{/each}
- {#if monthlyUsage.length} - - Monthly -
- {#each monthlyUsage as usage} -
- -
- {/each} -
-
-
- {/if} - - {/if} - +
+ {/if} + +{/if}