add names to background runnables

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

@@ -138,7 +138,11 @@
 		Object.keys(inputs ?? {}).forEach((key: string) => {
 			const input = inputs[key]
 
-			if (['static', 'eval', 'connected'].includes(input.type) && schemaStripped !== undefined) {
+			if (
+				['static', 'eval', 'connected'].includes(input.type) &&
+				schemaStripped !== undefined &&
+				schemaStripped.properties
+			) {
 				delete schemaStripped.properties[key]
 			}
 		})

frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptEditor.svelte

@@ -10,7 +10,6 @@
 	import Badge from '$lib/components/common/badge/Badge.svelte'
 	import Editor from '$lib/components/Editor.svelte'
 	import { emptySchema, getModifierKey, scriptLangToEditorLang } from '$lib/utils'
-	import Popover from '../../../Popover.svelte'
 	import { computeFields } from './utils'
 	import { deepEqual } from 'fast-equals'
 	import type { AppInput } from '../../inputType'
@@ -145,18 +144,16 @@
 					<Badge color="red" baseClass="!text-2xs">Invalid</Badge>
 				{/if}
 
-				<Popover notClickable placement="bottom">
-					<Button
-						size="xs"
-						color="light"
-						btnClasses="!px-2 !bg-red-100 hover:!bg-red-200"
-						aria-label="Delete"
-						on:click={() => dispatch('delete')}
-					>
-						<Trash2 size={14} class="text-red-800" />
-					</Button>
-					<svelte:fragment slot="text">Delete</svelte:fragment>
-				</Popover>
+				<Button
+					title="Delete"
+					size="xs"
+					color="light"
+					btnClasses="!px-2 !bg-red-100 hover:!bg-red-200"
+					aria-label="Delete"
+					on:click={() => dispatch('delete')}
+				>
+					<Trash2 size={14} class="text-red-800" />
+				</Button>
 				{#if inlineScript.language != 'frontend'}
 					<Button
 						size="xs"

frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptRunnableByPath.svelte

@@ -48,7 +48,7 @@
 	}
 
 	async function refreshFlow(x: RunnableByPath) {
-		const schema = (await loadSchema($workspaceStore ?? '', x.path, 'flow')) ?? emptySchema()
+		const { schema } = (await loadSchema($workspaceStore ?? '', x.path, 'flow')) ?? emptySchema()
 		if (!deepEqual(x.schema, schema)) {
 			x.schema = schema
 			fields = computeFields(schema, false, fields)
@@ -158,6 +158,12 @@
 				Fork
 			</Button>
 		{/if}
+		<input
+			on:keydown|stopPropagation
+			bind:value={runnable.name}
+			placeholder="Background runnable name"
+			class="!text-xs !rounded-xs"
+		/>
 	</div>
 	<div class="w-full">
 		{#key $stateId}

frontend/src/lib/components/apps/editor/settingsPanel/mainInput/RunnableSelector.svelte

@@ -11,7 +11,7 @@
 	import { createEventDispatcher, getContext } from 'svelte'
 	import type { Schema } from '$lib/common'
 	import { getAllScriptNames, loadSchema, schemaToInputsSpec } from '$lib/components/apps/utils'
-	import { emptySchema } from '$lib/utils'
+	import { defaultIfEmptyString, emptySchema } from '$lib/utils'
 
 	type Tab = 'hubscripts' | 'workspacescripts' | 'workspaceflows' | 'inlinescripts'
 
@@ -34,18 +34,19 @@
 	async function loadSchemaFromTriggerable(
 		path: string,
 		runType: 'script' | 'flow' | 'hubscript'
-	): Promise<Schema> {
+	): Promise<{ schema: Schema; summary: string | undefined }> {
 		return loadSchema(workspace, path, runType) ?? emptySchema()
 	}
 
 	async function pickScript(path: string) {
 		const schema = await loadSchemaFromTriggerable(path, 'script')
-		const fields = schemaToInputsSpec(schema, defaultUserInput)
+		const fields = schemaToInputsSpec(schema.schema, defaultUserInput)
 		const runnable = {
 			type: 'runnableByPath',
 			path,
 			runType: 'script',
-			schema
+			schema,
+			name: defaultIfEmptyString(schema.summary, path)
 		} as const
 
 		dispatch('pick', {
@@ -56,12 +57,13 @@
 
 	async function pickFlow(path: string) {
 		const schema = await loadSchemaFromTriggerable(path, 'flow')
-		const fields = schemaToInputsSpec(schema, defaultUserInput)
+		const fields = schemaToInputsSpec(schema.schema, defaultUserInput)
 		const runnable = {
 			type: 'runnableByPath',
 			path,
 			runType: 'flow',
-			schema
+			schema,
+			name: defaultIfEmptyString(schema.summary, path)
 		} as const
 		dispatch('pick', {
 			runnable,
@@ -71,12 +73,13 @@
 
 	async function pickHubScript(path: string) {
 		const schema = await loadSchemaFromTriggerable(path, 'hubscript')
-		const fields = schemaToInputsSpec(schema, defaultUserInput)
+		const fields = schemaToInputsSpec(schema.schema, defaultUserInput)
 		const runnable = {
 			type: 'runnableByPath',
 			path,
 			runType: 'hubscript',
-			schema
+			schema,
+			name: defaultIfEmptyString(schema.summary, path)
 		} as const
 		dispatch('pick', {
 			runnable,

frontend/src/lib/components/apps/inputType.ts

@@ -69,6 +69,7 @@ export type TemplateInput = {
 }
 
 export type RunnableByPath = {
+	name: string
 	path: string
 	schema: any
 	runType: 'script' | 'flow' | 'hubscript'

frontend/src/lib/components/apps/utils.ts

@@ -41,21 +41,21 @@ export async function loadSchema(
 	workspace: string,
 	path: string,
 	runType: 'script' | 'flow' | 'hubscript'
-): Promise<Schema> {
+): Promise<{ schema: Schema; summary: string | undefined }> {
 	if (runType === 'script') {
 		const script = await ScriptService.getScriptByPath({
 			workspace,
 			path
 		})
 
-		return script.schema
+		return { schema: script.schema, summary: script.summary }
 	} else if (runType === 'flow') {
 		const flow = await FlowService.getFlowByPath({
 			workspace,
 			path
 		})
 
-		return flow.schema
+		return { schema: flow.schema, summary: flow.summary }
 	} else {
 		const script = await ScriptService.getHubScriptByPath({
 			path
@@ -69,7 +69,7 @@ export async function loadSchema(
 		}
 
 		await inferArgs(script.language, script.content, script.schema)
-		return script.schema
+		return { schema: script.schema, summary: script.summary }
 	}
 }