From d260e6b0648c8eed12563d4729f84aff38309e94 Mon Sep 17 00:00:00 2001
From: StyleZhang <jasonapring2015@outlook.com>
Date: Tue, 2 Apr 2024 19:55:39 +0800
Subject: [PATCH] fix: prompt-editor

---
 web/app/components/base/prompt-editor/index.tsx     |  8 +-------
 .../prompt-editor/plugins/code-highlight-block.tsx  | 13 -------------
 .../plugins/component-picker-block/index.tsx        |  7 ++++---
 3 files changed, 5 insertions(+), 23 deletions(-)
 delete mode 100644 web/app/components/base/prompt-editor/plugins/code-highlight-block.tsx

diff --git a/web/app/components/base/prompt-editor/index.tsx b/web/app/components/base/prompt-editor/index.tsx
index f75be52e06..9e076060c6 100644
--- a/web/app/components/base/prompt-editor/index.tsx
+++ b/web/app/components/base/prompt-editor/index.tsx
@@ -9,10 +9,7 @@ import {
   $getRoot,
   TextNode,
 } from 'lexical'
-import {
-  CodeHighlightNode,
-  CodeNode,
-} from '@lexical/code'
+import { CodeNode } from '@lexical/code'
 import { LexicalComposer } from '@lexical/react/LexicalComposer'
 import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin'
 import { ContentEditable } from '@lexical/react/LexicalContentEditable'
@@ -47,7 +44,6 @@ import { VariableValueBlockNode } from './plugins/variable-value-block/node'
 import { CustomTextNode } from './plugins/custom-text/node'
 import OnBlurBlock from './plugins/on-blur-or-focus-block'
 import UpdateBlock from './plugins/update-block'
-import CodeHighlightBlock from './plugins/code-highlight-block'
 import { textToEditorState } from './utils'
 import type {
   ContextBlockType,
@@ -107,7 +103,6 @@ const PromptEditor: FC<PromptEditorProps> = ({
     namespace: 'prompt-editor',
     nodes: [
       CodeNode,
-      CodeHighlightNode,
       CustomTextNode,
       {
         replace: TextNode,
@@ -214,7 +209,6 @@ const PromptEditor: FC<PromptEditorProps> = ({
         <OnChangePlugin onChange={handleEditorChange} />
         <OnBlurBlock onBlur={onBlur} onFocus={onFocus} />
         <UpdateBlock instanceId={instanceId} />
-        <CodeHighlightBlock />
         {/* <TreeView /> */}
       </div>
     </LexicalComposer>
diff --git a/web/app/components/base/prompt-editor/plugins/code-highlight-block.tsx b/web/app/components/base/prompt-editor/plugins/code-highlight-block.tsx
deleted file mode 100644
index 2c584e70c3..0000000000
--- a/web/app/components/base/prompt-editor/plugins/code-highlight-block.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { useEffect } from 'react'
-import { registerCodeHighlighting } from '@lexical/code'
-import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'
-
-export default function CodeHighlightPlugin() {
-  const [editor] = useLexicalComposerContext()
-
-  useEffect(() => {
-    return registerCodeHighlighting(editor)
-  }, [editor])
-
-  return null
-}
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 3deeaa79ad..4a285a95b7 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
@@ -125,7 +125,7 @@ const ComponentPicker = ({
     anchorElementRef,
     { selectedIndex, selectOptionAndCleanUp, setHighlightedIndex },
   ) => {
-    if (anchorElementRef.current && (allOptions.length || workflowVariableOptions.length)) {
+    if (anchorElementRef.current && (allOptions.length || workflowVariableBlock?.show)) {
       return (
         <>
           {
@@ -224,7 +224,7 @@ const ComponentPicker = ({
                     )
                   }
                   {
-                    !!workflowVariableOptions.length && (
+                    workflowVariableBlock?.show && (
                       <>
                         {
                           (!!promptOptions.length || !!variableOptions.length || !!externalToolOptions.length) && (
@@ -257,8 +257,9 @@ const ComponentPicker = ({
     promptOptions,
     variableOptions,
     externalToolOptions,
-    workflowVariableOptions,
     queryString,
+    workflowVariableBlock?.show,
+    workflowVariableOptions,
     handleSelectWorkflowVariable,
     elements,
     floatingStyles,