2020-05-28 08:51:32 +12:00
|
|
|
<script>
|
2020-09-22 00:49:34 +12:00
|
|
|
import { automationStore, backendUiStore } from "builderStore"
|
2020-06-02 08:40:02 +12:00
|
|
|
import Flowchart from "./flowchart/FlowChart.svelte"
|
2020-10-27 01:18:34 +13:00
|
|
|
import BlockList from "./BlockList.svelte"
|
2020-05-28 08:51:32 +12:00
|
|
|
|
2020-09-22 00:49:34 +12:00
|
|
|
$: automation = $automationStore.selectedAutomation?.automation
|
|
|
|
$: automationLive = automation?.live
|
2020-05-29 10:31:55 +12:00
|
|
|
$: instanceId = $backendUiStore.selectedDatabase._id
|
2020-10-27 01:18:34 +13:00
|
|
|
$: automationCount = $automationStore.automations?.length ?? 0
|
2020-05-28 08:51:32 +12:00
|
|
|
|
|
|
|
function onSelect(block) {
|
2020-10-27 01:18:34 +13:00
|
|
|
automationStore.update((state) => {
|
2020-09-12 01:23:31 +12:00
|
|
|
state.selectedBlock = block
|
2020-05-28 08:51:32 +12:00
|
|
|
return state
|
|
|
|
})
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
2020-10-27 01:18:34 +13:00
|
|
|
{#if automation}
|
|
|
|
<BlockList />
|
2020-09-22 00:49:34 +12:00
|
|
|
<Flowchart {automation} {onSelect} />
|
2020-10-27 01:18:34 +13:00
|
|
|
{:else if automationCount === 0}
|
|
|
|
<i>Create your first automation to get started</i>
|
|
|
|
{:else}<i>Select an automation to edit</i>{/if}
|
2020-05-29 07:20:03 +12:00
|
|
|
|
|
|
|
<style>
|
2020-10-27 01:18:34 +13:00
|
|
|
i {
|
|
|
|
font-size: var(--font-size-m);
|
|
|
|
color: var(--grey-5);
|
2020-05-29 07:20:03 +12:00
|
|
|
}
|
|
|
|
</style>
|