From eb9fbb999ff83328e4971f995869fc468f39d312 Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@windmill.dev>
Date: Thu, 11 Sep 2025 07:57:01 +0000
Subject: [PATCH] updates

---
 frontend/package-lock.json                    | 14 ++----
 frontend/package.json                         |  2 -
 .../src/lib/components/S3FilePicker.svelte    |  2 +-
 .../auditLogs/AuditLogsTable.svelte           |  8 +---
 .../lib/components/display/PdfViewer.svelte   |  2 +-
 .../components/flows/map/FlowJobsMenu.svelte  |  6 +--
 .../flows/map/InsertModuleButton.svelte       |  1 +
 .../flows/map/InsertModuleInner.svelte        | 46 +++++++++++++------
 .../components/graph/graphBuilder.svelte.ts   |  3 +-
 .../graph/renderers/edges/BaseEdge.svelte     | 12 ++++-
 .../src/lib/components/runs/RunsTable.svelte  |  2 +-
 11 files changed, 57 insertions(+), 41 deletions(-)

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index d127aa438b..262e84019e 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -69,7 +69,6 @@
 				"svelte-carousel": "^1.0.25",
 				"svelte-exmarkdown": "^5.0.0",
 				"svelte-infinite-loading": "^1.4.0",
-				"svelte-tiny-virtual-list": "^2.0.5",
 				"tailwind-merge": "^1.13.2",
 				"vscode": "npm:@codingame/monaco-vscode-extension-api@~20.2.1",
 				"vscode-languageclient": "~9.0.1",
@@ -113,7 +112,6 @@
 				"@types/d3-zoom": "^3.0.3",
 				"@types/diff": "^7.0.1",
 				"@types/lodash": "^4.14.195",
-				"@types/node": "^20.3.3",
 				"@types/vscode": "^1.83.5",
 				"@typescript-eslint/eslint-plugin": "^5.59.8",
 				"@typescript-eslint/parser": "^5.60.0",
@@ -3799,6 +3797,8 @@
 			"integrity": "sha512-yCAeZl7a0DxgNVteXFHt9+uyFbqXGy/ShC4BlcHkoE0AfGXYv/BUiplV72DjMYXHDBXFjhvr6DD1NiRVfB4j8g==",
 			"dev": true,
 			"license": "MIT",
+			"optional": true,
+			"peer": true,
 			"dependencies": {
 				"undici-types": "~6.21.0"
 			}
@@ -12722,12 +12722,6 @@
 				"svelte": "^4.2.19 || ^5.1.0"
 			}
 		},
