windmill-components 1.655.1 → 1.665.0

package/package/components/apps/components/display/dbtable/metadata.js

@@ -3,15 +3,33 @@ import { runScriptAndPollResult } from '../../../../jobs/utils';
 import { getLanguageByResourceType, resourceTypeToLang, legacyScripts, scriptsV2 } from './utils';
 import {} from '../../../../../gen';
 import { stringifyGraphqlSchema, stringifySchema } from '../../../../copilot/lib';
-import { getDatabaseArg } from '../../../../dbOps';
+import { getDatabaseArg, getDbType } from '../../../../dbOps';
 import { sendUserToast } from '../../../../../toast';
+function makeMetadataMarker(op, payload, ducklake) {
+    if (ducklake)
+        payload.ducklake = ducklake;
+    return `-- WM_INTERNAL_DB_${op} ${JSON.stringify(payload)}`;
+}
 export async function loadTableMetaData(input, workspace, table) {
     if (!input || !table || !workspace)
         return undefined;
-    let { language, query } = await makeLoadTableMetaDataQuery(input, workspace, table);
+    const dbType = getDbType(input);
+    const language = getLanguageByResourceType(dbType);
+    const ducklake = input.type === 'ducklake' ? input.ducklake : undefined;
+    const dbArg = getDatabaseArg(input);
+    // MySQL needs the database name for metadata queries
+    let databaseName;
+    if (input.type === 'database' && input.resourceType === 'mysql') {
+        const resourceObj = (await ResourceService.getResourceValue({
+            workspace,
+            path: input.resourcePath
+        }));
+        databaseName = resourceObj?.database;
+    }
+    const content = makeMetadataMarker('LOAD_TABLE_METADATA', { table, databaseName }, ducklake);
     const job = await JobService.runScriptPreview({
-        workspace: workspace,
-        requestBody: { language, content: query, args: getDatabaseArg(input) }
+        workspace,
+        requestBody: { language, content, args: dbArg }
     });
     const maxRetries = 8;
     let attempts = 0;
@@ -19,7 +37,7 @@ export async function loadTableMetaData(input, workspace, table) {
         try {
             await new Promise((resolve) => setTimeout(resolve, 1000 * (attempts || 0.6)));
             const testResult = (await JobService.getCompletedJob({
-                workspace: workspace,
+                workspace,
                 id: job
             }));
             if (testResult.success) {
@@ -49,10 +67,23 @@ export async function loadAllTablesMetaData(workspace, input) {
     if (!input || !workspace)
         return undefined;
     try {
-        let { language, query } = await makeLoadTableMetaDataQuery(input, workspace, undefined);
+        const dbType = getDbType(input);
+        const dbArg = getDatabaseArg(input);
+        const ducklake = input.type === 'ducklake' ? input.ducklake : undefined;
+        // MySQL needs the database name for metadata queries
+        let databaseName;
+        if (input.type === 'database' && input.resourceType === 'mysql') {
+            const resourceObj = (await ResourceService.getResourceValue({
+                workspace,
+                path: input.resourcePath
+            }));
+            databaseName = resourceObj?.database;
+        }
+        const language = getLanguageByResourceType(dbType);
+        const content = makeMetadataMarker('LOAD_TABLE_METADATA', { table: undefined, databaseName }, ducklake);
         let result = (await runScriptAndPollResult({
-            workspace: workspace,
-            requestBody: { language, content: query, args: getDatabaseArg(input) }
+            workspace,
+            requestBody: { language, content, args: dbArg }
         }));
         const map = {};
         for (const _col of result) {
@@ -69,219 +100,6 @@ export async function loadAllTablesMetaData(workspace, input) {
         throw e;
     }
 }
-async function makeLoadTableMetaDataQuery(input, workspace, table) {
-    if (input.type === 'ducklake') {
-        const query = `ATTACH 'ducklake://${input.ducklake}' AS __ducklake__;
-		SELECT
-			COLUMN_NAME as field,
-			DATA_TYPE as DataType,
-			COLUMN_DEFAULT as DefaultValue,
-			false as IsPrimaryKey,
-			false as IsIdentity,
-			IS_NULLABLE as IsNullable,
-			false as IsEnum,
-			TABLE_NAME as table_name
-		FROM information_schema.columns c
-		WHERE table_catalog = '__ducklake__' AND table_schema = current_schema()`;
-        return { query, language: 'duckdb' };
-    }
-    else if (input.resourceType === 'mysql') {
-        const resourceObj = (await ResourceService.getResourceValue({
-            workspace,
-            path: input.resourcePath
-        }));
-        const query = `
-	SELECT 
-			COLUMN_NAME as field,
-			COLUMN_TYPE as DataType,
-			COLUMN_DEFAULT as DefaultValue,
-			CASE WHEN COLUMN_KEY = 'PRI' THEN 1 ELSE 0 END as IsPrimaryKey,
-			CASE WHEN EXTRA like '%auto_increment%' THEN 'YES' ELSE 'NO' END as IsIdentity,
-			CASE WHEN IS_NULLABLE = 'YES' THEN 'YES' ELSE 'NO' END as IsNullable,
-			CASE WHEN DATA_TYPE = 'enum' THEN true ELSE false END as IsEnum${table
-            ? ''
-            : `,
-			TABLE_NAME as table_name`}
-	FROM 
-			INFORMATION_SCHEMA.COLUMNS${table
-            ? `
-	WHERE
-			TABLE_NAME = '${table.split('.').reverse()[0]}' AND TABLE_SCHEMA = '${table.split('.').reverse()[1] ?? resourceObj?.database ?? ''}'`
-            : `
-	WHERE
-			TABLE_SCHEMA NOT IN ('mysql', 'performance_schema', 'information_schema', 'sys')`}
-	ORDER BY
-			TABLE_NAME,
-			ORDINAL_POSITION;
-	`;
-        return { query, language: 'mysql' };
-    }
-    else if (input.resourceType === 'postgresql') {
-        const query = `
-	SELECT 
-		a.attname as field,
-		pg_catalog.format_type(a.atttypid, a.atttypmod) as DataType,
-		(SELECT substring(pg_catalog.pg_get_expr(d.adbin, d.adrelid, true) for 128)
-		 FROM pg_catalog.pg_attrdef d
-		 WHERE d.adrelid = a.attrelid AND d.adnum = a.attnum AND a.atthasdef) as DefaultValue,
-		(SELECT CASE WHEN i.indisprimary THEN true ELSE 'NO' END
-		 FROM pg_catalog.pg_class tbl, pg_catalog.pg_class idx, pg_catalog.pg_index i, pg_catalog.pg_attribute att
-		 WHERE tbl.oid = a.attrelid AND idx.oid = i.indexrelid AND att.attrelid = tbl.oid
-								 AND i.indrelid = tbl.oid AND att.attnum = any(i.indkey) AND att.attname = a.attname LIMIT 1) as IsPrimaryKey,
-		CASE a.attidentity
-				WHEN 'd' THEN 'By Default'
-				WHEN 'a' THEN 'Always'
-				ELSE 'No'
-		END as IsIdentity,
-		CASE a.attnotnull
-				WHEN false THEN 'YES'
-				ELSE 'NO'
-		END as IsNullable,
-		(SELECT true
-		 FROM pg_catalog.pg_enum e
-		 WHERE e.enumtypid = a.atttypid FETCH FIRST ROW ONLY) as IsEnum${table
-            ? ''
-            : `,
-    ns.nspname AS schema_name,
-    c.relname AS table_name`}
-	FROM pg_catalog.pg_attribute a${table
-            ? `
-	WHERE a.attrelid = (SELECT c.oid FROM pg_catalog.pg_class c JOIN pg_catalog.pg_namespace ns ON c.relnamespace = ns.oid WHERE relname = '${table.split('.').reverse()[0]}' AND ns.nspname = '${table.split('.').reverse()[1] ?? 'public'}')
-		AND a.attnum > 0 AND NOT a.attisdropped
-		`
-            : `
-	JOIN pg_catalog.pg_class c ON a.attrelid = c.oid
-	JOIN pg_catalog.pg_namespace ns ON c.relnamespace = ns.oid
-	WHERE c.relkind = 'r' AND a.attnum > 0 AND NOT a.attisdropped
-		AND ns.nspname != 'pg_catalog' AND ns.nspname != 'information_schema'`}
-	ORDER BY ${table ? 'a.attnum' : 'ns.nspname, c.relname, a.attnum'};
-	
-	`;
-        return { query, language: 'postgresql' };
-    }
-    else if (input.resourceType === 'ms_sql_server') {
-        const query = `
-		SELECT
-    c.COLUMN_NAME as field,
-    c.DATA_TYPE as DataType,
-    c.COLUMN_DEFAULT as DefaultValue,
-    CASE WHEN COLUMNPROPERTY(OBJECT_ID(c.TABLE_SCHEMA + '.' + c.TABLE_NAME), c.COLUMN_NAME, 'IsIdentity') = 1 THEN 'By Default' ELSE 'No' END as IsIdentity,
-    CASE WHEN pk.COLUMN_NAME IS NOT NULL THEN 1 ELSE 0 END as IsPrimaryKey,
-    CASE WHEN c.IS_NULLABLE = 'YES' THEN 'YES' ELSE 'NO' END as IsNullable,
-    CASE WHEN c.DATA_TYPE = 'enum' THEN 1 ELSE 0 END as IsEnum,
-    dc.name as default_constraint_name${table
-            ? ''
-            : `,
-		c.TABLE_NAME as table_name`}
-FROM
-    INFORMATION_SCHEMA.COLUMNS c
-    LEFT JOIN (
-        SELECT
-            ku.TABLE_SCHEMA,
-            ku.TABLE_NAME,
-            ku.COLUMN_NAME
-        FROM
-            INFORMATION_SCHEMA.TABLE_CONSTRAINTS tc
-            INNER JOIN INFORMATION_SCHEMA.KEY_COLUMN_USAGE ku
-                ON tc.CONSTRAINT_TYPE = 'PRIMARY KEY'
-                AND tc.CONSTRAINT_NAME = ku.CONSTRAINT_NAME
-                AND tc.TABLE_SCHEMA = ku.TABLE_SCHEMA
-                AND tc.TABLE_NAME = ku.TABLE_NAME
-    ) pk ON c.TABLE_SCHEMA = pk.TABLE_SCHEMA
-        AND c.TABLE_NAME = pk.TABLE_NAME
-        AND c.COLUMN_NAME = pk.COLUMN_NAME
-    LEFT JOIN sys.default_constraints dc
-        ON dc.parent_object_id = OBJECT_ID(c.TABLE_SCHEMA + '.' + c.TABLE_NAME)
-        AND dc.parent_column_id = COLUMNPROPERTY(OBJECT_ID(c.TABLE_SCHEMA + '.' + c.TABLE_NAME), c.COLUMN_NAME, 'ColumnId')${table
-            ? `
-WHERE
-    c.TABLE_NAME = '${table}'`
-            : ''}
-ORDER BY
-    c.ORDINAL_POSITION;
-	`;
-        return { query, language: 'mssql' };
-    }
-    else if (input.resourceType === 'snowflake' ||
-        input.resourceType === 'snowflake_oauth') {
-        const query = `
-		select COLUMN_NAME as field,
-		DATA_TYPE as DataType,
-		COLUMN_DEFAULT as DefaultValue,
-		CASE WHEN COLUMN_DEFAULT like 'AUTOINCREMENT%' THEN 'By Default' ELSE 'No' END as IsIdentity,
-		0 as IsPrimaryKey, -- a one-query solution is not trivial, we will use SHOW PRIMARY KEYS separately
-		CASE WHEN IS_NULLABLE = 'YES' THEN 'YES' ELSE 'NO' END as IsNullable,
-		CASE WHEN DATA_TYPE = 'enum' THEN 1 ELSE 0 END as IsEnum${table
-            ? ''
-            : `,
-		table_name as table_name,
-		table_schema as schema_name`}
-	from information_schema.columns${table
-            ? `
-	where table_name = '${table.split('.').reverse()[0]}' and table_schema = '${table.split('.').reverse()[1] ?? 'PUBLIC'}'`
-            : "\nwhere table_schema <> 'INFORMATION_SCHEMA'\n"}
-	order by ORDINAL_POSITION;
-	`;
-        return { query, language: 'snowflake' };
-    }
-    else if (input.resourceType === 'bigquery') {
-        if (table) {
-            const query = `SELECT 
-    c.COLUMN_NAME as field,
-    DATA_TYPE as DataType,
-    CASE WHEN COLUMN_DEFAULT = 'NULL' THEN '' ELSE COLUMN_DEFAULT END as DefaultValue,
-    CASE WHEN constraint_name is not null THEN true ELSE false END as IsPrimaryKey,
-    'No' as IsIdentity,
-    IS_NULLABLE as IsNullable,
-    false as IsEnum
-FROM
-    ${table.split('.')[0]}.INFORMATION_SCHEMA.COLUMNS c
-    LEFT JOIN
-    ${table.split('.')[0]}.INFORMATION_SCHEMA.KEY_COLUMN_USAGE p
-    on c.table_name = p.table_name AND c.column_name = p.COLUMN_NAME
-WHERE   
-    c.TABLE_NAME = '${table.split('.')[1]}'
-order by c.ORDINAL_POSITION;`;
-            return { query, language: 'bigquery' };
-        }
-        else {
-            const query = `import { BigQuery } from '@google-cloud/bigquery@7.5.0';
-export async function main(database: bigquery) {
-const bq = new BigQuery({
-	credentials: database
-})
-const [datasets] = await bq.getDatasets();
-if (!datasets) return {}
-const schema = {} as any
-let queries = datasets.map(dataset => \`
-	(SELECT 
-    c.COLUMN_NAME as field,
-		'\${dataset.id}' as schema_name,
-		c.TABLE_NAME as table_name,
-    DATA_TYPE as DataType,
-    CASE WHEN COLUMN_DEFAULT = 'NULL' THEN '' ELSE COLUMN_DEFAULT END as DefaultValue,
-    CASE WHEN constraint_name is not null THEN true ELSE false END as IsPrimaryKey,
-    'No' as IsIdentity,
-    IS_NULLABLE as IsNullable,
-    false as IsEnum
-FROM
-    \\\`\${dataset.id}\\\`.INFORMATION_SCHEMA.COLUMNS c
-    LEFT JOIN
-    \\\`\${dataset.id}\\\`.INFORMATION_SCHEMA.KEY_COLUMN_USAGE p
-    on c.table_name = p.table_name AND c.column_name = p.COLUMN_NAME
-ORDER BY c.ORDINAL_POSITION)\`
-)
-let query = queries.join('\\nUNION ALL \\n')
-const [rows] = await bq.query(query)
-return rows
-}`;
-            return { query, language: 'bun' };
-        }
-    }
-    else {
-        throw new Error('Unsupported database type:' + input.resourceType);
-    }
-}
 // We can't get primary keys in a single query for Snowflake, so we fetch them separately
 async function fetchAndAddSnowflakePrimaryKeysInMap(map, input, workspace, tableKey) {
     if (input.type == 'database' &&
@@ -304,12 +122,16 @@ async function fetchAndAddSnowflakePrimaryKeysInMap(map, input, workspace, table
     }
 }
 async function fetchSnowflakePrimaryKeys(workspace, dbArg, tableKey) {
+    const payload = {};
+    if (tableKey)
+        payload.table = tableKey;
+    const content = makeMetadataMarker('SNOWFLAKE_PRIMARY_KEYS', payload, undefined);
     return (await JobService.runScriptPreviewAndWaitResult({
         workspace,
         requestBody: {
             language: 'snowflake',
             args: dbArg,
-            content: tableKey ? `SHOW PRIMARY KEYS IN TABLE ${tableKey}` : 'SHOW PRIMARY KEYS IN ACCOUNT'
+            content
         }
     }));
 }

package/package/components/apps/components/display/dbtable/queries/count.d.ts

@@ -1,3 +1,12 @@
+/**
+ * LEGACY: These query builders generate full SQL on the frontend.
+ * They exist only for backwards compatibility with Database Studio (dbexplorercomponent) apps
+ * whose policies were generated with expanded SQL digests.
+ *
+ * New code (Database Manager) should use WM_INTERNAL_DB markers instead,
+ * which are expanded server-side by the Rust query_builders module.
+ * See: dbOps.ts → dbTableOpsWithPreviewScripts()
+ */
 import type { AppInput } from '../../../../inputType';
 import type { DbType, DbInput } from '../../../../../dbTypes';
 import { type ColumnDef } from '../utils';

package/package/components/apps/components/display/dbtable/queries/delete.d.ts

@@ -1,3 +1,12 @@
+/**
+ * LEGACY: These query builders generate full SQL on the frontend.
+ * They exist only for backwards compatibility with Database Studio (dbexplorercomponent) apps
+ * whose policies were generated with expanded SQL digests.
+ *
+ * New code (Database Manager) should use WM_INTERNAL_DB markers instead,
+ * which are expanded server-side by the Rust query_builders module.
+ * See: dbOps.ts → dbTableOpsWithPreviewScripts()
+ */
 import type { AppInput } from '../../../../inputType';
 import type { DbType, DbInput } from '../../../../../dbTypes';
 import { type ColumnDef } from '../utils';

package/package/components/apps/components/display/dbtable/queries/insert.d.ts

@@ -1,3 +1,12 @@
+/**
+ * LEGACY: These query builders generate full SQL on the frontend.
+ * They exist only for backwards compatibility with Database Studio (dbexplorercomponent) apps
+ * whose policies were generated with expanded SQL digests.
+ *
+ * New code (Database Manager) should use WM_INTERNAL_DB markers instead,
+ * which are expanded server-side by the Rust query_builders module.
+ * See: dbOps.ts → dbTableOpsWithPreviewScripts()
+ */
 import type { AppInput } from '../../../../inputType';
 import type { DbType, DbInput } from '../../../../../dbTypes';
 import { type ColumnDef } from '../utils';

package/package/components/apps/components/display/dbtable/queries/relationalKeys.d.ts

@@ -39,6 +39,13 @@ export declare function makePrimaryKeyConstraintQuery(dbType: DbType, table: str
  * Groups by constraint name and aggregates columns
  */
 export declare function transformForeignKeys(rawResults: RawForeignKey[]): TableEditorForeignKey[];
+/**
+ * Transforms Snowflake SHOW IMPORTED KEYS result to RawForeignKey format
+ * Snowflake returns columns: fk_database_name, fk_schema_name, fk_table_name, fk_column_name,
+ * pk_database_name, pk_schema_name, pk_table_name, pk_column_name, key_sequence,
+ * update_rule, delete_rule, fk_name, pk_name, deferrability
+ */
+export declare function transformSnowflakeForeignKeys(snowflakeResults: any[]): RawForeignKey[];
 export declare function fetchTableRelationalKeys(input: DbInput, dbType: DbType, table: string, schema: string | undefined, workspace: string, dbArg: Record<string, any>, language: ScriptLang): Promise<{
     foreignKeys: TableEditorForeignKey[];
     pk_constraint_name?: string;

package/package/components/apps/components/display/dbtable/queries/relationalKeys.js

@@ -228,7 +228,7 @@ function makeSnowflakeForeignKeysQuery(tableName, schemaName) {
  * pk_database_name, pk_schema_name, pk_table_name, pk_column_name, key_sequence,
  * update_rule, delete_rule, fk_name, pk_name, deferrability
  */
-function transformSnowflakeForeignKeys(snowflakeResults) {
+export function transformSnowflakeForeignKeys(snowflakeResults) {
     if (!snowflakeResults || !Array.isArray(snowflakeResults)) {
         return [];
     }

package/package/components/apps/components/display/dbtable/queries/select.d.ts

@@ -1,3 +1,12 @@
+/**
+ * LEGACY: These query builders generate full SQL on the frontend.
+ * They exist only for backwards compatibility with Database Studio (dbexplorercomponent) apps
+ * whose policies were generated with expanded SQL digests.
+ *
+ * New code (Database Manager) should use WM_INTERNAL_DB markers instead,
+ * which are expanded server-side by the Rust query_builders module.
+ * See: dbOps.ts → dbTableOpsWithPreviewScripts()
+ */
 import type { AppInput } from '../../../../inputType';
 import type { DbType, DbInput } from '../../../../../dbTypes';
 import { type ColumnDef } from '../utils';

package/package/components/apps/components/display/dbtable/queries/update.d.ts

@@ -1,3 +1,12 @@
+/**
+ * LEGACY: These query builders generate full SQL on the frontend.
+ * They exist only for backwards compatibility with Database Studio (dbexplorercomponent) apps
+ * whose policies were generated with expanded SQL digests.
+ *
+ * New code (Database Manager) should use WM_INTERNAL_DB markers instead,
+ * which are expanded server-side by the Rust query_builders module.
+ * See: dbOps.ts → dbTableOpsWithPreviewScripts()
+ */
 import type { AppInput } from '../../../../inputType';
 import type { DbInput, DbType } from '../../../../../dbTypes';
 import { type ColumnDef } from '../utils';

package/package/components/apps/editor/AppEditorHeaderDeploy.svelte

@@ -18,6 +18,7 @@ let { policy, setPublishState, appPath, customPath = $bindable(), onLatest, save
 let isDeployer = $derived($userStore?.groups?.includes(WM_DEPLOYERS_GROUP) ?? false);
 let canPreserve = $derived(!!$userStore?.is_admin || !!$userStore?.is_super_admin || isDeployer);
 let savedOnBehalfOfEmail = $derived(savedApp?.policy?.on_behalf_of_email);
+let savedOnBehalfOf = $derived(savedApp?.policy?.on_behalf_of);
 let onBehalfOfChoice = $state(undefined);
 let customOnBehalfOfEmail = $state('');
 let dirtyCustomPath = $state(false);
@@ -148,12 +149,13 @@ $effect(() => {
 	</Tooltip>
 	{#if canPreserve}
 		<div class="mt-4">
-			Because you are either an admin or part of the {WM_DEPLOYERS_GROUP} group, you can select another user to run this app on behalf of. Once deployed the app will be run on behalf of
+			Because you are either an admin or part of the {WM_DEPLOYERS_GROUP} group, you can select another
+			user to run this app on behalf of. Once deployed the app will be run on behalf of
 			<OnBehalfOfSelector
 				targetWorkspace={$workspaceStore ?? ''}
-				targetEmail={savedOnBehalfOfEmail}
+				targetValue={savedOnBehalfOfEmail}
 				selected={onBehalfOfChoice}
-				onSelect={(choice, email, username) => {
+				onSelect={(choice, details) => {
 					onBehalfOfChoice = choice
 					if (choice === 'me') {
 						policy.on_behalf_of_email = $userStore?.email
@@ -162,25 +164,25 @@ $effect(() => {
 						preserveOnBehalfOf = false
 					} else if (choice === 'target') {
 						policy.on_behalf_of_email = savedOnBehalfOfEmail
+						policy.on_behalf_of = savedOnBehalfOf
 						customOnBehalfOfEmail = ''
 						preserveOnBehalfOf = true
-					} else if (choice === 'custom' && email) {
-						policy.on_behalf_of_email = email
-						policy.on_behalf_of = username ? `u/${username}` : undefined
-						customOnBehalfOfEmail = email
+					} else if (choice === 'custom' && details) {
+						policy.on_behalf_of_email = details.email
+						policy.on_behalf_of = details.permissionedAs
+						customOnBehalfOfEmail = details.email
 						preserveOnBehalfOf = true
 					}
 				}}
 				kind="app"
 				{canPreserve}
-				customEmail={customOnBehalfOfEmail}
+				customValue={customOnBehalfOfEmail}
 				isDeployment={false}
 			/>
 		</div>
 	{/if}
 </Alert>
 
-
 <div class="mt-10"></div>
 
 {#if !hideSecretUrl}

package/package/components/apps/editor/appUtilsS3.js

@@ -103,8 +103,8 @@ export function computeS3FileViewerPolicy(config) {
     }
     else if (config.source.type === 'static' &&
         typeof config.source.value === 'string' &&
-        ((config.sourceKind.type === 'static' &&
-            config.sourceKind.value === 's3 (workspace storage)') ||
+        ((config.sourceKind?.type === 'static' &&
+            config.sourceKind?.value === 's3 (workspace storage)') ||
             config.source.value.startsWith('s3://'))) {
         return {
             s3_path: config.source.value.replace('s3://', ''),

package/package/components/apps/editor/inlineScriptsPanel/InlineScriptsPanel.svelte

@@ -34,12 +34,55 @@ function deleteBackgroundScript(index) {
         $runnableComponents = $runnableComponents;
     }
 }
-// let gridItem = $derived(
-// 	$selectedComponentInEditor && !$selectedComponentInEditor.startsWith(BG_PREFIX)
-// 		// ? findGridItem($app, $selectedComponentInEditor?.split('_')?.[0])
-// 		: undefined
-// )
-let [prefixOrId, id] = $derived($selectedComponentInEditor?.split('_') ?? []);
+let prefixOrId = $derived.by(() => {
+    const sel = $selectedComponentInEditor;
+    if (!sel)
+        return undefined;
+    if (sel.startsWith(BG_PREFIX))
+        return 'bg';
+    return sel.endsWith('_transformer') ? sel.slice(0, -'_transformer'.length) : sel;
+});
+let id = $derived.by(() => {
+    const sel = $selectedComponentInEditor;
+    if (!sel || !sel.startsWith(BG_PREFIX))
+        return undefined;
+    const rest = sel.slice(BG_PREFIX.length);
+    return rest.endsWith('_transformer') ? rest.slice(0, -'_transformer'.length) : rest;
+});
+function containsAction(gridItem, actionId) {
+    if (!gridItem?.data)
+        return false;
+    const data = gridItem.data;
+    if (data.type === 'tablecomponent') {
+        return data.actionButtons?.some((a) => a.id === actionId) ?? false;
+    }
+    if (data.type === 'aggridcomponent' ||
+        data.type === 'aggridcomponentee' ||
+        data.type === 'dbexplorercomponent' ||
+        data.type === 'aggridinfinitecomponent' ||
+        data.type === 'aggridinfinitecomponentee') {
+        return data.actions?.some((a) => a.id === actionId) ?? false;
+    }
+    if (data.type === 'menucomponent') {
+        return data.menuItems?.some((a) => a.id === actionId) ?? false;
+    }
+    return false;
+}
+// Resolve which grid item ID to render — computed once per selection change
+let matchedGridItemId = $derived.by(() => {
+    if (!prefixOrId || prefixOrId === 'bg' || prefixOrId.startsWith('unused-'))
+        return undefined;
+    const allItems = [
+        ...($app?.grid ?? []),
+        ...Object.values($app?.subgrids ?? {}).flat()
+    ];
+    // Fast path: direct ID match (most common)
+    if (allItems.some((item) => item?.id === prefixOrId))
+        return prefixOrId;
+    // Slow path: check nested actions
+    const parent = allItems.find((item) => containsAction(item, prefixOrId));
+    return parent?.id;
+});
 let { width = undefined } = $props();
 </script>
 
@@ -55,9 +98,9 @@ let { width = undefined } = $props();
 			<div class="text-sm text-secondary text-center py-8 px-2">
 				Select a runnable on the left panel
 			</div>
-		{:else if prefixOrId != 'bg' && !prefixOrId.startsWith('unused-')}
+		{:else if prefixOrId != 'bg' && !prefixOrId?.startsWith('unused-')}
 			{#each $app.grid as gridItem, index (gridItem?.id)}
-				{#if gridItem?.id == prefixOrId}
+				{#if gridItem?.id == matchedGridItemId}
 					<InlineScriptsPanelWithTable
 						on:createScriptFromInlineScript={(e) => {
 							createScriptFromInlineScript(
@@ -73,7 +116,7 @@ let { width = undefined } = $props();
 			{/each}
 			{#each Object.keys($app.subgrids ?? {}) as subgrid (subgrid)}
 				{#each $app.subgrids?.[subgrid] ?? [] as subgridItem, index (subgridItem?.id)}
-					{#if subgridItem?.id == prefixOrId && $app.subgrids?.[subgrid]}
+					{#if subgridItem?.id == matchedGridItemId && $app.subgrids?.[subgrid]}
 						<InlineScriptsPanelWithTable
 							on:createScriptFromInlineScript={(e) => {
 								createScriptFromInlineScript(
@@ -88,7 +131,7 @@ let { width = undefined } = $props();
 					{/if}
 				{/each}
 			{/each}
-		{:else if prefixOrId != 'bg' && prefixOrId.startsWith('unused-')}
+		{:else if prefixOrId != 'bg' && prefixOrId?.startsWith('unused-')}
 			{#each $app.unusedInlineScripts as unusedInlineScript, index}
 				{#if `unused-${index}` == prefixOrId}
 					<InlineScriptEditor

package/package/components/common/clearableInput/ClearableInput.svelte

@@ -4,7 +4,7 @@ import { createEventDispatcher } from 'svelte';
 import { fade } from 'svelte/transition';
 import { X } from 'lucide-svelte';
 import { createDispatcherIfMounted } from '../../../createDispatcherIfMounted';
-let { value = $bindable(''), placeholder = '', type = 'text', inputClass = '', wrapperClass = '', buttonClass = '', children, ...rest } = $props();
+let { value = $bindable(), placeholder = '', type = 'text', inputClass = '', wrapperClass = '', buttonClass = '', children, ...rest } = $props();
 const dispatch = createEventDispatcher();
 const dispatchIfMounted = createDispatcherIfMounted(dispatch);
 let isHovered = $state(false);
@@ -18,10 +18,6 @@ function handleInput(e) {
 function clear() {
     value = '';
 }
-run(() => {
-    if (value === undefined)
-        value = '';
-});
 </script>
 
 <!-- svelte-ignore a11y_no_static_element_interactions -->
@@ -32,7 +28,7 @@ run(() => {
 >
 	{#if type === 'textarea'}
 		<textarea
-			{value}
+			value={value ?? ''}
 			{placeholder}
 			rows="1"
 			class="resize-y {inputClass}"
@@ -45,7 +41,7 @@ run(() => {
 	{:else}
 		<input
 			{type}
-			{value}
+			value={value ?? ''}
 			{placeholder}
 			class=" {(value ? '!pr-[26px] ' : '') + inputClass}"
 			{...rest}

package/package/components/common/confirmationModal/ConfirmationModal.svelte

@@ -4,7 +4,7 @@ import { fade } from 'svelte/transition';
 import Button from '../button/Button.svelte';
 import { AlertTriangle, CornerDownLeft, Loader2, RefreshCcw } from 'lucide-svelte';
 import { twMerge } from 'tailwind-merge';
-const { title, confirmationText, keyListen = true, loading = false, open = false, type: _type, showIcon = true, id, children, onConfirmed, onCanceled } = $props();
+const { title, confirmationText, keyListen = true, loading = false, open = false, type: _type, showIcon = true, id, trashbin = false, children, onConfirmed, onCanceled } = $props();
 const type = $derived(_type ?? 'danger');
 const dispatch = createEventDispatcher();
 function onKeyDown(event) {
@@ -88,6 +88,12 @@ const Icon = $derived(theme[type].Icon ?? AlertTriangle);
 							<div class="mt-2 text-sm text-secondary">
 								{@render children?.()}
 							</div>
+							{#if trashbin}
+								<p class="mt-3 text-xs text-tertiary"
+									>This item will be moved to the trashbin and can be restored by a workspace admin
+									within 3 days.</p
+								>
+							{/if}
 						</div>
 					</div>
 					<div class="flex items-center space-x-2 flex-row-reverse space-x-reverse mt-4">

package/package/components/common/confirmationModal/ConfirmationModal.svelte.d.ts

@@ -8,6 +8,7 @@ type Props = {
     type?: 'danger' | 'reload';
     showIcon?: boolean;
     id?: string;
+    trashbin?: boolean;
     children?: Snippet;
     onConfirmed?: () => void | Promise<void>;
     onCanceled?: () => void;