persist flow state better between drawer close/open

frontend/src/lib/components/FlowPreviewContent.svelte

@@ -19,6 +19,8 @@
 	import JsonInputs from './JsonInputs.svelte'
 	import FlowHistoryJobPicker from './FlowHistoryJobPicker.svelte'
 	import { NEVER_TESTED_THIS_FAR } from './flows/models'
+	import { writable, type Writable } from 'svelte/store'
+	import type { DurationStatus, GraphModuleState } from './graph'
 
 	export let previewMode: 'upTo' | 'whole'
 	export let open: boolean
@@ -37,6 +39,9 @@
 	export let branchOrIterationN: number = 0
 	export let scrollTop: number = 0
 
+	export let localModuleStates: Writable<Record<string, GraphModuleState>> = writable({})
+	export let localDurationStatuses: Writable<Record<string, DurationStatus>> = writable({})
+
 	let restartBranchNames: [number, string][] = []
 
 	let isRunning: boolean = false
@@ -507,6 +512,9 @@
 					</div>
 				{/if}
 				<FlowStatusViewer
+					bind:job
+					bind:localModuleStates
+					bind:localDurationStatuses
 					hideDownloadInGraph={customUi?.downloadLogs === false}
 					wideResults
 					{flowStateStore}

frontend/src/lib/components/FlowStatusViewer.svelte

@@ -3,7 +3,7 @@
 	import FlowStatusViewerInner from './FlowStatusViewerInner.svelte'
 	import type { FlowState } from './flows/flowState'
 	import { createEventDispatcher, setContext } from 'svelte'
-	import type { FlowStatusViewerContext } from './graph'
+	import type { DurationStatus, FlowStatusViewerContext, GraphModuleState } from './graph'
 	import { isOwner as loadIsOwner } from '$lib/utils'
 	import { userStore, workspaceStore } from '$lib/stores'
 	import type { Job } from '$lib/gen'
@@ -23,6 +23,9 @@
 		'timeline'
 	export let isOwner = false
 	export let wideResults = false
+	export let localModuleStates: Writable<Record<string, GraphModuleState>> = writable({})
+	export let localDurationStatuses: Writable<Record<string, DurationStatus>> = writable({})
+	export let job: Job | undefined = undefined
 
 	let lastJobId: string = jobId
 
@@ -68,11 +71,14 @@
 		}
 		dispatch('jobsLoaded', job)
 	}}
-	globalDurationStatuses={[]}
 	globalModuleStates={[]}
+	globalDurationStatuses={[]}
+	bind:localModuleStates
+	bind:localDurationStatuses
 	bind:selectedNode={selectedJobStep}
 	on:start
 	on:done
+	bind:job
 	{initialJob}
 	{jobId}
 	{workspaceId}

frontend/src/lib/components/FlowStatusViewerInner.svelte

@@ -84,6 +84,8 @@
 	export let rightColumnSelect: 'timeline' | 'node_status' | 'node_definition' | 'user_states' =
 		'timeline'
 
+	export let localModuleStates: Writable<Record<string, GraphModuleState>> = writable({})
+	export let localDurationStatuses: Writable<Record<string, DurationStatus>> = writable({})
 	let recursiveRefresh: Record<string, (clear, root) => Promise<void>> = {}
 
 	let jobResults: any[] =
@@ -92,8 +94,6 @@
 	let retry_selected = ''
 	let timeout: NodeJS.Timeout | undefined = undefined
 
-	let localModuleStates: Writable<Record<string, GraphModuleState>> = writable({})
-	let localDurationStatuses: Writable<Record<string, DurationStatus>> = writable({})
 	let expandedSubflows: Record<string, FlowModule[]> = {}
 
 	$: flowJobIds?.moduleId && onFlowModuleId()
@@ -495,6 +495,7 @@
 
 	async function updateJobId() {
 		if (jobId !== job?.id) {
+			console.log('updating job id', globalDurationStatuses.length)
 			$localModuleStates = {}
 			flowTimeline?.reset()
 			timeout && clearTimeout(timeout)

frontend/src/lib/components/flows/header/FlowPreviewButtons.svelte

@@ -10,6 +10,8 @@
 	import { getContext } from 'svelte'
 	import type { FlowEditorContext } from '../types'
 	import { Play } from 'lucide-svelte'
+	import { writable, type Writable } from 'svelte/store'
+	import type { DurationStatus, GraphModuleState } from '$lib/components/graph'
 
 	export let loading = false
 
@@ -41,6 +43,9 @@
 
 	let rightColumnSelect: 'timeline' | 'node_status' | 'node_definition' | 'user_states' = 'timeline'
 
+	let localModuleStates: Writable<Record<string, GraphModuleState>> = writable({})
+	let localDurationStatuses: Writable<Record<string, DurationStatus>> = writable({})
+
 	$: upToDisabled =
 		$selectedId == undefined ||
 		[
@@ -106,6 +111,8 @@
 	<Drawer bind:open={previewOpen} size="75%" {preventEscape}>
 		<FlowPreviewContent
 			bind:this={flowPreviewContent}
+			bind:localModuleStates
+			bind:localDurationStatuses
 			open={previewOpen}
 			bind:scrollTop
 			bind:previewMode