From 6c9daf70021859dcd7cef717bc3acdfa88cffd02 Mon Sep 17 00:00:00 2001
From: Faton Ramadani <faton.ramadani14@gmail.com>
Date: Thu, 19 Jan 2023 11:52:34 +0100
Subject: [PATCH] fix(frontend): fix first row selection (#1125)

* fix(frontend): fix first row selection

* fix(frontend): fix order of conditions
---
 .../apps/components/table/AppTable.svelte      | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/frontend/src/lib/components/apps/components/table/AppTable.svelte b/frontend/src/lib/components/apps/components/table/AppTable.svelte
index 9d6cb6bea8..606962dc41 100644
--- a/frontend/src/lib/components/apps/components/table/AppTable.svelte
+++ b/frontend/src/lib/components/apps/components/table/AppTable.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { getContext } from 'svelte'
+	import { getContext, onMount } from 'svelte'
 	import type { Output } from '../../rx'
 	import type { AppEditorContext, BaseAppComponent, ButtonComponent } from '../../types'
 	import InputValue from '../helpers/InputValue.svelte'
@@ -31,7 +31,7 @@
 
 	$: setSearch(searchValue)
 
-	function setSearch(srch) {
+	function setSearch(srch: string) {
 		outputs?.search?.set(srch)
 	}
 
@@ -46,7 +46,7 @@
 	const { worldStore, staticOutputs: staticOutputsStore } =
 		getContext<AppEditorContext>('AppEditorContext')
 
-	let selectedRowIndex = 0
+	let selectedRowIndex = -1
 
 	function toggleRow(row: Record<string, any>, rowIndex: number) {
 		if (selectedRowIndex !== rowIndex) {
@@ -55,6 +55,18 @@
 		}
 	}
 
+	let mounted = false
+	onMount(() => {
+		mounted = true
+	})
+
+	$: selectedRowIndex === -1 &&
+		Array.isArray(result) &&
+		result.length > 0 &&
+		// We need to wait until the component is mounted so the world is created
+		mounted &&
+		toggleRow({ original: result[0] }, 0)
+
 	function setOptions(filteredResult: Array<Record<string, any>>) {
 		if (!Array.isArray(result)) {
 			return