diff --git a/frontend/src/lib/components/DiffEditor.svelte b/frontend/src/lib/components/DiffEditor.svelte
index ce1ffe1545..88431b9552 100644
--- a/frontend/src/lib/components/DiffEditor.svelte
+++ b/frontend/src/lib/components/DiffEditor.svelte
@@ -32,6 +32,10 @@
 	async function loadDiffEditor() {
 		await initializeVscode()
 
+		if (!diffDivEl) {
+			return
+		}
+
 		diffEditor = meditor.createDiffEditor(diffDivEl!, {
 			automaticLayout,
 			renderSideBySide: editorWidth >= SIDE_BY_SIDE_MIN_WIDTH,
diff --git a/frontend/src/lib/components/apps/components/display/table/AppAggridInfiniteTable.svelte b/frontend/src/lib/components/apps/components/display/table/AppAggridInfiniteTable.svelte
index 19c8622a82..3962e00fcc 100644
--- a/frontend/src/lib/components/apps/components/display/table/AppAggridInfiniteTable.svelte
+++ b/frontend/src/lib/components/apps/components/display/table/AppAggridInfiniteTable.svelte
@@ -16,7 +16,7 @@
 	import { initCss } from '$lib/components/apps/utils'
 	import ResolveStyle from '../../helpers/ResolveStyle.svelte'
 	import AppAggridExplorerTable from './AppAggridExplorerTable.svelte'
-	import type { RunnableComponent } from '../..'
+	import { DebouncedInput, type RunnableComponent } from '../..'
 	import { getPrimaryKeys } from '../dbtable/utils'
 	import InitializeComponent from '../../helpers/InitializeComponent.svelte'
 
@@ -25,7 +25,7 @@
 	export let configuration: RichConfigurations
 	export let initializing: boolean | undefined = undefined
 	export let render: boolean
-	export let customCss: ComponentCustomCSS<'aggridcomponent'> | undefined = undefined
+	export let customCss: ComponentCustomCSS<'aggridinfinitecomponent'> | undefined = undefined
 	export let actions: TableAction[] | undefined = undefined
 	let runnableComponent: RunnableComponent | undefined = undefined
 
@@ -55,7 +55,8 @@
 			offset: 0,
 			limit: 10,
 			orderBy: resolvedConfig.columnDefs?.[0]?.field,
-			isDesc: false
+			isDesc: false,
+			search: ''
 		}
 	})
 
@@ -81,7 +82,8 @@
 				offset: params.startRow,
 				limit: params.endRow - params.startRow,
 				orderBy: params.sortModel?.[0]?.colId ?? resolvedConfig.columnDefs?.[0]?.field,
-				isDesc: params.sortModel?.[0]?.sort === 'desc'
+				isDesc: params.sortModel?.[0]?.sort === 'desc',
+				search: resolvedConfig.searchEnabled ? searchValue : ''
 			}
 
 			outputs.params.set(currentParams)
@@ -129,9 +131,21 @@
 			})
 		}
 	}
+
+	let searchValue: string = ''
+
+	function updateSearchInOutputs() {
+		outputs.params.set({
+			...outputs.params.peak(),
+			search: searchValue
+		})
+		aggrid?.clearRows()
+	}
+
+	$: searchValue !== undefined && updateSearchInOutputs()
 </script>
 