-		"node_modules/svelte-tiny-virtual-list": {
-			"version": "2.1.2",
-			"resolved": "https://registry.npmjs.org/svelte-tiny-virtual-list/-/svelte-tiny-virtual-list-2.1.2.tgz",
-			"integrity": "sha512-jeP/WMvgFUR4mYXHGPiCexjX5DuzSO+3xzHNhxfcsFyy+uYPtnqI5UGb383swpzQAyXB0OBqYfzpYihD/5gxnA==",
-			"license": "MIT"
-		},
 		"node_modules/svelte2tsx": {
 			"version": "0.6.27",
 			"resolved": "https://registry.npmjs.org/svelte2tsx/-/svelte2tsx-0.6.27.tgz",
@@ -13236,7 +13230,9 @@
 			"resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
 			"integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==",
 			"dev": true,
-			"license": "MIT"
+			"license": "MIT",
+			"optional": true,
+			"peer": true
 		},
 		"node_modules/unified": {
 			"version": "11.0.5",
diff --git a/frontend/package.json b/frontend/package.json
index b4718a64eb..d438c190f1 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -33,7 +33,6 @@
 		"@types/d3-zoom": "^3.0.3",
 		"@types/diff": "^7.0.1",
 		"@types/lodash": "^4.14.195",
-		"@types/node": "^20.3.3",
 		"@types/vscode": "^1.83.5",
 		"@typescript-eslint/eslint-plugin": "^5.59.8",
 		"@typescript-eslint/parser": "^5.60.0",
@@ -136,7 +135,6 @@
 		"svelte-carousel": "^1.0.25",
 		"svelte-exmarkdown": "^5.0.0",
 		"svelte-infinite-loading": "^1.4.0",
-		"svelte-tiny-virtual-list": "^2.0.5",
 		"tailwind-merge": "^1.13.2",
 		"vscode": "npm:@codingame/monaco-vscode-extension-api@~20.2.1",
 		"vscode-languageclient": "~9.0.1",
diff --git a/frontend/src/lib/components/S3FilePicker.svelte b/frontend/src/lib/components/S3FilePicker.svelte
index 5f0bfb89d6..b0bb946b6f 100644
--- a/frontend/src/lib/components/S3FilePicker.svelte
+++ b/frontend/src/lib/components/S3FilePicker.svelte
@@ -591,7 +591,7 @@
 								>
 									{#snippet header()}{/snippet}
 									{#snippet footer()}{/snippet}
-									{#snippet children({ index, style })}
+									{#snippet item({ index, style })}
 										{@const file_info = allFilesByKey[displayedFileKeys[index]]}
 
 										<div
diff --git a/frontend/src/lib/components/auditLogs/AuditLogsTable.svelte b/frontend/src/lib/components/auditLogs/AuditLogsTable.svelte
index ba98b6259a..3412f1dba2 100644
--- a/frontend/src/lib/components/auditLogs/AuditLogsTable.svelte
+++ b/frontend/src/lib/components/auditLogs/AuditLogsTable.svelte
@@ -122,11 +122,7 @@
 
 <svelte:window onresize={() => computeHeight()} />
 
-<div
-	class="divide-y min-w-[640px] h-full"
-	id="audit-logs-table-wrapper"
->
-
+<div class="divide-y min-w-[640px] h-full" id="audit-logs-table-wrapper">
 	<div bind:clientHeight={headerHeight}>
 		<div
 			class="flex flex-row bg-surface-secondary sticky top-0 w-full p-2 pr-4 text-xs font-semibold"
@@ -151,7 +147,7 @@
 			scrollToAlignment="center"
 		>
 			{#snippet header()}{/snippet}
-			{#snippet children({ index, style })}
+			{#snippet item({ index, style })}
 				<div {style} class="w-full">
 					{#if flatLogs}
 						{@const logOrDate = flatLogs[index]}
diff --git a/frontend/src/lib/components/display/PdfViewer.svelte b/frontend/src/lib/components/display/PdfViewer.svelte
index a61f81a456..d472614d9a 100644
--- a/frontend/src/lib/components/display/PdfViewer.svelte
+++ b/frontend/src/lib/components/display/PdfViewer.svelte
@@ -163,7 +163,7 @@
 			return
 		}
 		const data = await doc.saveDocument()
-		const url = URL.createObjectURL(new Blob([data.buffer]))
+		const url = URL.createObjectURL(new Blob([data.buffer as unknown as ArrayBuffer]))
 		const link = document.createElement('a')
 		link.href = url
 		link.download = 'document.pdf'
diff --git a/frontend/src/lib/components/flows/map/FlowJobsMenu.svelte b/frontend/src/lib/components/flows/map/FlowJobsMenu.svelte
index 42342858b9..38df361584 100644
--- a/frontend/src/lib/components/flows/map/FlowJobsMenu.svelte
+++ b/frontend/src/lib/components/flows/map/FlowJobsMenu.svelte
@@ -136,7 +136,7 @@
 				</MeltButton>
 			{/snippet}
 
-			{#snippet children({ item })}
+			{#snippet children({ item: childrenItem })}
 				<div class="flex flex-col px-1">
 					<input type="number" bind:value={filter} onkeydown={onKeydown} />
 
@@ -145,7 +145,7 @@
 							<VirtualList height={300} width="100%" itemCount={items.length} itemSize={24}>
 								{#snippet header()}{/snippet}
 								{#snippet footer()}{/snippet}
-								{#snippet children({ index: idx, style })}
+								{#snippet item({ index: idx, style })}
 									<div {style}>
 										<MenuItem
 											class={twMerge(
@@ -163,7 +163,7 @@
 												})
 												menu?.close()
 											}}
-											{item}
+											item={childrenItem}
 										>
 											#{items[idx].index + 1}
 										</MenuItem>
diff --git a/frontend/src/lib/components/flows/map/InsertModuleButton.svelte b/frontend/src/lib/components/flows/map/InsertModuleButton.svelte
index 3a5c1c1b65..71a5fbff6e 100644
--- a/frontend/src/lib/components/flows/map/InsertModuleButton.svelte
+++ b/frontend/src/lib/components/flows/map/InsertModuleButton.svelte
@@ -104,6 +104,7 @@ shouldUsePortal={true} -->
 			on:new
 			on:pickFlow
 			on:pickScript
+			allowTrigger={index == 0}
 			{kind}
 		/>
 	{/snippet}
diff --git a/frontend/src/lib/components/flows/map/InsertModuleInner.svelte b/frontend/src/lib/components/flows/map/InsertModuleInner.svelte
index 609ffebdb1..b088fcd7ee 100644
--- a/frontend/src/lib/components/flows/map/InsertModuleInner.svelte
+++ b/frontend/src/lib/components/flows/map/InsertModuleInner.svelte
@@ -1,4 +1,6 @@
 <script lang="ts">
+	import { run } from 'svelte/legacy'
+
 	import { createEventDispatcher, getContext } from 'svelte'
 	import StepGenQuick from '$lib/components/copilot/StepGenQuick.svelte'
 	import FlowInputsQuick from '../content/FlowInputsQuick.svelte'
@@ -9,25 +11,39 @@
 	// import type { Writable } from 'svelte/store'
 
 	const dispatch = createEventDispatcher()
-	export let stop = false
-	export let funcDesc = ''
-	export let disableAi = false
-	export let kind: 'script' | 'trigger' | 'preprocessor' | 'failure' = 'script'
-	export let allowTrigger = true
-	export let scriptOnly = false
+	interface Props {
+		stop?: boolean
+		funcDesc?: string
+		disableAi?: boolean
+		kind?: 'script' | 'trigger' | 'preprocessor' | 'failure'
+		allowTrigger?: boolean
+		scriptOnly?: boolean
+	}
+
+	let {
+		stop = false,
+		funcDesc = $bindable(''),
+		disableAi = false,
+		kind = 'script',
+		allowTrigger = true,
+		scriptOnly = false
+	}: Props = $props()
 
 	let customUi: undefined | FlowBuilderWhitelabelCustomUi = getContext('customUi')
-	let selectedKind: 'script' | 'trigger' | 'preprocessor' | 'approval' | 'flow' | 'failure' = kind
-	let preFilter: 'all' | 'workspace' | 'hub' = 'all'
-	let loading = false
-	let small = false
+	let selectedKind: 'script' | 'trigger' | 'preprocessor' | 'approval' | 'flow' | 'failure' =
+		$state(kind)
+	let preFilter: 'all' | 'workspace' | 'hub' = $state('all')
+	let loading = $state(false)
+	let small = $state(false)
 
-	let width = 0
-	let height = 0
+	let width = $state(0)
+	let height = $state(0)
 
-	$: displayPath = width > 650 || height > 400
+	let displayPath = $derived(width > 650 || height > 400)
 
-	$: small = kind === 'preprocessor' || kind === 'failure'
+	run(() => {
+		small = kind === 'preprocessor' || kind === 'failure'
+	})
 </script>
 
 <!-- <Menu transitionDuration={0} pointerDown bind:show={open} noMinW {placement} let:close> -->
@@ -45,7 +61,7 @@ shouldUsePortal={true} -->
 		: 'w-[650px]'} pt-1 pr-1 pl-1 gap-1.5 resize overflow-auto {small
 		? 'min-w-[450px]'
 		: 'min-w-[650px]'} min-h-[400px]"
-	on:wheel={(e) => {
+	onwheel={(e) => {
 		e.stopPropagation()
 	}}
 	role="none"
diff --git a/frontend/src/lib/components/graph/graphBuilder.svelte.ts b/frontend/src/lib/components/graph/graphBuilder.svelte.ts
index 2a6469a4b6..acfdb7d4b2 100644
--- a/frontend/src/lib/components/graph/graphBuilder.svelte.ts
+++ b/frontend/src/lib/components/graph/graphBuilder.svelte.ts
@@ -41,9 +41,10 @@ export type GraphEventHandlers = {
 		targetId?: string
 		branch?: { rootId: string; branch: number }
 		index: number
-		kind: string
+		kind?: string
 		inlineScript?: InlineScript
 		script?: PathScript
+		flow?: { path: string; summary: string }
 		isPreprocessor?: boolean
 	}) => void
 	deleteBranch: (detail: { id: string; index: number }, label: string) => void
diff --git a/frontend/src/lib/components/graph/renderers/edges/BaseEdge.svelte b/frontend/src/lib/components/graph/renderers/edges/BaseEdge.svelte
index ffdfa3da3d..ffe4b76b6e 100644
--- a/frontend/src/lib/components/graph/renderers/edges/BaseEdge.svelte
+++ b/frontend/src/lib/components/graph/renderers/edges/BaseEdge.svelte
@@ -32,7 +32,7 @@
 		data: {
 			insertable: boolean
 			sourceId: string
-			branch: number | undefined
+			branch: { rootId: string; branch: number } | undefined
 			targetId: string
 			moving: string | undefined
 			eventHandlers: GraphEventHandlers
@@ -192,7 +192,15 @@
 	{/if}
 </EdgeLabel>
 
-<BaseEdge path={completeEdge} {markerEnd} class={$useDataflow ? 'hidden' : ''} />
+<BaseEdge
+	path={completeEdge}
+	{markerEnd}
+	class={$useDataflow ? 'hidden' : ''}
+	interactionWidth={0}
+	style={undefined}
+	label={undefined}
+	labelStyle={undefined}
+/>
 
 <style>
 	.edgeButtonContainer {
diff --git a/frontend/src/lib/components/runs/RunsTable.svelte b/frontend/src/lib/components/runs/RunsTable.svelte
index 0c639b23aa..26d8fb7ce2 100644
--- a/frontend/src/lib/components/runs/RunsTable.svelte
+++ b/frontend/src/lib/components/runs/RunsTable.svelte
@@ -267,7 +267,7 @@
 			scrollToAlignment="center"
 		>
 			{#snippet header()}{/snippet}
-			{#snippet children({ index, style })}
+			{#snippet item({ index, style })}
 				<div {style} class="w-full">
 					{#if flatJobs}
 						{@const jobOrDate = flatJobs[index]}