From be5564621c0339aa17e52436a511ae232914e7af Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Thu, 24 Oct 2024 16:19:43 +0100 Subject: [PATCH] Add info display in user side panel to warn builders if they haven't published their app --- .../src/components/deploy/AppActions.svelte | 20 +++++++--------- .../_components/BuilderSidePanel.svelte | 23 +++++++++++++++---- .../_components/Component/InfoDisplay.svelte | 23 +++++++++++-------- packages/builder/src/stores/builder/index.js | 2 ++ .../builder/src/stores/builder/published.js | 13 +++++++++++ 5 files changed, 56 insertions(+), 25 deletions(-) create mode 100644 packages/builder/src/stores/builder/published.js diff --git a/packages/builder/src/components/deploy/AppActions.svelte b/packages/builder/src/components/deploy/AppActions.svelte index bb950983a6..9ba46832f4 100644 --- a/packages/builder/src/components/deploy/AppActions.svelte +++ b/packages/builder/src/components/deploy/AppActions.svelte @@ -25,6 +25,7 @@ appStore, deploymentStore, sortedScreens, + appPublished, } from "stores/builder" import TourWrap from "components/portal/onboarding/TourWrap.svelte" import { TOUR_STEP_KEYS } from "components/portal/onboarding/tours.js" @@ -45,11 +46,6 @@ $: filteredApps = $appsStore.apps.filter(app => app.devId === application) $: selectedApp = filteredApps?.length ? filteredApps[0] : null - $: latestDeployments = $deploymentStore - .filter(deployment => deployment.status === "SUCCESS") - .sort((a, b) => a.updatedAt > b.updatedAt) - $: isPublished = - selectedApp?.status === "published" && latestDeployments?.length > 0 $: updateAvailable = $appStore.upgradableVersion && $appStore.version && @@ -117,7 +113,7 @@ } const confirmUnpublishApp = async () => { - if (!application || !isPublished) { + if (!application || !$appPublished) { //confirm the app has loaded. return } @@ -204,7 +200,7 @@ >
- + Publish @@ -219,7 +215,7 @@ { @@ -236,13 +232,13 @@ class="app-link" on:click={() => { appActionPopover.hide() - if (isPublished) { + if ($appPublished) { viewApp() } }} > {$appStore.url} - {#if isPublished} + {#if $appPublished} {/if} @@ -250,7 +246,7 @@ - {#if isPublished} + {#if $appPublished} {lastDeployed} @@ -279,7 +275,7 @@
- {#if isPublished} + {#if $appPublished}
+ {#if !$appPublished} +
+ +
+ {/if} + {#if promptInvite && !userOnboardResponse}
@@ -623,7 +635,7 @@ {/if} {#if !promptInvite} - + {#if filteredInvites?.length}
@@ -926,7 +938,7 @@ .auth-entity, .auth-entity-header { display: grid; - grid-template-columns: 1fr 180px; + grid-template-columns: 1fr 220px; align-items: center; gap: var(--spacing-xl); } @@ -957,7 +969,7 @@ overflow-y: auto; overflow-x: hidden; position: absolute; - width: 440px; + width: 480px; right: 0; height: 100%; box-shadow: 0 0 40px 10px rgba(0, 0, 0, 0.1); @@ -1034,4 +1046,7 @@ gap: var(--spacing-xl); padding: var(--spacing-xl) 0; } + .alert { + padding: 0 var(--spacing-xl); + } diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/InfoDisplay.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/InfoDisplay.svelte index 88ddf6f9a5..5543a4c7fd 100644 --- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/InfoDisplay.svelte +++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/InfoDisplay.svelte @@ -7,9 +7,17 @@ export let quiet = false export let warning = false export let error = false + export let info = false -
+
{#if title}
@@ -27,7 +35,7 @@