From f3d0bb3814865ad715e9fe024d7e9f921425af09 Mon Sep 17 00:00:00 2001
From: Faton Ramadani <faton.ramadani14@gmail.com>
Date: Mon, 22 Apr 2024 15:50:36 +0200
Subject: [PATCH] fix(frontend): Fix the table selection + improve the
 ComponentInputTypeEditor (#3585)

---
 .../apps/components/display/table/AppTable.svelte   |  2 +-
 .../settingsPanel/ComponentInputTypeEditor.svelte   | 13 ++++++++-----
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/frontend/src/lib/components/apps/components/display/table/AppTable.svelte b/frontend/src/lib/components/apps/components/display/table/AppTable.svelte
index 845a73f0fd..157e678e66 100644
--- a/frontend/src/lib/components/apps/components/display/table/AppTable.svelte
+++ b/frontend/src/lib/components/apps/components/display/table/AppTable.svelte
@@ -445,7 +445,7 @@
 								{@const isLastRow = index === filteredResult.length - 1}
 								{@const rowIndex = row.original['__index']}
 								<tr
-									class={classNames(
+									class={twMerge(
 										isLastRow ? '!border-b-0' : '',
 										'divide-x w-full',
 										index % 2 === 0 ? 'bg-gray-50/50' : '',
diff --git a/frontend/src/lib/components/apps/editor/settingsPanel/ComponentInputTypeEditor.svelte b/frontend/src/lib/components/apps/editor/settingsPanel/ComponentInputTypeEditor.svelte
index 59f9230afe..aa3cf2c4f2 100644
--- a/frontend/src/lib/components/apps/editor/settingsPanel/ComponentInputTypeEditor.svelte
+++ b/frontend/src/lib/components/apps/editor/settingsPanel/ComponentInputTypeEditor.svelte
@@ -29,13 +29,16 @@
 			...componentInput,
 			type: 'evalv2',
 			expr: expr,
-			connections: [{ componentId: connection.componentId, id: connection.path.split('.')[0].split('[')[0]  }]
+			connections: [
+				{ componentId: connection.componentId, id: connection.path.split('.')[0].split('[')[0] }
+			]
 		}
 		evalV2editor?.setCode(expr)
 		$app = $app
 	}
 
 	let clientWidth: number
+	const iconOnlyThreshold = 300
 </script>
 
 {#if componentInput.fieldType !== 'any'}
@@ -71,7 +74,7 @@
 						label="Static"
 						value="static"
 						disabled={disableStatic}
-						iconOnly={clientWidth < 250}
+						iconOnly={clientWidth < iconOnlyThreshold}
 						icon={Pen}
 					/>
 				{/if}
@@ -79,21 +82,21 @@
 					<ToggleButton
 						value="connected"
 						icon={Plug2}
-						iconOnly={clientWidth < 250}
+						iconOnly={clientWidth < iconOnlyThreshold}
 						label="Connect"
 					/>
 				{/if}
 				<ToggleButton
 					value="evalv2"
 					icon={FunctionSquare}
-					iconOnly={clientWidth < 250}
+					iconOnly={clientWidth < iconOnlyThreshold}
 					label="Eval"
 				/>
 
 				<ToggleButton
 					value="runnable"
 					icon={Code}
-					iconOnly={clientWidth < 250}
+					iconOnly={clientWidth < iconOnlyThreshold}
 					label="Compute"
 					id="data-source-compute"
 				/>