mirror of
https://git.mirrors.martin98.com/https://github.com/langgenius/dify.git
synced 2025-08-05 01:30:41 +08:00
trigger interaction
This commit is contained in:
parent
0ff890d3a0
commit
1e2ee40b2a
@ -1,58 +1,86 @@
|
||||
import type { FC } from 'react'
|
||||
import { useMemo } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { RiLoader2Line, RiStopCircleFill } from '@remixicon/react'
|
||||
import Tooltip from '@/app/components/base/tooltip'
|
||||
import { useStore } from '../store'
|
||||
import useCurrentVars from '../hooks/use-current-vars'
|
||||
import { WorkflowRunningStatus } from '@/app/components/workflow/types'
|
||||
import { NodeRunningStatus } from '@/app/components/workflow/types'
|
||||
import cn from '@/utils/classnames'
|
||||
|
||||
const VariableInspectTrigger: FC = () => {
|
||||
const { t } = useTranslation()
|
||||
|
||||
const showVariableInspectPanel = useStore(s => s.showVariableInspectPanel)
|
||||
const setShowVariableInspectPanel = useStore(s => s.setShowVariableInspectPanel)
|
||||
|
||||
const workflowRunningData = useStore(s => s.workflowRunningData)
|
||||
const isRunning = useMemo(() => {
|
||||
if (!workflowRunningData)
|
||||
return false
|
||||
if (workflowRunningData.result.status === WorkflowRunningStatus.Running)
|
||||
return true
|
||||
return (workflowRunningData.tracing || []).some(tracingData => tracingData.status === NodeRunningStatus.Running)
|
||||
}, [workflowRunningData])
|
||||
|
||||
const {
|
||||
currentVars,
|
||||
clearCurrentVars,
|
||||
} = useCurrentVars()
|
||||
|
||||
// ##TODD stop handle
|
||||
|
||||
if (showVariableInspectPanel)
|
||||
return null
|
||||
|
||||
return (
|
||||
<div className={cn('flex items-center gap-1')}>
|
||||
{/* view button */}
|
||||
<div
|
||||
className='system-2xs-semibold-uppercase flex h-5 cursor-pointer items-center gap-1 rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-2 text-text-tertiary shadow-lg backdrop-blur-sm hover:bg-background-default-hover'
|
||||
onClick={() => setShowVariableInspectPanel(true)}
|
||||
>
|
||||
Variable inspect
|
||||
</div>
|
||||
{/* caching button */}
|
||||
<div
|
||||
className='system-xs-medium flex h-6 cursor-pointer items-center gap-1 rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-2 text-text-accent shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent'
|
||||
onClick={() => setShowVariableInspectPanel(true)}
|
||||
>
|
||||
<RiLoader2Line className='h-4 w-4' />
|
||||
<span className='text-text-accent'>Caching running status</span>
|
||||
</div>
|
||||
{/* stop button */}
|
||||
<Tooltip
|
||||
popupContent={'Stop run'}
|
||||
>
|
||||
{!isRunning && !currentVars.length && (
|
||||
<div
|
||||
className='flex h-6 cursor-pointer items-center rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-1 shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent'
|
||||
// onClick={() => {}}
|
||||
className='system-2xs-semibold-uppercase flex h-5 cursor-pointer items-center gap-1 rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-2 text-text-tertiary shadow-lg backdrop-blur-sm hover:bg-background-default-hover'
|
||||
onClick={() => setShowVariableInspectPanel(true)}
|
||||
>
|
||||
<RiStopCircleFill className='h-4 w-4 text-text-accent' />
|
||||
{t('workflow.debug.variableInspect.trigger.normal')}
|
||||
</div>
|
||||
</Tooltip>
|
||||
{/* finish button */}
|
||||
<div
|
||||
className='system-xs-medium flex h-6 cursor-pointer items-center gap-1 rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-2 text-text-accent shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent'
|
||||
onClick={() => setShowVariableInspectPanel(true)}
|
||||
>
|
||||
View cached variables
|
||||
</div>
|
||||
{/* clear button */}
|
||||
<div
|
||||
className='system-xs-medium flex h-6 cursor-pointer items-center rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-1 text-text-tertiary shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent hover:text-text-accent'
|
||||
// onClick={() => {}}
|
||||
>
|
||||
Clear
|
||||
</div>
|
||||
)}
|
||||
{!isRunning && currentVars.length > 0 && (
|
||||
<>
|
||||
<div
|
||||
className='system-xs-medium flex h-6 cursor-pointer items-center gap-1 rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-2 text-text-accent shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent'
|
||||
onClick={() => setShowVariableInspectPanel(true)}
|
||||
>
|
||||
{t('workflow.debug.variableInspect.trigger.cached')}
|
||||
</div>
|
||||
<div
|
||||
className='system-xs-medium flex h-6 cursor-pointer items-center rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-1 text-text-tertiary shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent hover:text-text-accent'
|
||||
onClick={clearCurrentVars}
|
||||
>
|
||||
{t('workflow.debug.variableInspect.trigger.clear')}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{isRunning && (
|
||||
<>
|
||||
<div
|
||||
className='system-xs-medium flex h-6 cursor-pointer items-center gap-1 rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-2 text-text-accent shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent'
|
||||
onClick={() => setShowVariableInspectPanel(true)}
|
||||
>
|
||||
<RiLoader2Line className='h-4 w-4' />
|
||||
<span className='text-text-accent'>{t('workflow.debug.variableInspect.trigger.running')}</span>
|
||||
</div>
|
||||
<Tooltip
|
||||
popupContent={t('workflow.debug.variableInspect.trigger.stop')}
|
||||
>
|
||||
<div
|
||||
className='flex h-6 cursor-pointer items-center rounded-md border-[0.5px] border-effects-highlight bg-components-actionbar-bg px-1 shadow-lg backdrop-blur-sm hover:bg-components-actionbar-bg-accent'
|
||||
// onClick={() => {}}
|
||||
>
|
||||
<RiStopCircleFill className='h-4 w-4 text-text-accent' />
|
||||
</div>
|
||||
</Tooltip>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
@ -914,6 +914,15 @@ const translation = {
|
||||
description: 'The results of the last run will be displayed here',
|
||||
runThisNode: 'Run this node',
|
||||
},
|
||||
variableInspect: {
|
||||
trigger: {
|
||||
normal: 'Variable Inspect',
|
||||
running: 'Caching running status',
|
||||
stop: 'Stop run',
|
||||
cached: 'View cached variables',
|
||||
clear: 'Clear',
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
|
@ -915,6 +915,15 @@ const translation = {
|
||||
description: '上次运行的结果将显示在这里',
|
||||
runThisNode: '运行此节点',
|
||||
},
|
||||
variableInspect: {
|
||||
trigger: {
|
||||
normal: '变量检查',
|
||||
running: '缓存中',
|
||||
stop: '停止运行',
|
||||
cached: '查看缓存',
|
||||
clear: '清除',
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user