feat(workflow-variable-block): add support for environment and conversation variables

Pass environment and conversation variables directly to workflow variable blocks instead of using store. Update variable validation to check full path format.

web/app/components/base/prompt-editor/plugins/workflow-variable-block/component.tsx

@@ -32,13 +32,14 @@ import Tooltip from '@/app/components/base/tooltip'
 import { isExceptionVariable } from '@/app/components/workflow/utils'
 import VarFullPathPanel from '@/app/components/workflow/nodes/_base/components/variable/var-full-path-panel'
 import { Type } from '@/app/components/workflow/nodes/llm/types'
-import type { ValueSelector } from '@/app/components/workflow/types'
-import { useStore } from '@/app/components/workflow/store/workflow'
+import type { ValueSelector, Var } from '@/app/components/workflow/types'
 
 type WorkflowVariableBlockComponentProps = {
   nodeKey: string
   variables: string[]
   workflowNodesMap: WorkflowNodesMap
+  environmentVariables?: Var[]
+  conversationVariables?: Var[]
   getVarType?: (payload: {
     nodeId: string,
     valueSelector: ValueSelector,
@@ -50,6 +51,8 @@ const WorkflowVariableBlockComponent = ({
   variables,
   workflowNodesMap = {},
   getVarType,
+  environmentVariables = [],
+  conversationVariables = [],
 }: WorkflowVariableBlockComponentProps) => {
   const { t } = useTranslation()
   const [editor] = useLexicalComposerContext()
@@ -69,16 +72,17 @@ const WorkflowVariableBlockComponent = ({
   const isChatVar = isConversationVar(variables)
   const isException = isExceptionVariable(varName, node?.type)
 
-  const environmentVariables = useStore(s => s.environmentVariables)
-  const conversationVariables = useStore(s => s.conversationVariables)
-
   let variableValid = true
-  if (isEnv)
-    variableValid = environmentVariables.some(v => v.name === (variables?.[1]))
-   else if (isChatVar)
-    variableValid = conversationVariables.some(v => v.name === variables?.[1])
-   else
-    variableValid = !!node
+  if (isEnv) {
+    console.log('=============环境变量：', environmentVariables, variables)
+    variableValid = environmentVariables.some(v => v.variable === `${variables?.[0] ?? ''}.${variables?.[1] ?? ''}`)
+  }
+  else if (isChatVar) {
+    console.log('=============会话变量：', conversationVariables, variables)
+    variableValid = conversationVariables.some(v => v.variable === `${variables?.[0] ?? ''}.${variables?.[1] ?? ''}`)
+  }
+
+  else { variableValid = !!node }
 
   const reactflow = useReactFlow()
   const store = useStoreApi()

web/app/components/base/prompt-editor/plugins/workflow-variable-block/node.tsx

@@ -3,6 +3,7 @@ import { DecoratorNode } from 'lexical'
 import type { WorkflowVariableBlockType } from '../../types'
 import WorkflowVariableBlockComponent from './component'
 import type { GetVarType } from '../../types'
+import type { Var } from '@/app/components/workflow/types'
 
 export type WorkflowNodesMap = WorkflowVariableBlockType['workflowNodesMap']
 
@@ -10,31 +11,37 @@ export type SerializedNode = SerializedLexicalNode & {
   variables: string[]
   workflowNodesMap: WorkflowNodesMap
   getVarType?: GetVarType
+  environmentVariables?: Var[]
+  conversationVariables?: Var[]
 }
 
 export class WorkflowVariableBlockNode extends DecoratorNode<React.JSX.Element> {
   __variables: string[]
   __workflowNodesMap: WorkflowNodesMap
   __getVarType?: GetVarType
+  __environmentVariables?: Var[]
+  __conversationVariables?: Var[]
 
   static getType(): string {
     return 'workflow-variable-block'
   }
 
   static clone(node: WorkflowVariableBlockNode): WorkflowVariableBlockNode {
-    return new WorkflowVariableBlockNode(node.__variables, node.__workflowNodesMap, node.__getVarType, node.__key)
+    return new WorkflowVariableBlockNode(node.__variables, node.__workflowNodesMap, node.__getVarType, node.__key, node.__environmentVariables, node.__conversationVariables)
   }
 
   isInline(): boolean {
     return true
   }
 
-  constructor(variables: string[], workflowNodesMap: WorkflowNodesMap, getVarType: any, key?: NodeKey) {
+  constructor(variables: string[], workflowNodesMap: WorkflowNodesMap, getVarType: any, key?: NodeKey, environmentVariables?: Var[], conversationVariables?: Var[]) {
     super(key)
 
     this.__variables = variables
     this.__workflowNodesMap = workflowNodesMap
     this.__getVarType = getVarType
+    this.__environmentVariables = environmentVariables
+    this.__conversationVariables = conversationVariables
   }
 
   createDOM(): HTMLElement {
@@ -54,12 +61,14 @@ export class WorkflowVariableBlockNode extends DecoratorNode<React.JSX.Element>
         variables={this.__variables}
         workflowNodesMap={this.__workflowNodesMap}
         getVarType={this.__getVarType!}
+        environmentVariables={this.__environmentVariables}
+        conversationVariables={this.__conversationVariables}
       />
     )
   }
 
   static importJSON(serializedNode: SerializedNode): WorkflowVariableBlockNode {
-    const node = $createWorkflowVariableBlockNode(serializedNode.variables, serializedNode.workflowNodesMap, serializedNode.getVarType)
+    const node = $createWorkflowVariableBlockNode(serializedNode.variables, serializedNode.workflowNodesMap, serializedNode.getVarType, serializedNode.environmentVariables, serializedNode.conversationVariables)
 
     return node
   }
@@ -71,6 +80,8 @@ export class WorkflowVariableBlockNode extends DecoratorNode<React.JSX.Element>
       variables: this.getVariables(),
       workflowNodesMap: this.getWorkflowNodesMap(),
       getVarType: this.getVarType(),
+      environmentVariables: this.getEnvironmentVariables(),
+      conversationVariables: this.getConversationVariables(),
     }
   }
 
@@ -89,12 +100,22 @@ export class WorkflowVariableBlockNode extends DecoratorNode<React.JSX.Element>
     return self.__getVarType
   }
 
+  getEnvironmentVariables(): any {
+    const self = this.getLatest()
+    return self.__environmentVariables
+  }
+
+  getConversationVariables(): any {
+    const self = this.getLatest()
+    return self.__conversationVariables
+  }
+
   getTextContent(): string {
     return `{{#${this.getVariables().join('.')}#}}`
   }
 }
-export function $createWorkflowVariableBlockNode(variables: string[], workflowNodesMap: WorkflowNodesMap, getVarType?: GetVarType): WorkflowVariableBlockNode {
-  return new WorkflowVariableBlockNode(variables, workflowNodesMap, getVarType)
+export function $createWorkflowVariableBlockNode(variables: string[], workflowNodesMap: WorkflowNodesMap, getVarType?: GetVarType, environmentVariables?: Var[], conversationVariables?: Var[]): WorkflowVariableBlockNode {
+  return new WorkflowVariableBlockNode(variables, workflowNodesMap, getVarType, undefined, environmentVariables, conversationVariables)
 }
 
 export function $isWorkflowVariableBlockNode(

web/app/components/base/prompt-editor/plugins/workflow-variable-block/workflow-variable-block-replacement-block.tsx

@@ -18,6 +18,7 @@ const WorkflowVariableBlockReplacementBlock = ({
   workflowNodesMap,
   getVarType,
   onInsert,
+  variables,
 }: WorkflowVariableBlockType) => {
   const [editor] = useLexicalComposerContext()
 
@@ -31,8 +32,8 @@ const WorkflowVariableBlockReplacementBlock = ({
       onInsert()
 
     const nodePathString = textNode.getTextContent().slice(3, -3)
-    return $applyNodeReplacement($createWorkflowVariableBlockNode(nodePathString.split('.'), workflowNodesMap, getVarType))
-  }, [onInsert, workflowNodesMap, getVarType])
+    return $applyNodeReplacement($createWorkflowVariableBlockNode(nodePathString.split('.'), workflowNodesMap, getVarType, variables?.find(o => o.nodeId === 'env')?.vars, variables?.find(o => o.nodeId === 'conversation')?.vars))
+  }, [onInsert, workflowNodesMap, getVarType, variables])
 
   const getMatch = useCallback((text: string) => {
     const matchArr = REGEX.exec(text)