fix: fix refresh init in presence of app stepper

frontend/src/lib/components/apps/components/buttons/AppButton.svelte

@@ -66,7 +66,6 @@
 		listInputs(id, inputOutput)
 	}
 
-	console.log('FOO')
 	if (controls) {
 		$componentControl[id] = controls
 	}

frontend/src/lib/components/apps/components/helpers/HiddenComponent.svelte

@@ -34,6 +34,7 @@
 
 {#if runnable && (runnable.type == 'runnableByPath' || (runnable.type == 'runnableByName' && runnable.inlineScript != undefined))}
 	<RunnableComponent
+		hasChildrens={false}
 		render={false}
 		{id}
 		fields={runnable.fields}

frontend/src/lib/components/apps/components/helpers/NonRunnableComponent.svelte

@@ -10,6 +10,7 @@
 	export let id: string
 	export let result: any
 	export let render: boolean
+	export let hasChildrens: boolean
 
 	// Sync the result to the output
 	const { worldStore } = getContext<AppViewerContext>('AppViewerContext')
@@ -34,6 +35,10 @@
 
 {#if render}
 	<slot />
+{:else if hasChildrens}
+	<div class="invisible h-0 overflow-hidden'}">
+		<slot />
+	</div>
 {:else}
 	<div class="w-full h-full" />
 {/if}

frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte

@@ -42,6 +42,7 @@
 	export let recomputableByRefreshButton: boolean
 	export let errorHandledByComponent: boolean = false
 	export let hideRefreshButton: boolean = false
+	export let hasChildrens: boolean
 
 	const {
 		worldStore,
@@ -502,9 +503,14 @@
 	bind:this={resultJobLoader}
 />
 
-{#if render}
-	<div class="h-full flex relative flex-row flex-wrap {wrapperClass}" style={wrapperStyle}>
-		{#if (autoRefresh || forceSchemaDisplay) && schemaStripped && Object.keys(schemaStripped?.properties ?? {}).length > 0}
+{#if render || hasChildrens}
+	<div
+		class="h-full flex relative flex-row flex-wrap {wrapperClass} {render
+			? 'visible'
+			: 'invisible h-0 overflow-hidden'}"
+		style={wrapperStyle}
+	>
+		{#if render && (autoRefresh || forceSchemaDisplay) && schemaStripped && Object.keys(schemaStripped?.properties ?? {}).length > 0}
 			<div class="px-2 h-fit min-h-0">
 				<LightweightSchemaForm
 					schema={schemaStripped}
@@ -558,7 +564,7 @@
 				<slot />
 			</div>
 		{/if}
-		{#if !initializing && autoRefresh === true && !hideRefreshButton}
+		{#if render && !initializing && autoRefresh === true && !hideRefreshButton}
 			<div class="flex absolute top-1 right-1 z-50">
 				<RefreshButton {loading} componentId={id} />
 			</div>

frontend/src/lib/components/apps/components/helpers/RunnableWrapper.svelte

@@ -67,6 +67,7 @@
 	export let extraKey: string | undefined = undefined
 	export let refreshOnStart: boolean = false
 	export let errorHandledByComponent: boolean = false
+	export let hasChildrens: boolean = false
 
 	const { staticExporter, noBackend, componentControl, runnableComponents } =
 		getContext<AppViewerContext>('AppViewerContext')
@@ -180,6 +181,7 @@
 	<RunnableComponent
 		{refreshOnStart}
 		{extraKey}
+		{hasChildrens}
 		bind:loading
 		bind:this={runnableComponent}
 		fields={componentInput.fields}
@@ -207,7 +209,7 @@
 		<slot />
 	</RunnableComponent>
 {:else}
-	<NonRunnableComponent {render} bind:result {id} {componentInput}>
+	<NonRunnableComponent {hasChildrens} {render} bind:result {id} {componentInput}>
 		<slot />
 	</NonRunnableComponent>
 {/if}

frontend/src/lib/components/apps/components/layout/AppList.svelte

@@ -114,7 +114,8 @@
 <InitializeComponent {id} />
 
 <RunnableWrapper
-	render={true}
+	hasChildrens
+	{render}
 	{outputs}
 	autoRefresh
 	{componentInput}

frontend/src/lib/components/apps/components/layout/AppStepper.svelte

@@ -114,6 +114,7 @@
 
 <InitializeComponent {id} />
 <RunnableWrapper
+	hasChildrens
 	{recomputeIds}
 	{render}
 	bind:runnableComponent

frontend/src/lib/components/apps/editor/RecomputeAllComponents.svelte

@@ -16,7 +16,7 @@
 	let firstLoad = false
 
 	$: !firstLoad &&
-		$initialized.initializedComponents?.length ==
+		$initialized.initializedComponents?.length >=
 			allItems($app.grid, $app.subgrids).length + $app.hiddenInlineScripts.length &&
 		refresh()
 	$: componentNumber = Object.values($runnableComponents).filter((x) => x.autoRefresh).length
@@ -102,7 +102,6 @@
 <!-- {allItems($app.grid, $app.subgrids)
 	.map((x) => x.id)
 	.filter((x) => !$initialized.initializedComponents?.includes(x))} -->
-
 <div class="flex items-center">
 	<Button
 		disabled={componentNumber == 0}

frontend/src/lib/components/apps/editor/SubGridEditor.svelte

@@ -64,7 +64,7 @@
 <div
 	class="translate-x-0 translate-y-0 relative w-full subgrid {visible
 		? 'visible'
-		: 'invisible h-0 overflow-hidden'} 	"
+		: 'invisible h-0 overflow-hidden'}"
 	bind:this={container}
 	on:pointerdown={onpointerdown}
 >