From 8119025381c19b399b344ab07c0c8b433012fc54 Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Mon, 26 Sep 2022 03:53:11 +0200
Subject: [PATCH] initialize flow store correctly

---
 frontend/src/lib/components/FlowBuilder.svelte         |  8 ++++----
 .../src/lib/components/flows/content/FlowLoop.svelte   |  1 -
 frontend/src/lib/components/flows/flowState.ts         | 10 +++++-----
 frontend/src/lib/components/flows/flowStateUtils.ts    |  4 ++--
 frontend/src/lib/components/flows/flowStore.ts         |  2 +-
 .../flows/header/FlowImportExportMenu.svelte           |  4 +++-
 .../components/flows/map/FlowModuleSchemaMap.svelte    |  4 ++--
 frontend/src/lib/components/flows/scheduleUtils.ts     |  2 --
 8 files changed, 17 insertions(+), 18 deletions(-)

diff --git a/frontend/src/lib/components/FlowBuilder.svelte b/frontend/src/lib/components/FlowBuilder.svelte
index f29556de3b..51dadac4b5 100644
--- a/frontend/src/lib/components/FlowBuilder.svelte
+++ b/frontend/src/lib/components/FlowBuilder.svelte
@@ -12,6 +12,7 @@
 	} from '$lib/utils'
 	import { faGlobe } from '@fortawesome/free-solid-svg-icons'
 	import { Breadcrumb, BreadcrumbItem } from 'flowbite-svelte'
+	import Schedules from 'src/routes/schedules.svelte'
 	import { onDestroy, onMount, setContext } from 'svelte'
 	import Icon from 'svelte-awesome'
 	import { writable } from 'svelte/store'
@@ -131,8 +132,8 @@
 	})
 
 	const selectedIdStore = writable<string>('settings')
-	const scheduleStore = writable<Schedule>(undefined)
-	const previewArgsStore = writable<Record<string, any>>(undefined)
+	const scheduleStore = writable<Schedule>({ args: {}, cron: '', enabled: false })
+	const previewArgsStore = writable<Record<string, any>>({})
 
 	function select(selectedId: string) {
 		selectedIdStore.set(selectedId)
@@ -155,8 +156,7 @@
 				scheduleStore.set({
 					cron: '0 */5 * * *',
 					args: {},
-					enabled: false,
-					previewArgs: {}
+					enabled: false
 				})
 			})
 	}
diff --git a/frontend/src/lib/components/flows/content/FlowLoop.svelte b/frontend/src/lib/components/flows/content/FlowLoop.svelte
index f069417590..2c345eb0be 100644
--- a/frontend/src/lib/components/flows/content/FlowLoop.svelte
+++ b/frontend/src/lib/components/flows/content/FlowLoop.svelte
@@ -1,7 +1,6 @@
 <script lang="ts">
 	import { getContext } from 'svelte'
 	import FlowCard from '../common/FlowCard.svelte'
-	import { flowStateStore } from '../flowState'
 	import type { FlowEditorContext } from '../types'
 	import Toggle from '$lib/components/Toggle.svelte'
 
diff --git a/frontend/src/lib/components/flows/flowState.ts b/frontend/src/lib/components/flows/flowState.ts
index 40eb2ff50e..3cc953c8d7 100644
--- a/frontend/src/lib/components/flows/flowState.ts
+++ b/frontend/src/lib/components/flows/flowState.ts
@@ -1,7 +1,7 @@
 import type { Schema } from '$lib/common'
 import type { Flow, FlowModule } from '$lib/gen'
