From 4a81818d0550ff8bad7f17a058dbdfaf16a21749 Mon Sep 17 00:00:00 2001 From: Gregory Schier Date: Wed, 9 Oct 2024 11:25:27 -0700 Subject: [PATCH] Add descriptions to template functions --- plugin-runtime-types/src/bindings/events.ts | 7 ++++++- src-tauri/yaak_plugin_runtime/bindings/events.ts | 7 ++++++- src-tauri/yaak_plugin_runtime/src/events.rs | 2 ++ src-web/components/core/Editor/Editor.css | 8 ++------ src-web/components/core/Editor/Editor.tsx | 1 + src-web/components/core/Editor/twig/completion.ts | 8 ++++++-- src-web/components/core/Editor/twig/extension.ts | 1 + 7 files changed, 24 insertions(+), 10 deletions(-) diff --git a/plugin-runtime-types/src/bindings/events.ts b/plugin-runtime-types/src/bindings/events.ts index 709fa813..65a536b0 100644 --- a/plugin-runtime-types/src/bindings/events.ts +++ b/plugin-runtime-types/src/bindings/events.ts @@ -95,7 +95,12 @@ export type SendHttpRequestResponse = { httpResponse: HttpResponse, }; export type ShowToastRequest = { message: string, color?: Color, icon?: Icon, }; -export type TemplateFunction = { name: string, aliases?: Array, args: Array, }; +export type TemplateFunction = { name: string, description?: string, +/** + * Also support alternative names. This is useful for not breaking existing + * tags when changing the `name` property + */ +aliases?: Array, args: Array, }; export type TemplateFunctionArg = { "type": "text" } & TemplateFunctionTextArg | { "type": "select" } & TemplateFunctionSelectArg | { "type": "checkbox" } & TemplateFunctionCheckboxArg | { "type": "http_request" } & TemplateFunctionHttpRequestArg | { "type": "file" } & TemplateFunctionFileArg; diff --git a/src-tauri/yaak_plugin_runtime/bindings/events.ts b/src-tauri/yaak_plugin_runtime/bindings/events.ts index 709fa813..65a536b0 100644 --- a/src-tauri/yaak_plugin_runtime/bindings/events.ts +++ b/src-tauri/yaak_plugin_runtime/bindings/events.ts @@ -95,7 +95,12 @@ export type SendHttpRequestResponse = { httpResponse: HttpResponse, }; export type ShowToastRequest = { message: string, color?: Color, icon?: Icon, }; -export type TemplateFunction = { name: string, aliases?: Array, args: Array, }; +export type TemplateFunction = { name: string, description?: string, +/** + * Also support alternative names. This is useful for not breaking existing + * tags when changing the `name` property + */ +aliases?: Array, args: Array, }; export type TemplateFunctionArg = { "type": "text" } & TemplateFunctionTextArg | { "type": "select" } & TemplateFunctionSelectArg | { "type": "checkbox" } & TemplateFunctionCheckboxArg | { "type": "http_request" } & TemplateFunctionHttpRequestArg | { "type": "file" } & TemplateFunctionFileArg; diff --git a/src-tauri/yaak_plugin_runtime/src/events.rs b/src-tauri/yaak_plugin_runtime/src/events.rs index 551ea6f0..fc1d1478 100644 --- a/src-tauri/yaak_plugin_runtime/src/events.rs +++ b/src-tauri/yaak_plugin_runtime/src/events.rs @@ -294,6 +294,8 @@ pub struct GetTemplateFunctionsResponse { #[ts(export, export_to = "events.ts")] pub struct TemplateFunction { pub name: String, + #[ts(optional)] + pub description: Option, /// Also support alternative names. This is useful for not breaking existing /// tags when changing the `name` property diff --git a/src-web/components/core/Editor/Editor.css b/src-web/components/core/Editor/Editor.css index 87c4a883..f03db9bf 100644 --- a/src-web/components/core/Editor/Editor.css +++ b/src-web/components/core/Editor/Editor.css @@ -285,12 +285,8 @@ } } - &.cm-completionInfo-right { - @apply ml-1 -mt-0.5 font-sans; - } - - &.cm-completionInfo-right-narrow { - @apply ml-1; + &.cm-completionInfo { + @apply mx-0.5 -mt-0.5 font-sans; } * { diff --git a/src-web/components/core/Editor/Editor.tsx b/src-web/components/core/Editor/Editor.tsx index a371a148..af4bc1ca 100644 --- a/src-web/components/core/Editor/Editor.tsx +++ b/src-web/components/core/Editor/Editor.tsx @@ -174,6 +174,7 @@ export const Editor = forwardRef(function E id: 'template-function', size: 'sm', title: 'Configure Function', + description: fn.description || null, render: ({ hide }) => ( void; value: string | null; invalid?: boolean; @@ -63,10 +64,11 @@ export function twigCompletion({ options }: TwigCompletionConfig) { // If not on the last segment, only complete the namespace if (matchSegments.length < optionSegments.length) { + const prefix = optionSegments.slice(0, matchSegments.length).join('.'); return [ { - label: optionSegments.slice(0, matchSegments.length).join('.') + '…', - apply: optionSegments.slice(0, matchSegments.length).join('.'), + label: prefix + '.*', + apply: prefix, type: 'namespace', }, ]; @@ -78,6 +80,8 @@ export function twigCompletion({ options }: TwigCompletionConfig) { { label: o.name, apply: openTag + inner + closeTag, + info: o.description, + detail: o.type, type: o.type === 'variable' ? 'variable' : 'function', }, ]; diff --git a/src-web/components/core/Editor/twig/extension.ts b/src-web/components/core/Editor/twig/extension.ts index 7640749f..7c706f9a 100644 --- a/src-web/components/core/Editor/twig/extension.ts +++ b/src-web/components/core/Editor/twig/extension.ts @@ -52,6 +52,7 @@ export function twig({ name: fn.name, aliases: fn.aliases, type: 'function', + description: fn.description, args: fn.args.map((a) => ({ name: a.name })), value: null, label: `${fn.name}(${shortArgs})`,