From 212d04ea2701437b990adc37b7f2c22d1b76842b Mon Sep 17 00:00:00 2001
From: JzoNg <jzongcode@gmail.com>
Date: Mon, 23 Sep 2024 10:25:35 +0800
Subject: [PATCH] form inputs hide handle

---
 .../panel/debug-and-preview/chat-wrapper.tsx       | 14 +++++++++++++-
 .../workflow/panel/debug-and-preview/index.tsx     |  1 +
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx b/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx
index 101125c290..7e4a7a5f9e 100644
--- a/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx
+++ b/web/app/components/workflow/panel/debug-and-preview/chat-wrapper.tsx
@@ -2,6 +2,7 @@ import {
   forwardRef,
   memo,
   useCallback,
+  useEffect,
   useImperativeHandle,
   useMemo,
 } from 'react'
@@ -30,9 +31,15 @@ type ChatWrapperProps = {
   showConversationVariableModal: boolean
   onConversationModalHide: () => void
   showInputsFieldsPanel: boolean
+  onHide: () => void
 }
 
-const ChatWrapper = forwardRef<ChatWrapperRefType, ChatWrapperProps>(({ showConversationVariableModal, onConversationModalHide, showInputsFieldsPanel }, ref) => {
+const ChatWrapper = forwardRef<ChatWrapperRefType, ChatWrapperProps>(({
+  showConversationVariableModal,
+  onConversationModalHide,
+  showInputsFieldsPanel,
+  onHide,
+}, ref) => {
   const nodes = useNodes<StartNodeType>()
   const startNode = nodes.find(node => node.data.type === BlockEnum.Start)
   const startVariables = startNode?.data.variables
@@ -92,6 +99,11 @@ const ChatWrapper = forwardRef<ChatWrapperRefType, ChatWrapperProps>(({ showConv
     }
   }, [handleRestart])
 
+  useEffect(() => {
+    if (isResponding)
+      onHide()
+  }, [isResponding, onHide])
+
   return (
     <>
       <Chat
diff --git a/web/app/components/workflow/panel/debug-and-preview/index.tsx b/web/app/components/workflow/panel/debug-and-preview/index.tsx
index 08db7d8092..d4a3f24d4a 100644
--- a/web/app/components/workflow/panel/debug-and-preview/index.tsx
+++ b/web/app/components/workflow/panel/debug-and-preview/index.tsx
@@ -103,6 +103,7 @@ const DebugAndPreview = () => {
           showConversationVariableModal={showConversationVariableModal}
           onConversationModalHide={() => setShowConversationVariableModal(false)}
           showInputsFieldsPanel={expanded}
+          onHide={() => setExpanded(false)}
         />
       </div>
     </div>