diff --git a/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx b/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx
index 1609b80095..4aafe851e6 100644
--- a/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx
+++ b/web/app/components/base/prompt-editor/plugins/component-picker-block/index.tsx
@@ -54,7 +54,6 @@ import { INSERT_ERROR_MESSAGE_BLOCK_COMMAND } from '../error-message-block'
 import { INSERT_LAST_RUN_BLOCK_COMMAND } from '../last-run-block'
 import { INSERT_VARIABLE_VALUE_BLOCK_COMMAND } from '../variable-block'
 import { INSERT_WORKFLOW_VARIABLE_BLOCK_COMMAND } from '../workflow-variable-block'
-import { $createWorkflowVariableBlockNode } from '../workflow-variable-block/node'
 import { useOptions } from './hooks'
 
 type ComponentPickerProps = {
@@ -230,16 +229,14 @@ const ComponentPicker = ({
         needRemove.remove()
 
       const root = $getRoot()
-      const firstChild = root.getFirstChild()
-      if (firstChild) {
-        const selection = firstChild.selectStart()
-        if (selection) {
-          const workflowVariableBlockNode = $createWorkflowVariableBlockNode([agent.id, 'text'], {}, undefined)
-          $insertNodes([workflowVariableBlockNode])
-        }
-      }
+      root.selectStart()
     })
+    editor.dispatchCommand(INSERT_WORKFLOW_VARIABLE_BLOCK_COMMAND, [agent.id, 'context'])
     agentBlock?.onSelect?.(agent)
+    editor.update(() => {
+      const root = $getRoot()
+      root.selectEnd()
+    })
     handleClose()
   }, [editor, getMatchFromSelection, agentBlock, handleClose])
 
@@ -288,10 +285,7 @@ const ComponentPicker = ({
               >
                 <div
                   className="w-full"
-                  onMouseDown={(e) => {
-                    e.preventDefault()
-                    e.stopPropagation()
-                  }}
+                  role="presentation"
                 >
                   <SegmentedControl
                     size="small"
diff --git a/web/app/components/workflow/nodes/tool/components/mixed-variable-text-input/index.tsx b/web/app/components/workflow/nodes/tool/components/mixed-variable-text-input/index.tsx
index 1db7fb67a8..121ec3db0f 100644
--- a/web/app/components/workflow/nodes/tool/components/mixed-variable-text-input/index.tsx
+++ b/web/app/components/workflow/nodes/tool/components/mixed-variable-text-input/index.tsx
@@ -30,10 +30,10 @@ import { generateNewNode, getNodeCustomTypeByNodeDataType, mergeNodeDefaultData
 import { useGetLanguage } from '@/context/i18n'
 import { useStrategyProviders } from '@/service/use-strategy'
 import { cn } from '@/utils/classnames'
+import ContextGenerateModal from '../context-generate-modal'
 import SubGraphModal from '../sub-graph-modal'
 import AgentHeaderBar from './agent-header-bar'
 import Placeholder from './placeholder'
-import ContextGenerateModal from '../context-generate-modal'
 
 /**
  * Matches agent context variable syntax: {{@nodeId.context@}}
@@ -535,8 +535,7 @@ const MixedVariableTextInput = ({
     }
     onChange(newValue, VarKindTypeEnum.mention, mentionConfigWithOutputSelector)
     syncExtractorPromptFromText(newValue)
-    setControlPromptEditorRerenderKey(Date.now())
-  }, [ensureExtractorNode, onChange, paramKey, setControlPromptEditorRerenderKey, syncExtractorPromptFromText, toolNodeId, value])
+  }, [ensureExtractorNode, onChange, paramKey, syncExtractorPromptFromText, toolNodeId, value])
 
   const handleAssembleSelect = useCallback((): ValueSelector | null => {
     if (!toolNodeId || !paramKey || !assemblePlaceholder)