From 0eb482f35b4066921a0e0d455ed70a0bac7441e5 Mon Sep 17 00:00:00 2001
From: StyleZhang <jasonapring2015@outlook.com>
Date: Mon, 11 Mar 2024 21:05:54 +0800
Subject: [PATCH] chat workflow run

---
 .../workflow/panel/debug-and-preview/chat-wrapper.tsx |  2 +-
 .../workflow/panel/debug-and-preview/index.tsx        | 11 +++++++++--
 web/app/components/workflow/panel/index.tsx           |  2 +-
 3 files changed, 11 insertions(+), 4 deletions(-)

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 c7462e1094..628ca10135 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
@@ -33,7 +33,7 @@ const ChatWrapper = () => {
       isResponding={isResponding}
       chatContainerclassName='px-4'
       chatContainerInnerClassName='pt-6'
-      chatFooterClassName='px-4'
+      chatFooterClassName='px-4 rounded-bl-2xl'
       chatFooterInnerClassName='pb-4'
       onSend={doSend}
       onStopResponding={handleStop}
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 3ca359f011..85185d8e8e 100644
--- a/web/app/components/workflow/panel/debug-and-preview/index.tsx
+++ b/web/app/components/workflow/panel/debug-and-preview/index.tsx
@@ -1,14 +1,21 @@
 import type { FC } from 'react'
 import { useTranslation } from 'react-i18next'
+import { useStore } from '../../store'
 import ChatWrapper from './chat-wrapper'
 
 const DebugAndPreview: FC = () => {
   const { t } = useTranslation()
+  const showRunHistory = useStore(s => s.showRunHistory)
 
   return (
     <div
-      className='flex flex-col w-[400px] h-full rounded-l-2xl border border-black/[0.02] shadow-xl'
-      style={{ background: 'linear-gradient(156deg, rgba(242, 244, 247, 0.80) 0%, rgba(242, 244, 247, 0.00) 99.43%), var(--white, #FFF)' }}
+      className={`
+        flex flex-col h-full border border-black/[0.02] shadow-xl
+        ${showRunHistory ? 'w-[320px] rounded-2xl' : 'w-[400px] rounded-l-2xl'}
+      `}
+      style={{
+        background: showRunHistory ? 'white' : 'linear-gradient(156deg, rgba(242, 244, 247, 0.80) 0%, rgba(242, 244, 247, 0.00) 99.43%), var(--white, #FFF)',
+      }}
     >
       <div className='shrink-0 flex items-center justify-between px-4 pt-3 pb-2 font-semibold text-gray-900'>
         {t('workflow.common.debugAndPreview').toLocaleUpperCase()}
diff --git a/web/app/components/workflow/panel/index.tsx b/web/app/components/workflow/panel/index.tsx
index 3bc9a93105..f5d508e6d5 100644
--- a/web/app/components/workflow/panel/index.tsx
+++ b/web/app/components/workflow/panel/index.tsx
@@ -38,7 +38,7 @@ const Panel: FC = () => {
     <div
       className={`
         absolute top-14 right-0 bottom-2 flex pr-2 z-10
-        ${showRunHistory && '!pr-0'}
+        ${(showRunHistory || showDebugAndPreviewPanel) && '!pr-0'}
       `}
     >
       {