feat(frontend): fix min-height

frontend/src/lib/components/graph/FlowGraphV2.svelte

@@ -32,6 +32,7 @@
 	import { Expand } from 'lucide-svelte'
 	import Toggle from '../Toggle.svelte'
 	import DataflowEdge from './renderers/edges/DataflowEdge.svelte'
+	import { encodeState } from '$lib/utils'
 
 	export let success: boolean | undefined = undefined
 	export let modules: FlowModule[] | undefined = []
@@ -169,9 +170,12 @@
 	const nodes = writable<Node[]>([])
 	const edges = writable<Edge[]>([])
 
+	let height = 0
 	function updateStores() {
 		$nodes = layoutNodes(graph?.nodes)
 		$edges = graph.edges
+
+		height = Math.max(...$nodes.map((n) => n.position.y + NODE.height), minHeight)
 	}
 
 	$: graph && updateStores()
@@ -209,11 +213,8 @@
 </script>
 
 <div
-	style={`min-height: ${minHeight}px; max-height: ${
-		maxHeight ? maxHeight + 'px' : 'none'
-	}; height:100%;`}
+	style={`height: ${height}px; max-height: ${maxHeight ? maxHeight + 'px' : 'none'};`}
 	bind:clientWidth={width}
-	class="h-full"
 >
 	<SvelteFlow
 		{nodes}
@@ -224,6 +225,7 @@
 		connectionLineType={ConnectionLineType.SmoothStep}
 		defaultEdgeOptions={{ type: 'smoothstep' }}
 		fitView
+		preventScrolling={scroll}
 		{proOptions}
 		nodesDraggable={false}
 		on:nodeclick={(e) => handleNodeClick(e)}
@@ -231,7 +233,17 @@
 		<Background class="!bg-surface-secondary" />
 		<Controls position="top-right" orientation="horizontal" showLock={false}>
 			{#if download}
-				<ControlButton on:click={() => dispatch('expand')} class="!bg-surface">
+				<ControlButton
+					on:click={() => {
+						try {
+							localStorage.setItem('svelvet', encodeState({ modules, failureModule }))
+						} catch (e) {
+							console.error('error interacting with local storage', e)
+						}
+						window.open('/view_graph', '_blank')
+					}}
+					class="!bg-surface"
+				>
 					<Expand size="14" />
 				</ControlButton>
 			{/if}

frontend/src/routes/approve/[workspace]/[job]/[resume]/[hmac]/+page.svelte

@@ -9,7 +9,6 @@
 	import JobArgs from '$lib/components/JobArgs.svelte'
 	import { onDestroy, onMount } from 'svelte'
 	import Tooltip from '$lib/components/Tooltip.svelte'
-	import FlowGraph from '$lib/components/graph/FlowGraph.svelte'
 	import SchemaForm from '$lib/components/SchemaForm.svelte'
 	import { enterpriseLicense, userStore, workspaceStore } from '$lib/stores'
 	import { LogIn, AlertTriangle } from 'lucide-svelte'
@@ -20,6 +19,7 @@
 	import { setLicense } from '$lib/enterpriseUtils'
 	import DisplayResult from '$lib/components/DisplayResult.svelte'
 	import ScheduleEditor from '$lib/components/ScheduleEditor.svelte'
+	import FlowGraphV2 from '$lib/components/graph/FlowGraphV2.svelte'
 
 	$workspaceStore = $page.params.workspace
 	let rd = $page.url.href.replace($page.url.origin, '')
@@ -286,7 +286,7 @@
 		{#if job && job.raw_flow && !completed}
 			<h2 class="mt-10">Flow details</h2>
 			<div class="border border-gray-700">
-				<FlowGraph
+				<FlowGraphV2
 					modules={job.raw_flow?.modules}
 					failureModule={job.raw_flow?.failure_module}
 					notSelectable

frontend/src/routes/view_graph/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import FlowGraph from '$lib/components/graph/FlowGraph.svelte'
+	import FlowGraphV2 from '$lib/components/graph/FlowGraphV2.svelte'
 	import { decodeState } from '$lib/utils'
 
 	let content = localStorage.getItem('svelvet')
@@ -8,7 +8,7 @@
 		: { modules: [], failureModule: undefined }
 </script>
 
-<FlowGraph fullSize {modules} {failureModule} />
+<FlowGraphV2 fullSize {modules} {failureModule} />
 <a
 	download="flow.json"
 	href={'data:text/json;charset=utf-8,' +