Browse Source

Updating to use automation setup to use action button instead of custom chevron div and using the action button in the automation code editor so that bindings can be hidden/shown if they are taking up too much of screen.

pull/4434/head
mike12345567 5 years ago
parent
commit
b15f003c8c
  1. 18
      packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowItem.svelte
  2. 13
      packages/builder/src/components/automation/SetupPanel/AutomationBlockSetup.svelte

18
packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowItem.svelte

@ -9,6 +9,7 @@
Modal,
Button,
StatusLight,
ActionButton,
} from "@budibase/bbui"
import AutomationBlockSetup from "../../SetupPanel/AutomationBlockSetup.svelte"
import CreateWebhookModal from "components/automation/Shared/CreateWebhookModal.svelte"
@ -119,19 +120,13 @@
<div class="blockSection">
<Layout noPadding gap="S">
<div class="splitHeader">
<div
on:click|stopPropagation={() => {
setupToggled = !setupToggled
}}
class="center-items"
<ActionButton
on:click={() => (setupToggled = !setupToggled)}
quiet
icon={setupToggled ? "ChevronDown" : "ChevronRight"}
>
{#if setupToggled}
<Icon size="M" name="ChevronDown" />
{:else}
<Icon size="M" name="ChevronRight" />
{/if}
<Detail size="S">Setup</Detail>
</div>
</ActionButton>
{#if !isTrigger}
<div on:click={() => deleteStep()}>
<Icon name="DeleteOutline" />
@ -187,6 +182,7 @@
.splitHeader {
display: flex;
justify-content: space-between;
align-items: center;
}
.iconAlign {
padding: 0 0 0 var(--spacing-m);

13
packages/builder/src/components/automation/SetupPanel/AutomationBlockSetup.svelte

@ -10,6 +10,7 @@
ActionButton,
Drawer,
Modal,
Detail,
} from "@budibase/bbui"
import CreateWebhookModal from "components/automation/Shared/CreateWebhookModal.svelte"
@ -37,6 +38,7 @@
let drawer
let tempFilters = lookForFilters(schemaProperties) || []
let fillWidth = true
let codeBindingOpen = false
$: stepId = block.stepId
$: bindings = getAvailableBindings(
@ -233,7 +235,16 @@
<SchemaSetup on:change={e => onChange(e, key)} value={inputData[key]} />
{:else if value.customType === "code"}
<CodeEditorModal>
<pre>{JSON.stringify(bindings, null, 2)}</pre>
<ActionButton
on:click={() => (codeBindingOpen = !codeBindingOpen)}
quiet
icon={codeBindingOpen ? "ChevronDown" : "ChevronRight"}
>
<Detail size="S">Bindings</Detail>
</ActionButton>
{#if codeBindingOpen}
<pre>{JSON.stringify(bindings, null, 2)}</pre>
{/if}
<Editor
mode="javascript"
on:change={e => {

Loading…
Cancel
Save