88 lines
2.3 KiB
Svelte
88 lines
2.3 KiB
Svelte
<script lang="ts">
|
|
import type { Schema } from '$lib/common'
|
|
import FlowScriptPicker from '$lib/components/flows/pickers/FlowScriptPicker.svelte'
|
|
import { Script, type Preview } from '$lib/gen'
|
|
import { inferArgs } from '$lib/infer'
|
|
import { initialCode } from '$lib/script_helpers'
|
|
import { capitalize, emptySchema } from '$lib/utils'
|
|
import { createEventDispatcher, getContext } from 'svelte'
|
|
import { fly } from 'svelte/transition'
|
|
import type { AppEditorContext } from '../../types'
|
|
import { defaultCode } from '../Component.svelte'
|
|
|
|
export let name: string
|
|
export let id: string
|
|
|
|
const { appPath, app } = getContext<AppEditorContext>('AppEditorContext')
|
|
const dispatch = createEventDispatcher()
|
|
|
|
async function inferInlineScriptSchema(
|
|
language: Preview.language,
|
|
content: string,
|
|
schema: Schema
|
|
): Promise<Schema> {
|
|
try {
|
|
await inferArgs(language, content, schema)
|
|
} catch (e) {
|
|
console.error("Couldn't infer args", e)
|
|
}
|
|
|
|
return schema
|
|
}
|
|
|
|
async function createInlineScriptByLanguage(
|
|
language: Preview.language,
|
|
path: string,
|
|
subkind: 'pgsql' | 'mysql' | undefined = undefined
|
|
) {
|
|
const componentType = $app.grid.find((c) => c.data.id === id)?.data?.type
|
|
|
|
const fullPath = `${appPath}/inline-script/${path}`
|
|
const content =
|
|
defaultCode(componentType, language) ??
|
|
initialCode(language, Script.kind.SCRIPT, subkind ?? 'flow')
|
|
|
|
let schema: Schema = emptySchema()
|
|
|
|
schema = await inferInlineScriptSchema(language, content, schema)
|
|
const newInlineScript = {
|
|
content,
|
|
language,
|
|
path: fullPath,
|
|
schema
|
|
}
|
|
dispatch('new', newInlineScript)
|
|
}
|
|
const langs = ['deno', 'python3', 'go', 'bash'] as Script.language[]
|
|
</script>
|
|
|
|
<div class="flex flex-col px-4 py-2 gap-2 text-sm" in:fly={{ duration: 50 }}>
|
|
Please choose a language:
|
|
<div class="flex gap-2 flex-row flex-wrap">
|
|
{#each langs as lang}
|
|
<FlowScriptPicker
|
|
label={capitalize(lang)}
|
|
{lang}
|
|
on:click={() => {
|
|
createInlineScriptByLanguage(lang, name)
|
|
}}
|
|
/>
|
|
{/each}
|
|
|
|
<FlowScriptPicker
|
|
label={`PostgreSQL`}
|
|
lang="pgsql"
|
|
on:click={() => {
|
|
createInlineScriptByLanguage(Script.language.DENO, name, 'pgsql')
|
|
}}
|
|
/>
|
|
<FlowScriptPicker
|
|
label={`MySQL`}
|
|
lang="mysql"
|
|
on:click={() => {
|
|
createInlineScriptByLanguage(Script.language.DENO, name, 'mysql')
|
|
}}
|
|
/>
|
|
</div>
|
|
</div>
|