From db3f38bc2be3c8f2946c94a842f22515730d79b4 Mon Sep 17 00:00:00 2001
From: JzoNg <jzongcode@gmail.com>
Date: Wed, 27 Mar 2024 18:42:07 +0800
Subject: [PATCH] workflow webapp result modification

---
 .../app/text-generate/item/index.tsx          | 30 ++++++++++++++-----
 .../share/text-generation/result/index.tsx    | 23 +++++++-------
 2 files changed, 32 insertions(+), 21 deletions(-)

diff --git a/web/app/components/app/text-generate/item/index.tsx b/web/app/components/app/text-generate/item/index.tsx
index 75e70bca94..50f05b8f2f 100644
--- a/web/app/components/app/text-generate/item/index.tsx
+++ b/web/app/components/app/text-generate/item/index.tsx
@@ -10,6 +10,7 @@ import { useBoolean } from 'ahooks'
 import { HashtagIcon } from '@heroicons/react/24/solid'
 // import PromptLog from '@/app/components/app/chat/log'
 import { Markdown } from '@/app/components/base/markdown'
+import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/code-editor'
 import Loading from '@/app/components/base/loading'
 import Toast from '@/app/components/base/toast'
 import AudioBtn from '@/app/components/base/audio-btn'
@@ -25,6 +26,7 @@ import EditReplyModal from '@/app/components/app/annotation/edit-annotation-moda
 import { useStore as useAppStore } from '@/app/components/app/store'
 import WorkflowProcessItem from '@/app/components/base/chat/chat/answer/workflow-process'
 import type { WorkflowProcess } from '@/app/components/base/chat/types'
+import { CodeLanguage } from '@/app/components/workflow/nodes/code/types'
 
 const MAX_DEPTH = 3
 
@@ -34,7 +36,7 @@ export type IGenerationItemProps = {
   className?: string
   isError: boolean
   onRetry: () => void
-  content: string
+  content: any
   messageId?: string | null
   conversationId?: string
   isLoading?: boolean
@@ -288,12 +290,21 @@ const GenerationItem: FC<IGenerationItemProps> = ({
                 {workflowProcessData && (
                   <WorkflowProcessItem grayBg data={workflowProcessData} expand={workflowProcessData.expand} />
                 )}
-                {isError
-                  ? <div className='text-gray-400 text-sm'>{t('share.generation.batchFailed.outputPlaceholder')}</div>
-                  : (
-                    <Markdown content={content} />
-                  )}
-
+                {isError && (
+                  <div className='text-gray-400 text-sm'>{t('share.generation.batchFailed.outputPlaceholder')}</div>
+                )}
+                {!isError && (typeof content === 'string') && (
+                  <Markdown content={content} />
+                )}
+                {!isError && (typeof content !== 'string') && (
+                  <CodeEditor
+                    readOnly
+                    title={<div/>}
+                    language={CodeLanguage.json}
+                    value={content}
+                    isJSONStringifyBeauty
+                  />
+                )}
               </div>
             </div>
 
@@ -314,7 +325,10 @@ const GenerationItem: FC<IGenerationItemProps> = ({
                   isDisabled={isError || !messageId}
                   className={cn(isMobile && '!px-1.5', 'space-x-1')}
                   onClick={() => {
-                    copy(content)
+                    if (typeof content === 'string')
+                      copy(content)
+                    else
+                      copy(JSON.stringify(content))
                     Toast.notify({ type: 'success', message: t('common.actionMsg.copySuccessfully') })
                   }}>
                   <Clipboard className='w-3.5 h-3.5' />
diff --git a/web/app/components/share/text-generation/result/index.tsx b/web/app/components/share/text-generation/result/index.tsx
index e95755d486..0412d4ec80 100644
--- a/web/app/components/share/text-generation/result/index.tsx
+++ b/web/app/components/share/text-generation/result/index.tsx
@@ -15,7 +15,7 @@ import type { PromptConfig } from '@/models/debug'
 import type { InstalledApp } from '@/models/explore'
 import type { ModerationService } from '@/models/common'
 import { TransferMethod, type VisionFile, type VisionSettings } from '@/types/app'
-import { BlockEnum, NodeRunningStatus, WorkflowRunningStatus } from '@/app/components/workflow/types'
+import { NodeRunningStatus, WorkflowRunningStatus } from '@/app/components/workflow/types'
 import type { WorkflowProcess } from '@/app/components/base/chat/types'
 
 export type IResultProps = {
@@ -71,9 +71,9 @@ const Result: FC<IResultProps> = ({
       setRespondingFalse()
   }, [controlStopResponding])
 
-  const [completionRes, doSetCompletionRes] = useState('')
-  const completionResRef = useRef('')
-  const setCompletionRes = (res: string) => {
+  const [completionRes, doSetCompletionRes] = useState<any>('')
+  const completionResRef = useRef<any>()
+  const setCompletionRes = (res: any) => {
     completionResRef.current = res
     doSetCompletionRes(res)
   }
@@ -191,7 +191,6 @@ const Result: FC<IResultProps> = ({
     }, 1000)
 
     if (isWorkflow) {
-      let outputsExisted = false
       sendWorkflowMessage(
         data,
         {
@@ -224,10 +223,6 @@ const Result: FC<IResultProps> = ({
                 } as any
               }
             }))
-            if (data.node_type === BlockEnum.LLM && data.outputs.text)
-              setCompletionRes(data.outputs.text)
-            if (data.node_type === BlockEnum.End && data.outputs)
-              outputsExisted = true
           },
           onWorkflowFinished: ({ data }) => {
             if (isTimeout)
@@ -239,13 +234,15 @@ const Result: FC<IResultProps> = ({
               clearInterval(runId)
               return
             }
-            if (!outputsExisted) {
-              notify({ type: 'info', message: 'Outputs not existed.' })
-              setCompletionRes('')
-            }
             setWorkflowProccessData(produce(getWorkflowProccessData()!, (draft) => {
               draft.status = data.error ? WorkflowRunningStatus.Failed : WorkflowRunningStatus.Succeeded
             }))
+            if (!data.outputs)
+              setCompletionRes('')
+            else if (Object.keys(data.outputs).length > 1)
+              setCompletionRes(data.outputs)
+            else
+              setCompletionRes(data.outputs[Object.keys(data.outputs)[0]])
             setRespondingFalse()
             setMessageId(tempMessageId)
             onCompleted(getCompletionRes(), taskId, true)