File size: 2,470 Bytes
4304c6d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 |
'use client'
import type { FC } from 'react'
import { useTranslation } from 'react-i18next'
import StatusPanel from './status'
import MetaData from './meta'
import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/code-editor'
import { CodeLanguage } from '@/app/components/workflow/nodes/code/types'
type ResultPanelProps = {
inputs?: string
process_data?: string
outputs?: string
status: string
error?: string
elapsed_time?: number
total_tokens?: number
created_at?: number
created_by?: string
finished_at?: number
steps?: number
showSteps?: boolean
}
const ResultPanel: FC<ResultPanelProps> = ({
inputs,
process_data,
outputs,
status,
error,
elapsed_time,
total_tokens,
created_at,
created_by,
steps,
showSteps,
}) => {
const { t } = useTranslation()
return (
<div className='bg-white py-2'>
<div className='px-4 py-2'>
<StatusPanel
status={status}
time={elapsed_time}
tokens={total_tokens}
error={error}
/>
</div>
<div className='px-4 py-2 flex flex-col gap-2'>
<CodeEditor
readOnly
title={<div>{t('workflow.common.input').toLocaleUpperCase()}</div>}
language={CodeLanguage.json}
value={inputs}
isJSONStringifyBeauty
/>
{process_data && (
<CodeEditor
readOnly
title={<div>{t('workflow.common.processData').toLocaleUpperCase()}</div>}
language={CodeLanguage.json}
value={process_data}
isJSONStringifyBeauty
/>
)}
{(outputs || status === 'running') && (
<CodeEditor
readOnly
title={<div>{t('workflow.common.output').toLocaleUpperCase()}</div>}
language={CodeLanguage.json}
value={outputs}
isJSONStringifyBeauty
/>
)}
</div>
<div className='px-4 py-2'>
<div className='h-[0.5px] bg-black opacity-5' />
</div>
<div className='px-4 py-2'>
<MetaData
status={status}
executor={created_by}
startTime={created_at}
time={elapsed_time}
tokens={total_tokens}
steps={steps}
showSteps={showSteps}
/>
</div>
</div>
)
}
export default ResultPanel
|