check dup on flow editor

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

@@ -7,21 +7,20 @@
 	import FlowInput from './FlowInput.svelte'
 	import FlowFailureModule from './FlowFailureModule.svelte'
 	import FlowConstants from './FlowConstants.svelte'
-	// import type { FlowModule } from '$lib/gen'
+	import type { FlowModule } from '$lib/gen'
 
 	const { selectedId, flowStore } = getContext<FlowEditorContext>('FlowEditorContext')
 
-	// function checkDup(modules: FlowModule[]): FlowModule[] {
-	// 	let seenModules: FlowModule[] = []
-	// 	for (const m of modules) {
-	// 		if (seenModules.find((sm) => sm.id === m.id)) {
-	// 			console.error(`Duplicate module id: ${m.id}`)
-	// 			continue
-	// 		}
-	// 		seenModules.push(m)
-	// 	}
-	// 	return seenModules
-	// }
+	function checkDup(modules: FlowModule[]): string | undefined {
+		let seenModules: string[] = []
+		for (const m of modules) {
+			if (seenModules.includes(m.id)) {
+				console.error(`Duplicate module id: ${m.id}`)
+				return m.id
+			}
+			seenModules.push(m.id)
+		}
+	}
 </script>
 
 {#if $selectedId?.startsWith('settings')}
@@ -35,9 +34,14 @@
 {:else if $selectedId === 'failure'}
 	<FlowFailureModule />
 {:else}
-	{#key $selectedId}
-		{#each $flowStore.value.modules as flowModule, index (flowModule.id ?? index)}
-			<FlowModuleWrapper bind:flowModule previousModule={$flowStore.value.modules[index - 1]} />
-		{/each}
-	{/key}
+	{@const dup = checkDup($flowStore.value.modules)}
+	{#if dup}
+		<div class="text-red-600 text-xl p-2">There are duplicate modules in the flow at id: {dup}</div>
+	{:else}
+		{#key $selectedId}
+			{#each $flowStore.value.modules as flowModule, index (flowModule.id ?? index)}
+				<FlowModuleWrapper bind:flowModule previousModule={$flowStore.value.modules[index - 1]} />
+			{/each}
+		{/key}
+	{/if}
 {/if}