From 9e08f5827b61cf390020e86c1c7e81f4754d768d Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Thu, 5 Feb 2026 16:25:33 +0800
Subject: [PATCH] fix: can editor in disabled skill editor

---
 .../plugins/file-reference-block/component.tsx         | 10 ++++++++--
 .../skill-editor/plugins/tool-block/component.tsx      |  9 ++++++++-
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/web/app/components/workflow/skill/editor/skill-editor/plugins/file-reference-block/component.tsx b/web/app/components/workflow/skill/editor/skill-editor/plugins/file-reference-block/component.tsx
index 61c679e08d..c351de21db 100644
--- a/web/app/components/workflow/skill/editor/skill-editor/plugins/file-reference-block/component.tsx
+++ b/web/app/components/workflow/skill/editor/skill-editor/plugins/file-reference-block/component.tsx
@@ -35,6 +35,7 @@ const FileReferenceBlock = ({ nodeKey, resourceId }: FileReferenceBlockProps) =>
   const [previewStyle, setPreviewStyle] = useState<React.CSSProperties | null>(null)
   const closeTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null)
   const { enabled: isPreviewEnabled } = useFilePreviewContext()
+  const isInteractive = editor.isEditable()
 
   const currentNode = useMemo(() => nodeMap?.get(resourceId), [nodeMap, resourceId])
   const isFolder = currentNode?.node_type === 'folder'
@@ -125,11 +126,16 @@ const FileReferenceBlock = ({ nodeKey, resourceId }: FileReferenceBlockProps) =>
       <PortalToFollowElemTrigger asChild ref={ref}>
         <span
           className={cn(
-            'inline-flex min-w-[18px] cursor-pointer select-none items-center gap-[2px] overflow-hidden rounded-[5px] border border-state-accent-hover-alt bg-state-accent-hover py-[1px] pl-[1px] pr-[4px] shadow-xs',
+            'inline-flex min-w-[18px] select-none items-center gap-[2px] overflow-hidden rounded-[5px] border border-state-accent-hover-alt bg-state-accent-hover py-[1px] pl-[1px] pr-[4px] shadow-xs',
+            isInteractive ? 'cursor-pointer' : 'cursor-default',
             isSelected && 'border-text-accent',
           )}
           title={title}
-          onMouseDown={() => setOpen(prev => !prev)}
+          onMouseDown={() => {
+            if (!isInteractive)
+              return
+            setOpen(prev => !prev)
+          }}
         >
           <span className="flex items-center justify-center p-px">
             {isFolder
diff --git a/web/app/components/workflow/skill/editor/skill-editor/plugins/tool-block/component.tsx b/web/app/components/workflow/skill/editor/skill-editor/plugins/tool-block/component.tsx
index e2991c9cba..6e88dd633e 100644
--- a/web/app/components/workflow/skill/editor/skill-editor/plugins/tool-block/component.tsx
+++ b/web/app/components/workflow/skill/editor/skill-editor/plugins/tool-block/component.tsx
@@ -2,6 +2,7 @@ import type { PluginDetail } from '@/app/components/plugins/types'
 import type { Emoji } from '@/app/components/tools/types'
 import type { ToolValue } from '@/app/components/workflow/block-selector/types'
 import type { ToolWithProvider } from '@/app/components/workflow/types'
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'
 import { RiAlertFill } from '@remixicon/react'
 import * as React from 'react'
 import { useEffect, useMemo, useState } from 'react'
@@ -115,6 +116,7 @@ const ToolBlockComponent = ({
   icon,
   iconDark,
 }: ToolBlockComponentProps) => {
+  const [editor] = useLexicalComposerContext()
   const [ref, isSelected] = useSelectOrDelete(nodeKey, DELETE_TOOL_BLOCK_COMMAND)
   const language = useGetLanguage()
   const { t } = useTranslation()
@@ -185,6 +187,8 @@ const ToolBlockComponent = ({
     return metadata?.tools?.[configId]
   }, [activeTabId, configId, fileMetadata, isUsingExternalMetadata, toolBlockContext?.metadata])
 
+  const isInteractive = editor.isEditable()
+
   const defaultToolValue = useMemo(() => {
     if (!currentProvider || !currentTool)
       return null
@@ -515,13 +519,16 @@ const ToolBlockComponent = ({
       <span
         ref={ref}
         className={cn(
-          'inline-flex cursor-pointer items-center gap-[2px] rounded-[5px] border py-px pl-px pr-[3px] shadow-xs',
+          'inline-flex items-center gap-[2px] rounded-[5px] border py-px pl-px pr-[3px] shadow-xs',
+          isInteractive ? 'cursor-pointer' : 'cursor-default',
           needAuthorization ? 'border-state-warning-active bg-state-warning-hover' : 'border-state-accent-hover-alt bg-state-accent-hover',
           isSelected && 'border-text-accent',
         )}
         title={`${provider}.${tool}`}
         data-tool-config-id={configId}
         onMouseDown={() => {
+          if (!isInteractive)
+            return
           if (!currentProvider || !currentTool)
             return
           if (configuredToolValue)