-{#each Object.keys(components['aggridcomponent'].initialData.configuration) as key (key)}
+{#each Object.keys(components['aggridinfinitecomponent'].initialData.configuration) as key (key)}
 	<ResolveConfig
 		{id}
 		{key}
@@ -161,17 +175,26 @@
 	bind:loading
 	bind:runnableComponent
 	{render}
-	autoRefresh={false}
+	autoRefresh={true}
 	allowConcurentRequests
 >
-	<AppAggridExplorerTable
-		{id}
-		{datasource}
-		{resolvedConfig}
-		{customCss}
-		{outputs}
-		allowDelete={false}
-		{actions}
-		bind:this={aggrid}
-	/>
+	<div class="flex flex-col h-full">
+		{#if resolvedConfig.searchEnabled}
+			<div class="flex flex-row w-full justify-between items-center h-12">
+				<div class="grow max-w-[300px]">
+					<DebouncedInput placeholder="Search..." bind:value={searchValue} parentClass="h-full " />
+				</div>
+			</div>
+		{/if}
+		<AppAggridExplorerTable
+			{id}
+			{datasource}
+			{resolvedConfig}
+			{customCss}
+			{outputs}
+			allowDelete={false}
+			{actions}
+			bind:this={aggrid}
+		/></div
+	>
 </RunnableWrapper>
diff --git a/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte b/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte
index 79d346ca93..20fa148c97 100644
--- a/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte
+++ b/frontend/src/lib/components/apps/editor/AppEditorHeader.svelte
@@ -187,7 +187,9 @@
 					if (
 						(c.type === 'aggridcomponent' ||
 							c.type === 'aggridcomponentee' ||
-							c.type === 'dbexplorercomponent') &&
+							c.type === 'dbexplorercomponent' ||
+							c.type === 'aggridinfinitecomponent' ||
+							c.type === 'aggridinfinitecomponentee') &&
 						Array.isArray(c.actions)
 					) {
 						r.push(...c.actions.map((x) => ({ input: x.componentInput, id: x.id })))
diff --git a/frontend/src/lib/components/apps/editor/AppInputs.svelte b/frontend/src/lib/components/apps/editor/AppInputs.svelte
index 20b2ab63f8..00514b684e 100644
--- a/frontend/src/lib/components/apps/editor/AppInputs.svelte
+++ b/frontend/src/lib/components/apps/editor/AppInputs.svelte
@@ -29,7 +29,7 @@
 					{/each}
 				</div>
 			</div>
-		{:else if gridItem?.data?.type === 'aggridcomponent' || gridItem?.data?.type === 'aggridcomponentee' || gridItem?.data?.type === 'dbexplorercomponent'}
+		{:else if gridItem?.data?.type === 'aggridcomponent' || gridItem?.data?.type === 'aggridcomponentee' || gridItem?.data?.type === 'dbexplorercomponent' || gridItem?.data?.type === 'aggridinfinitecomponent' || gridItem?.data?.type === 'aggridinfinitecomponentee'}
 			<div>
 				<AppComponentInput bind:component={gridItem.data} {resourceOnly} />
 				<div class="ml-4 mt-4">
diff --git a/frontend/src/lib/components/apps/editor/SettingsPanel.svelte b/frontend/src/lib/components/apps/editor/SettingsPanel.svelte
index 65ce17af42..174e3064ba 100644
--- a/frontend/src/lib/components/apps/editor/SettingsPanel.svelte
+++ b/frontend/src/lib/components/apps/editor/SettingsPanel.svelte
@@ -36,7 +36,9 @@
 				} else if (
 					x?.data?.type === 'aggridcomponent' ||
 					x?.data?.type === 'aggridcomponentee' ||
-					x?.data?.type === 'dbexplorercomponent'
+					x?.data?.type === 'dbexplorercomponent' ||
+					x?.data?.type === 'aggridinfinitecomponent' ||
+					x?.data?.type === 'aggridinfinitecomponentee'
 				) {
 					if (x?.data?.actions) {
 						const tableAction = x.data.actions.find((x) => x.id === id)
@@ -96,7 +98,9 @@
 					if (
 						(parent.data.type === 'aggridcomponent' ||
 							parent.data.type === 'aggridcomponentee' ||
-							parent.data.type === 'dbexplorercomponent') &&
+							parent.data.type === 'dbexplorercomponent' ||
+							parent.data.type === 'aggridinfinitecomponent' ||
+							parent.data.type === 'aggridinfinitecomponentee') &&
 						Array.isArray(parent.data.actions)
 					) {
 						parent.data.actions = parent.data.actions.filter(
diff --git a/frontend/src/lib/components/apps/editor/appUtils.ts b/frontend/src/lib/components/apps/editor/appUtils.ts
index c00ce74b9b..8b36f96996 100644
--- a/frontend/src/lib/components/apps/editor/appUtils.ts
+++ b/frontend/src/lib/components/apps/editor/appUtils.ts
@@ -75,7 +75,9 @@ export function dfs(
 		} else if (
 			(item.data.type == 'aggridcomponent' ||
 				item.data.type == 'aggridcomponentee' ||
-				item.data.type == 'dbexplorercomponent') &&
+				item.data.type == 'dbexplorercomponent' ||
+				item.data.type == 'aggridinfinitecomponent' ||
+				item.data.type == 'aggridinfinitecomponentee') &&
 			item.data.actions?.find((x) => id == x.id)
 		) {
 			return [item.id, id]
@@ -175,7 +177,9 @@ export function allsubIds(app: App, parentId: string): string[] {
 			if (
 				(item.data.type === 'aggridcomponent' ||
 					item.data.type === 'aggridcomponentee' ||
-					item.data.type === 'dbexplorercomponent') &&
+					item.data.type === 'dbexplorercomponent' ||
+					item.data.type === 'aggridinfinitecomponent' ||
+					item.data.type === 'aggridinfinitecomponentee') &&
 				Array.isArray(item.data.actions)
 			) {
 				subIds.push(...item.data.actions?.map((x) => x.id))
@@ -200,7 +204,9 @@ export function getNextGridItemId(app: App): string {
 		} else if (
 			(x.data.type === 'aggridcomponent' ||
 				x.data.type === 'aggridcomponentee' ||
-				x.data.type === 'dbexplorercomponent') &&
+				x.data.type === 'dbexplorercomponent' ||
+				x.data.type === 'aggridinfinitecomponent' ||
+				x.data.type === 'aggridinfinitecomponentee') &&
 			Array.isArray(x.data.actions)
 		) {
 			return [x.id, ...x.data.actions.map((x) => x.id)]
@@ -445,7 +451,9 @@ export function copyComponent(
 			} else if (
 				item.data.type === 'aggridcomponent' ||
 				item.data.type === 'aggridcomponentee' ||
-				item.data.type === 'dbexplorercomponent'
+				item.data.type === 'dbexplorercomponent' ||
+				item.data.type === 'aggridinfinitecomponent' ||
+				item.data.type === 'aggridinfinitecomponentee'
 			) {
 				return {
 					...item.data,
@@ -502,7 +510,9 @@ export function getAllSubgridsAndComponentIds(
 	if (
 		component.type === 'aggridcomponent' ||
 		component.type === 'aggridcomponentee' ||
-		component.type === 'dbexplorercomponent'
+		component.type === 'dbexplorercomponent' ||
+		component.type === 'aggridinfinitecomponent' ||
+		component.type === 'aggridinfinitecomponentee'
 	) {
 		components.push(...(component.actions?.map((x) => x.id) ?? []))
 	}
@@ -537,7 +547,9 @@ export function getAllGridItems(app: App): GridItem[] {
 			} else if (
 				(x?.data?.type === 'aggridcomponent' ||
 					x?.data?.type === 'aggridcomponentee' ||
-					x?.data?.type === 'dbexplorercomponent') &&
+					x?.data?.type === 'dbexplorercomponent' ||
+					x?.data?.type === 'aggridinfinitecomponent' ||
+					x?.data?.type === 'aggridinfinitecomponentee') &&
 				Array.isArray(x?.data?.actions)
 			) {
 				return [x, ...x?.data?.actions?.map((x) => ({ data: x, id: x.id }))]
diff --git a/frontend/src/lib/components/apps/editor/component/components.ts b/frontend/src/lib/components/apps/editor/component/components.ts
index ddf55f3527..3f7b3e5b66 100644
--- a/frontend/src/lib/components/apps/editor/component/components.ts
+++ b/frontend/src/lib/components/apps/editor/component/components.ts
@@ -797,6 +797,12 @@ const aggridinfinitecomponentconst = {
 				value: false,
 				tooltip:
 					'When true, actions will wrap to the next line. Otherwise, the column will grow to fit the actions.'
+			},
+			searchEnabled: {
+				type: 'static',
+				fieldType: 'boolean',
+				value: false,
+				tooltip: 'Enable search in the table'
 			}
 		},
 		componentInput: {
diff --git a/frontend/src/lib/components/apps/editor/component/default-codes.ts b/frontend/src/lib/components/apps/editor/component/default-codes.ts
index 38f7eaa2e0..59e7b3f53b 100644
--- a/frontend/src/lib/components/apps/editor/component/default-codes.ts
+++ b/frontend/src/lib/components/apps/editor/component/default-codes.ts
@@ -124,7 +124,8 @@ return [
 ]`,
 		postgresql: `-- $1 limit
 -- $2 offset
-SELECT * FROM demo LIMIT $1::INT OFFSET $2::INT;
+-- $3 search
+SELECT * FROM demo WHERE id ILIKE '%' || $3 || '%'LIMIT $1::INT OFFSET $2::INT;
 `
 	},
 	aggridinfinitecomponentee: {
@@ -157,7 +158,8 @@ return [
 ]`,
 		postgresql: `-- $1 limit
 -- $2 offset
-SELECT * FROM demo LIMIT $1::INT OFFSET $2::INT;
+-- $3 search
+SELECT * FROM demo WHERE id ILIKE '%' || $3 || '%'LIMIT $1::INT OFFSET $2::INT;
 `
 	},
 	textcomponent: {
diff --git a/frontend/src/lib/components/apps/editor/contextPanel/components/OutputHeader.svelte b/frontend/src/lib/components/apps/editor/contextPanel/components/OutputHeader.svelte
index deddd6373e..df01dfce90 100644
--- a/frontend/src/lib/components/apps/editor/contextPanel/components/OutputHeader.svelte
+++ b/frontend/src/lib/components/apps/editor/contextPanel/components/OutputHeader.svelte
@@ -93,7 +93,9 @@
 		if (
 			item?.data.type == 'aggridcomponent' ||
 			item?.data.type == 'aggridcomponentee' ||
-			item?.data.type == 'dbexplorercomponent'
+			item?.data.type == 'dbexplorercomponent' ||
+			item?.data.type == 'aggridinfinitecomponent' ||
+			item?.data.type == 'aggridinfinitecomponentee'
 		) {
 			for (let c of item.data.actions ?? []) {
 				let old = c.id
@@ -126,7 +128,9 @@
 		if (
 			(data.type == 'aggridcomponent' ||
 				data.type == 'aggridcomponentee' ||
-				data.type == 'dbexplorercomponent') &&
+				data.type == 'dbexplorercomponent' ||
+				data.type == 'aggridinfinitecomponent' ||
+				data.type == 'aggridinfinitecomponentee') &&
 			Array.isArray(data.actions)
 		) {
 			for (let c of data.actions) {
diff --git a/frontend/src/lib/components/apps/editor/contextPanel/components/TableActionsOutput.svelte b/frontend/src/lib/components/apps/editor/contextPanel/components/TableActionsOutput.svelte
index 383ed3861a..979f05e6ed 100644
--- a/frontend/src/lib/components/apps/editor/contextPanel/components/TableActionsOutput.svelte
+++ b/frontend/src/lib/components/apps/editor/contextPanel/components/TableActionsOutput.svelte
@@ -13,7 +13,7 @@
 			{/each}
 		</div>
 	{/if}
-	{#if (gridItem.data.type === 'aggridcomponent' || gridItem.data.type === 'aggridcomponentee' || gridItem.data.type === 'dbexplorercomponent') && gridItem.data.actions?.length > 0}
+	{#if (gridItem.data.type === 'aggridcomponent' || gridItem.data.type === 'aggridcomponentee' || gridItem.data.type === 'dbexplorercomponent' || gridItem.data.type === 'aggridinfinitecomponent' || gridItem.data.type === 'aggridinfinitecomponentee') && gridItem.data.actions?.length > 0}
 		<div class="ml-2 border-l">
 			{#each gridItem.data.actions as action, index}
 				<Output id={action.id} first={index === 0} label="Table action" />
diff --git a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptEditor.svelte b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptEditor.svelte
index eac7b7b94f..eb924d4d6e 100644
--- a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptEditor.svelte
+++ b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptEditor.svelte
@@ -98,6 +98,54 @@
 					fieldType: 'number'
 				}
 			}
+		} else if (
+			componentType === 'aggridinfinitecomponent' ||
+			componentType === 'aggridinfinitecomponentee'
+		) {
+			newFields['offset'] = {
+				type: 'evalv2',
+				expr: `${id}.params.offset`,
+				fieldType: 'number'
+			}
+			newFields['limit'] = {
+				type: 'evalv2',
+				expr: `${id}.params.limit`,
+				fieldType: 'number'
+			}
+			newFields['orderBy'] = {
+				type: 'evalv2',
+				expr: `${id}.params.orderBy`,
+				fieldType: 'string'
+			}
+			newFields['isDesc'] = {
+				type: 'evalv2',
+				expr: `${id}.params.isDesc`,
+				fieldType: 'boolean'
+			}
+			newFields['search'] = {
+				type: 'evalv2',
+				expr: `${id}.params.search`,
+				fieldType: 'string'
+			}
+		}
+	}
+
+	function assertConnections(newFields) {
+		if (
+			componentType === 'aggridinfinitecomponent' ||
+			componentType === 'aggridinfinitecomponentee'
+		) {
+			const fields = ['offset', 'limit', 'orderBy', 'isDesc', 'search']
+
+			fields.forEach((field) => {
+				if (newFields[field]?.type !== 'evalv2') {
+					newFields[field] = {
+						type: 'evalv2',
+						expr: `${id}.params.${field}`,
+						fieldType: newFields[field]?.fieldType ?? 'string'
+					}
+				}
+			})
 		}
 	}
 
@@ -112,6 +160,8 @@
 				preConnect(newFields)
 			}
 
+			assertConnections(newFields)
+
 			if (!deepEqual(newFields, fields)) {
 				fields = newFields
 				$stateId++
diff --git a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptsPanelWithTable.svelte b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptsPanelWithTable.svelte
index e8f9bb1e8b..e3af73f931 100644
--- a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptsPanelWithTable.svelte
+++ b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptsPanelWithTable.svelte
@@ -34,7 +34,7 @@
 	{/each}
 {/if}
 
-{#if (gridItem?.data?.type === 'aggridcomponent' || gridItem?.data?.type === 'aggridcomponentee' || gridItem?.data?.type === 'dbexplorercomponent') && Array.isArray(gridItem.data.actions)}
+{#if (gridItem?.data?.type === 'aggridcomponent' || gridItem?.data?.type === 'aggridcomponentee' || gridItem?.data?.type === 'dbexplorercomponent' || gridItem?.data?.type === 'aggridinfinitecomponent' || gridItem?.data?.type === 'aggridinfinitecomponentee') && Array.isArray(gridItem.data.actions)}
 	{#each gridItem.data.actions as actionButton, index (index)}
 		{#if actionButton?.id === $selectedComponentInEditor || actionButton?.id + '_transformer' === $selectedComponentInEditor}
 			<InlineScriptEditorPanel
diff --git a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/utils.ts b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/utils.ts
index cebc0e5c8e..15b7c44237 100644
--- a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/utils.ts
+++ b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/utils.ts
@@ -69,7 +69,9 @@ function processGridItemRunnable(gridItem: GridItem, list: AppScriptsList): AppS
 		if (
 			component.type === 'aggridcomponent' ||
 			component.type === 'aggridcomponentee' ||
-			component.type === 'dbexplorercomponent'
+			component.type === 'dbexplorercomponent' ||
+			component.type === 'aggridinfinitecomponent' ||
+			component.type === 'aggridinfinitecomponentee'
 		) {
 			component.actions?.forEach((actionButton) => {
 				if (actionButton.componentInput?.type !== 'runnable') {
diff --git a/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte b/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte
index 282c8324c6..dd805aa06a 100644
--- a/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte
+++ b/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte
@@ -320,7 +320,7 @@
 											component.type === 'steppercomponent'}
 										overridenByComponent={component.type === 'aggridinfinitecomponent' ||
 										component.type === 'aggridinfinitecomponentee'
-											? ['offset', 'limit', 'orderBy', 'isDesc']
+											? ['offset', 'limit', 'orderBy', 'isDesc', 'search']
 											: []}
 									/>
 								</div>
@@ -374,6 +374,10 @@
 			/>
 		{:else if componentSettings.item.data.type === 'aggridcomponent'}
 			<TableActions id={component.id} bind:components={componentSettings.item.data.actions} />
+		{:else if componentSettings.item.data.type === 'aggridinfinitecomponent'}
+			<TableActions id={component.id} bind:components={componentSettings.item.data.actions} />
+		{:else if componentSettings.item.data.type === 'aggridinfinitecomponentee'}
+			<TableActions id={component.id} bind:components={componentSettings.item.data.actions} />
 		{:else if componentSettings.item.data.type === 'dbexplorercomponent'}
 			<TableActions id={component.id} bind:components={componentSettings.item.data.actions} />
 		{:else if componentSettings.item.data.type === 'tablecomponent' && Array.isArray(componentSettings.item.data.actionButtons)}
diff --git a/frontend/src/lib/components/apps/editor/settingsPanel/InputsSpecsEditor.svelte b/frontend/src/lib/components/apps/editor/settingsPanel/InputsSpecsEditor.svelte
index 1d927f8996..e2ccd50223 100644
--- a/frontend/src/lib/components/apps/editor/settingsPanel/InputsSpecsEditor.svelte
+++ b/frontend/src/lib/components/apps/editor/settingsPanel/InputsSpecsEditor.svelte
@@ -5,6 +5,7 @@
 
 	import InputsSpecEditor from './InputsSpecEditor.svelte'
 	import OneOfInputSpecsEditor from './OneOfInputSpecsEditor.svelte'
+	import Tooltip from '$lib/components/Tooltip.svelte'
 
 	export let id: string
 	export let inputSpecs: RichConfigurations
@@ -85,7 +86,13 @@
 					<span class="text-xs font-semibold truncate text-primary">
 						{k}
 					</span>
-					<div class="text-tertiary text-xs">Managed by the component</div>
+					<div class="text-tertiary text-xs">
+						Managed by the component
+						<Tooltip light>
+							The input is managed by the component and cannot be edited here: It will be injected
+							by the component itself.
+						</Tooltip>
+					</div>
 				</div>
 			{/each}
 		{/if}
diff --git a/frontend/src/lib/components/apps/utils.ts b/frontend/src/lib/components/apps/utils.ts
index 83b1d85300..ab5dd98ec4 100644
--- a/frontend/src/lib/components/apps/utils.ts
+++ b/frontend/src/lib/components/apps/utils.ts
@@ -294,7 +294,9 @@ export function getAllScriptNames(app: App): string[] {
 		if (
 			gridItem.data.type === 'aggridcomponent' ||
 			gridItem.data.type === 'aggridcomponentee' ||
-			gridItem.data.type === 'dbexplorercomponent'
+			gridItem.data.type === 'dbexplorercomponent' ||
+			gridItem.data.type === 'aggridinfinitecomponent' ||
+			gridItem.data.type === 'aggridinfinitecomponentee'
 		) {
 			gridItem.data.actions?.forEach((actionButton) => {
 				if (actionButton.componentInput?.type === 'runnable') {