From d70699e0d26e1e66eeea808dc40f47e365651994 Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Thu, 13 Jul 2023 20:32:43 +0200
Subject: [PATCH] fix iter reactivity

---
 .../apps/components/helpers/RunnableComponent.svelte   | 10 ++++++----
 .../lib/components/apps/editor/AppEditorHeader.svelte  |  4 +++-
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte b/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte
index 989b0d667d..e297fbd42e 100644
--- a/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte
+++ b/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte
@@ -182,7 +182,8 @@
 
 				$state = $state
 				const job = generateNextFrontendJobId()
-				$jobs = [{ job, component: id, result: r }, ...$jobs]
+				const njobs = [{ job, component: id, result: r }, ...$jobs]
+				$jobs = $jobs?.length > 100 ? njobs.slice(0, 100) : njobs
 			} catch (e) {
 				sendUserToast(`Error running frontend script ${id}: ` + e.message, true)
 
@@ -264,7 +265,8 @@
 				})
 			})
 			if (njob) {
-				$jobs = [{ job: njob, component: id }, ...$jobs]
+				const njobs = [{ job: njob, component: id }, ...$jobs]
+				$jobs = $jobs?.length > 100 ? njobs.slice(0, 100) : njobs
 			}
 		} catch (e) {
 			setResult({ error: e.body ?? e.message }, undefined)
@@ -428,7 +430,7 @@
 	{#if v.type != 'static' && v.type != 'user'}
 		<InputValue
 			bind:this={inputValues[key]}
-			key={key + extraKey}
+			key={key + extraKey + (iterContext ? $iterContext?.index : '')}
 			{id}
 			input={fields[key]}
 			bind:value={runnableInputValues[key]}
@@ -438,7 +440,7 @@
 
 {#if runnable?.type == 'runnableByName' && runnable.inlineScript?.language == 'frontend'}
 	{#each runnable.inlineScript.refreshOn ?? [] as { id: tid, key } (`${tid}-${key}`)}
-		{@const fkey = `${tid}-${key}${extraKey}`}
+		{@const fkey = `${tid}-${key}${extraKey}${iterContext ? $iterContext?.index : ''}}`}
 		<InputValue
 			{id}
 			key={fkey}
diff --git a/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte b/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte
index 0e67162e2c..85a8d6f893 100644
--- a/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte
+++ b/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte
@@ -799,7 +799,9 @@
 				<div class="flex flex-row gap-1 items-center">
 					<Bug size={14} />
 					<div> Debug runs</div>
-					<div class="text-2xs text-gray-500">({$jobs?.length ?? 0})</div>
+					<div class="text-2xs text-gray-500"
+						>({$jobs?.length > 99 ? '99+' : $jobs?.length ?? 0})</div
+					>
 					{#if hasErrors}
 						<Button
 							size="xs"