More Generic OnChange

frontend/src/lib/components/common/OnChange.svelte

@@ -0,0 +1,15 @@
+<!--
+	Useful to listen to changes on a list without recomputing the whole list
+	when a single item changes
+-->
+
+<script lang="ts" generics="T">
+	import { untrack } from 'svelte'
+
+	let { key, onChange }: { key: T; onChange: () => void } = $props()
+
+	$effect(() => {
+		key
+		untrack(() => onChange())
+	})
+</script>

frontend/src/lib/components/flows/FlowEditor.svelte

@@ -15,8 +15,10 @@
 	import FlowAIChat from '../copilot/chat/flow/FlowAIChat.svelte'
 	import { aiChatManager, AIMode } from '../copilot/chat/AIChatManager.svelte'
 	import { triggerableByAI } from '$lib/actions/triggerableByAI'
-	import FlowModuleScriptAssetHandler from './content/RawScriptAssetHandler.svelte'
 	import { getAllModules } from './flowExplorer'
+	import { inferAssets } from '$lib/infer'
+	import { parseAsset } from '../assets/lib'
+	import OnChange from '../common/OnChange.svelte'
 	const { flowStore, flowStateStore } = getContext<FlowEditorContext>('FlowEditorContext')
 
 	interface Props {
@@ -144,9 +146,15 @@
 
 {#each getAllModules(flowStore.val.value.modules) as mod}
 	{#if mod.value.type === 'rawscript'}
-		<FlowModuleScriptAssetHandler
-			value={mod.value}
-			onChange={(assets) => ($flowStateStore[mod.id].assetsCache = assets)}
+		{@const v = mod.value}
+		<OnChange
+			key={v.content}
+			onChange={() =>
+				inferAssets(v.language, v.content).then((assetsRaw) => {
+					$flowStateStore[mod.id].assetsCache = assetsRaw
+						.map((asset) => parseAsset(asset))
+						.filter((a) => !!a)
+				})}
 		/>
 	{/if}
 {/each}

frontend/src/lib/components/flows/content/RawScriptAssetHandler.svelte

@@ -1,13 +0,0 @@
-<script lang="ts">
-	import { parseAsset } from '$lib/components/assets/lib'
-	import { type Asset, type RawScript } from '$lib/gen'
-	import { inferAssets } from '$lib/infer'
-
-	let { value, onChange }: { value: RawScript; onChange: (assets: Asset[]) => void } = $props()
-
-	$effect(() => {
-		inferAssets(value.language, value.content).then((assets) => {
-			onChange(assets.map(parseAsset).filter((x) => !!x))
-		})
-	})
-</script>