-import { derived, writable } from 'svelte/store'
-import { emptyFlowModuleSchema, isEmptyFlowModule, loadFlowModuleSchema } from './flowStateUtils'
+import { writable } from 'svelte/store'
+import { emptyFlowModuleState, isEmptyFlowModule, loadFlowModuleSchema } from './flowStateUtils'
 
 export type FlowModuleState = {
 	schema: Schema
@@ -14,14 +14,14 @@ export type FlowState = {
 	failureModule: FlowModuleState
 }
 
-export const flowStateStore = writable<FlowState>(undefined)
+export const flowStateStore = writable<FlowState>({ modules: [], failureModule: emptyFlowModuleState() })
 
 export async function initFlowState(flow: Flow) {
 	const modules = await mapFlowModules(flow.value.modules)
 
 	const failureModule = flow.value.failure_module
 		? await mapFlowModule(flow.value.failure_module)
-		: emptyFlowModuleSchema()
+		: emptyFlowModuleState()
 
 	flowStateStore.set({
 		modules,
@@ -46,7 +46,7 @@ async function mapFlowModule(flowModule: FlowModule) {
 	}
 
 	if (isEmptyFlowModule(flowModule)) {
-		return emptyFlowModuleSchema()
+		return emptyFlowModuleState()
 	}
 
 	return loadFlowModuleSchema(flowModule)
diff --git a/frontend/src/lib/components/flows/flowStateUtils.ts b/frontend/src/lib/components/flows/flowStateUtils.ts
index 1d8e010c6f..caa107dc0b 100644
--- a/frontend/src/lib/components/flows/flowStateUtils.ts
+++ b/frontend/src/lib/components/flows/flowStateUtils.ts
@@ -15,7 +15,7 @@ import { flowStateStore, type FlowModuleState, type FlowState } from './flowStat
 import { flowStore } from './flowStore'
 import { loadSchemaFromModule } from './utils'
 
-export function emptyFlowModuleSchema(): FlowModuleState {
+export function emptyFlowModuleState(): FlowModuleState {
 	return {
 		schema: emptySchema()
 	}
@@ -75,7 +75,7 @@ export async function createLoop(): Promise<[FlowModule, FlowModuleState]> {
 	const { schema } = await loadFlowModuleSchema(loopFlowModule)
 	return [loopFlowModule, {
 		schema,
-		childFlowModules: [emptyFlowModuleSchema()],
+		childFlowModules: [emptyFlowModuleState()],
 		previewResult: NEVER_TESTED_THIS_FAR
 	}]
 }
diff --git a/frontend/src/lib/components/flows/flowStore.ts b/frontend/src/lib/components/flows/flowStore.ts
index 904813439f..60aca7eb39 100644
--- a/frontend/src/lib/components/flows/flowStore.ts
+++ b/frontend/src/lib/components/flows/flowStore.ts
@@ -4,7 +4,7 @@ import { flowStateStore, initFlowState } from './flowState'
 
 export type FlowMode = 'push' | 'pull'
 
-export const flowStore = writable<Flow>(undefined)
+export const flowStore = writable<Flow>({ summary: "", value: { modules: [] }, path: "", edited_at: "", edited_by: "", archived: false, extra_perms: {} })
 
 export function initFlow(flow: Flow) {
 	for (const mod of flow.value.modules) {
diff --git a/frontend/src/lib/components/flows/header/FlowImportExportMenu.svelte b/frontend/src/lib/components/flows/header/FlowImportExportMenu.svelte
index 0e68d125f9..7b6c1a7c3d 100644
--- a/frontend/src/lib/components/flows/header/FlowImportExportMenu.svelte
+++ b/frontend/src/lib/components/flows/header/FlowImportExportMenu.svelte
@@ -54,6 +54,8 @@
 </Drawer>
 <Drawer bind:this={jsonViewerDrawer} size="800px">
 	<DrawerContent title="See JSON" on:close={() => jsonViewerDrawer.toggleDrawer()}>
-		<FlowViewer flow={cleanInputs($flowStore)} tab="json" />
+		{#if $flowStore}
+			<FlowViewer flow={cleanInputs($flowStore)} tab="json" />
+		{/if}
 	</DrawerContent>
 </Drawer>
diff --git a/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte b/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte
index 353b1966ec..b89078b648 100644
--- a/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte
+++ b/frontend/src/lib/components/flows/map/FlowModuleSchemaMap.svelte
@@ -4,7 +4,7 @@
 	import FlowModuleSchemaItem from './FlowModuleSchemaItem.svelte'
 	import Icon from 'svelte-awesome'
 	import { faPen, faPlus, faSliders } from '@fortawesome/free-solid-svg-icons'
-	import { emptyFlowModuleSchema } from '$lib/components/flows/flowStateUtils'
+	import { emptyFlowModuleState } from '$lib/components/flows/flowStateUtils'
 	import { classNames, emptyModule } from '$lib/utils'
 	import type { FlowModuleState } from '../flowState'
 	import type { FlowModule } from '$lib/gen'
@@ -16,7 +16,7 @@
 	const { select, selectedId } = getContext<FlowEditorContext>('FlowEditorContext')
 
 	function insertAtIndex(index: number): void {
-		moduleStates.splice(index, 0, emptyFlowModuleSchema())
+		moduleStates.splice(index, 0, emptyFlowModuleState())
 		modules.splice(index, 0, emptyModule())
 		moduleStates = moduleStates
 		modules = modules
diff --git a/frontend/src/lib/components/flows/scheduleUtils.ts b/frontend/src/lib/components/flows/scheduleUtils.ts
index c432f29a1a..2fd1193ef0 100644
--- a/frontend/src/lib/components/flows/scheduleUtils.ts
+++ b/frontend/src/lib/components/flows/scheduleUtils.ts
@@ -4,7 +4,6 @@ export type Schedule = {
 	args: Record<string, any>
 	cron: string
 	enabled: boolean
-	previewArgs: Record<string, any>
 }
 
 // Load the schedule of a flow given its path and the workspace
@@ -27,6 +26,5 @@ export async function loadFlowSchedule(path: string, workspace: string = ''): Pr
 		enabled: schedule.enabled,
 		cron: schedule.schedule,
 		args: schedule.args ?? {},
-		previewArgs: JSON.parse(JSON.stringify(schedule.args))
 	}
 }