From fc5981f67d287d1c8305443dc02e35e194915bc9 Mon Sep 17 00:00:00 2001 From: Ramiro Medina <64783088+ramedina86@users.noreply.github.com> Date: Tue, 29 Oct 2024 13:57:14 +0000 Subject: [PATCH 01/26] chore: Dynamic outs refactor --- .../workflows/abstract/WorkflowsNode.vue | 66 ++++++++++++------- src/ui/src/writerTypes.ts | 3 +- src/writer/workflows_blocks/returnvalue.py | 2 +- src/writer/workflows_blocks/writerchat.py | 7 +- 4 files changed, 51 insertions(+), 27 deletions(-) diff --git a/src/ui/src/components/workflows/abstract/WorkflowsNode.vue b/src/ui/src/components/workflows/abstract/WorkflowsNode.vue index d7246e8b4..9926c87a3 100644 --- a/src/ui/src/components/workflows/abstract/WorkflowsNode.vue +++ b/src/ui/src/components/workflows/abstract/WorkflowsNode.vue @@ -9,12 +9,25 @@
+
+

{{ def.fields[fieldKey].name }}

+
+ {{ out.name }} +
+
+
None configured.
+
-
+
{{ out.name }}
import { computed, inject, watch } from "vue"; import injectionKeys from "@/injectionKeys"; +import { Component, FieldType, WriterComponentDefinition } from "@/writerTypes"; const emit = defineEmits(["outMousedown", "engaged"]); const wf = inject(injectionKeys.core); @@ -64,23 +78,39 @@ const isEngaged = computed(() => { return isSelected; }); -const staticOuts = computed(() => { +const staticOuts = computed(() => { const processedOuts = {}; Object.entries(def.value.outs).forEach(([outId, out]) => { - if (outId === "$dynamic") return; + if (out.field) return; processedOuts[outId] = out; }); return processedOuts; }); -const dynamicOuts = computed(() => { +function getDynamicKeysFromField(fieldKey: string) { + const fieldType = def.value.fields[fieldKey].type; + const isToolsField = fieldType == FieldType.Tools; + const keys = Object.keys(fields[fieldKey].value ?? {}); + if (!isToolsField) return keys; + const functionCallKeys = keys.filter( + (k) => fields[fieldKey].value[k]?.type == "function", + ); + return functionCallKeys; +} + +const dynamicOuts = computed< + Record< + keyof WriterComponentDefinition["fields"], + WriterComponentDefinition["outs"] + > +>(() => { const processedOuts = {}; Object.entries(def.value.outs).forEach(([outId, out]) => { - if (outId !== "$dynamic") return; - const dynamicField = out.field; - const dynamicKeys = Object.keys(fields[dynamicField].value ?? {}); + if (!out.field) return; + processedOuts[out.field] = {}; + const dynamicKeys = getDynamicKeysFromField(out.field); dynamicKeys.forEach((key) => { - processedOuts[`${outId}_${key}`] = { + processedOuts[out.field][`${outId}_${key}`] = { name: key, description: "Dynamically created", style: "dynamic", @@ -95,11 +125,6 @@ function handleOutMousedown(ev: DragEvent, outId: string) { emit("outMousedown", outId); } -function handleOutMouseup(ev: DragEvent, outId: string) { - ev.stopPropagation(); - emit("outMouseup", outId); -} - watch(isEngaged, () => { emit("engaged"); }); @@ -116,10 +141,6 @@ watch(isEngaged, () => { user-select: none; } -.WorkflowsNode:not(.selected) { - transition: border-color 0.2s ease-in-out; -} - .WorkflowsNode:hover { border: 2px solid #e4e9ff; } @@ -134,7 +155,6 @@ watch(isEngaged, () => { font-style: normal; font-weight: 500; line-height: 140%; - border-bottom: 1px solid var(--builderSeparatorColor); } .title img { @@ -152,6 +172,8 @@ watch(isEngaged, () => { flex-direction: column; gap: 8px; padding: 12px 0 12px 16px; + border-top: 1px solid var(--builderSeparatorColor); + font-size: 12px; } .output { diff --git a/src/ui/src/writerTypes.ts b/src/ui/src/writerTypes.ts index 8704f659d..bbe92a36f 100644 --- a/src/ui/src/writerTypes.ts +++ b/src/ui/src/writerTypes.ts @@ -102,8 +102,7 @@ export type WriterComponentDefinition = { previewField?: string; // Which field to use for previewing in the Component Tree positionless?: boolean; // Whether this type of component is positionless (like Sidebar) outs?: - | Record<"$", { field: string }> - | Record; + Record; }; export type BuilderManager = ReturnType; diff --git a/src/writer/workflows_blocks/returnvalue.py b/src/writer/workflows_blocks/returnvalue.py index 89a048cc8..9ccf318e2 100644 --- a/src/writer/workflows_blocks/returnvalue.py +++ b/src/writer/workflows_blocks/returnvalue.py @@ -14,7 +14,7 @@ def register(cls, type: str): writer={ "name": "Return value", "description": "Returns a value from a workflow or sub-workflow.", - "category": "Writer", + "category": "Logic", "fields": { "value": { "name": "Value", diff --git a/src/writer/workflows_blocks/writerchat.py b/src/writer/workflows_blocks/writerchat.py index ac30703d7..a4477c594 100644 --- a/src/writer/workflows_blocks/writerchat.py +++ b/src/writer/workflows_blocks/writerchat.py @@ -40,8 +40,11 @@ def register(cls, type: str): } }, "outs": { - "$dynamic": { - "field": "tools" + "tools": { + "name": "Tools", + "field": "tools", + "description": "Run associated tools.", + "style": "dynamic" }, "success": { "name": "Success", From 7b538818427692899cdcfb821c063387502ab075 Mon Sep 17 00:00:00 2001 From: Ramiro Medina <64783088+ramedina86@users.noreply.github.com> Date: Tue, 29 Oct 2024 13:59:22 +0000 Subject: [PATCH 02/26] feat: New builder panels --- src/ui/src/builder/BuilderApp.vue | 21 ++++++++++ src/ui/src/builder/BuilderCodePanel.vue | 18 +++++++++ src/ui/src/builder/BuilderPanel.vue | 53 +++++++++++++++++++++++++ src/ui/src/wds/WdsButton.vue | 26 +++++++++++- 4 files changed, 116 insertions(+), 2 deletions(-) create mode 100644 src/ui/src/builder/BuilderCodePanel.vue create mode 100644 src/ui/src/builder/BuilderPanel.vue diff --git a/src/ui/src/builder/BuilderApp.vue b/src/ui/src/builder/BuilderApp.vue index eab0913c7..346ac3f6b 100644 --- a/src/ui/src/builder/BuilderApp.vue +++ b/src/ui/src/builder/BuilderApp.vue @@ -69,6 +69,10 @@
+
+ + +