Merge branch 'master' into budi-7680/data-section-add-search-to-data-sources

This commit is contained in:
Michael Drury 2023-11-21 14:21:14 +00:00 committed by GitHub
commit 921fcb08e6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 127 additions and 7 deletions

View File

@ -16,10 +16,9 @@
const dispatch = createEventDispatcher()
const onClick = e => {
const onClick = () => {
if (!disabled) {
dispatch("click")
e.stopPropagation()
}
}
</script>

View File

@ -20,7 +20,12 @@
import analytics, { Events, EventSource } from "analytics"
import { API } from "api"
import { apps } from "stores/portal"
import { deploymentStore, store, isOnlyUser } from "builderStore"
import {
deploymentStore,
store,
isOnlyUser,
sortedScreens,
} from "builderStore"
import TourWrap from "components/portal/onboarding/TourWrap.svelte"
import { TOUR_STEP_KEYS } from "components/portal/onboarding/tours.js"
import { goto } from "@roxi/routify"
@ -48,7 +53,7 @@
$store.upgradableVersion &&
$store.version &&
$store.upgradableVersion !== $store.version
$: canPublish = !publishing && loaded
$: canPublish = !publishing && loaded && $sortedScreens.length > 0
$: lastDeployed = getLastDeployedString($deploymentStore)
const initialiseApp = async () => {
@ -175,7 +180,12 @@
<div class="app-action-button preview">
<div class="app-action">
<ActionButton quiet icon="PlayCircle" on:click={previewApp}>
<ActionButton
disabled={$sortedScreens.length === 0}
quiet
icon="PlayCircle"
on:click={previewApp}
>
Preview
</ActionButton>
</div>

View File

@ -0,0 +1,65 @@
<xml version="1.0" />
<svg
xmlns="http://www.w3.org/2000/svg"
enable-background="new 0 0 48 48"
height="48px"
viewBox="0 0 48 48"
width="48px"
xml:space="preserve"
>
<g>
<g>
<path
d="M9,42H3c-0.552,0-1-0.449-1-1v-3.5C2,37.224,2.224,37,2.5,37S3,37.224,3,37.5V41h6 c0.276,0,0.5,0.224,0.5,0.5S9.276,42,9,42z"
/>
<path
d="M45,42h-6c-0.276,0-0.5-0.224-0.5-0.5S38.724,41,39,41h6V13H3v27c0,0.276-0.224,0.5-0.5,0.5S2,40.276,2,40 V12h44v29C46,41.551,45.552,42,45,42z"
/>
<g>
<path
d="M45.5,13h-43C2.224,13,2,12.776,2,12.5v-5C2,6.673,2.673,6,3.5,6h41C45.327,6,46,6.673,46,7.5v5 C46,12.776,45.776,13,45.5,13z M3,12h42V7.5C45,7.224,44.775,7,44.5,7h-41C3.225,7,3,7.224,3,7.5V12z"
/>
</g>
<g>
<g>
<path
d="M16.5,11c-0.827,0-1.5-0.673-1.5-1.5S15.673,8,16.5,8S18,8.673,18,9.5S17.327,11,16.5,11z M16.5,9 C16.225,9,16,9.224,16,9.5s0.225,0.5,0.5,0.5S17,9.776,17,9.5S16.775,9,16.5,9z"
/>
</g>
<g>
<path
d="M11.5,11c-0.827,0-1.5-0.673-1.5-1.5S10.673,8,11.5,8S13,8.673,13,9.5S12.327,11,11.5,11z M11.5,9 C11.225,9,11,9.224,11,9.5s0.225,0.5,0.5,0.5S12,9.776,12,9.5S11.775,9,11.5,9z"
/>
</g>
<g>
<path
d="M6.5,11C5.673,11,5,10.327,5,9.5S5.673,8,6.5,8S8,8.673,8,9.5S7.327,11,6.5,11z M6.5,9 C6.225,9,6,9.224,6,9.5S6.225,10,6.5,10S7,9.776,7,9.5S6.775,9,6.5,9z"
/>
</g>
</g>
</g>
<g>
<g>
<path
d="M35.696,44H12.304c-0.728,0-1.313-0.284-1.605-0.779c-0.289-0.489-0.259-1.126,0.084-1.749L22.58,19.996 c0.709-1.285,2.132-1.285,2.839,0l11.799,21.477v0c0.343,0.623,0.373,1.26,0.084,1.749C37.01,43.716,36.424,44,35.696,44z M24,20 c-0.176,0-0.379,0.179-0.544,0.478L11.659,41.954c-0.168,0.306-0.205,0.582-0.101,0.758C11.667,42.895,11.938,43,12.304,43 h23.393c0.365,0,0.637-0.105,0.745-0.288c0.104-0.177,0.067-0.453-0.101-0.758v0L24.543,20.478C24.379,20.179,24.176,20,24,20z"
/>
</g>
<g>
<path
d="M24,36L24,36c-0.225,0-0.421-0.15-0.481-0.366C23.456,35.412,22,30.169,22,28c0-1.103,0.897-2,2-2 s2,0.897,2,2c0,2.232-1.457,7.417-1.519,7.636C24.42,35.851,24.224,36,24,36z M24,27c-0.552,0-1,0.449-1,1 c0,1.266,0.569,3.793,1.002,5.531C24.435,31.806,25,29.301,25,28C25,27.449,24.552,27,24,27z"
/>
</g>
<g>
<path
d="M24,41c-1.103,0-2-0.897-2-2s0.897-2,2-2s2,0.897,2,2S25.103,41,24,41z M24,38c-0.552,0-1,0.449-1,1 s0.448,1,1,1s1-0.449,1-1S24.552,38,24,38z"
/>
</g>
</g>
</g>
</svg>
<style>
svg {
fill: var(--ink);
}
</style>

View File

@ -1,8 +1,10 @@
<script>
import { params, goto } from "@roxi/routify"
import { apps, auth, sideBarCollapsed } from "stores/portal"
import { ActionButton } from "@budibase/bbui"
import { Link, Body, ActionButton } from "@budibase/bbui"
import { sdk } from "@budibase/shared-core"
import { API } from "api"
import ErrorSVG from "./ErrorSVG.svelte"
$: app = $apps.find(app => app.appId === $params.appId)
$: iframeUrl = getIframeURL(app)
@ -14,6 +16,18 @@
}
return `/${app.devId}`
}
let noScreens = false
// Normally fetched in builder/src/pages/builder/app/[application]/_layout.svelte
const fetchScreens = async appId => {
if (!appId) return
const pkg = await API.fetchAppPackage(appId)
noScreens = pkg.screens.length === 0
}
$: fetchScreens(app?.devId)
</script>
<div class="container">
@ -45,6 +59,7 @@
</ActionButton>
{/if}
<ActionButton
disabled={noScreens}
quiet
icon="LinkOut"
on:click={() => window.open(iframeUrl, "_blank")}
@ -52,7 +67,19 @@
Fullscreen
</ActionButton>
</div>
<iframe src={iframeUrl} title={app.name} />
{#if noScreens}
<div class="noScreens">
<ErrorSVG />
<Body>You haven't added any screens to your app yet.</Body>
<Body>
<Link size="L" href={`/builder/app/${app.devId}/design`}
>Click here</Link
> to add some.
</Body>
</div>
{:else}
<iframe src={iframeUrl} title={app.name} />
{/if}
</div>
<style>
@ -64,6 +91,7 @@
align-items: stretch;
padding: 0 var(--spacing-l) var(--spacing-l) var(--spacing-l);
}
.header {
display: flex;
justify-content: flex-start;
@ -71,9 +99,27 @@
gap: var(--spacing-xs);
flex: 0 0 50px;
}
iframe {
flex: 1 1 auto;
border-radius: var(--spacing-s);
border: 1px solid var(--spectrum-global-color-gray-300);
}
.noScreens {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
padding: 20px;
box-sizing: border-box;
}
.noScreens :global(svg) {
width: 100px;
height: 100px;
margin-bottom: 10px;
}
</style>