feat(frontend): Flow UX entire rework (#552)

* feature(frontend): Flow rework WIP

* feature(frontend): Right panel behavior done

* feature(frontend): Split panel working

* feature(frontend): Flows working

* feature(frontend): Add inputs + adapt style + remove duplicate library

* feature(frontend): remove old implementation

* feature(frontend): revert package-lock

* feature(frontend): revert old FlowBuilder component

* feature(frontend): Fix margins + add remove button on the minimap

* feature(frontend): Fix wording

* feature(frontend): add PR UI comments

* feature(frontend): Display the module title

* feature(frontend): Previews working

* feature(frontend): Fix schedule load + update

* feature(frontend): fix build

* feature(frontend): UI fix

* fix just this step

* feature(frontend): for loop iterator and skip failures

* just this step

* script helpers

Co-authored-by: Ruben Fiszel <ruben@rubenfiszel.com>
This commit is contained in:
Faton Ramadani
2022-09-14 12:34:51 +02:00
committed by GitHub
co-authored by Ruben Fiszel
parent 5a2c45e6b2
commit c9ae5905a8
42 changed files with 1097 additions and 1003 deletions
@@ -0,0 +1,48 @@
<script lang="ts">
import { getContext } from 'svelte'
import { flowStateStore } from '../flowState'
import type { FlowEditorContext } from '../types'
import FlowModule from './FlowModule.svelte'
const { selectedId } = getContext<FlowEditorContext>('FlowEditorContext')
function selectedIdToIndexes(selectedId: string): number[] {
return selectedId.split('-').map(Number)
}
$: [parentIndex, childIndex] = selectedIdToIndexes($selectedId)
</script>
{#if $flowStateStore.modules[parentIndex] && $flowStateStore.modules[parentIndex].childFlowModules !== undefined}
{#each $flowStateStore.modules[parentIndex].childFlowModules ?? [] as fa, index}
{#if index === childIndex}
<FlowModule
indexes={$selectedId}
args={{}}
bind:flowModule={fa.flowModule}
bind:schema={fa.schema}
bind:childFlowModules={fa.childFlowModules}
on:delete={() => {
$flowStateStore.modules[parentIndex].childFlowModules?.splice(index, 1)
$flowStateStore = $flowStateStore
}}
/>
{/if}
{/each}
{:else}
{#each $flowStateStore.modules ?? [] as fa, index}
{#if index === parentIndex}
<FlowModule
indexes={$selectedId}
args={{}}
bind:flowModule={fa.flowModule}
bind:schema={fa.schema}
bind:childFlowModules={fa.childFlowModules}
on:delete={() => {
$flowStateStore.modules.splice(index, 1)
$flowStateStore = $flowStateStore
}}
/>
{/if}
{/each}
{/if}