FEAT: NEW WORKFLOW ENGINE (#3160)

Co-authored-by: Joel <iamjoel007@gmail.com>
Co-authored-by: Yeuoly <admin@srmxy.cn>
Co-authored-by: JzoNg <jzongcode@gmail.com>
Co-authored-by: StyleZhang <jasonapring2015@outlook.com>
Co-authored-by: jyong <jyong@dify.ai>
Co-authored-by: nite-knite <nkCoding@gmail.com>
Co-authored-by: jyong <718720800@qq.com>
This commit is contained in:
takatost
2024-04-08 18:51:46 +08:00
committed by GitHub
parent 2fb9850af5
commit 7753ba2d37
1161 changed files with 103836 additions and 10327 deletions

View File

@@ -18,12 +18,14 @@ type ContextBlockComponentProps = {
nodeKey: string
datasets?: Dataset[]
onAddContext: () => void
canNotAddContext?: boolean
}
const ContextBlockComponent: FC<ContextBlockComponentProps> = ({
nodeKey,
datasets = [],
onAddContext,
canNotAddContext,
}) => {
const { t } = useTranslation()
const [ref, isSelected] = useSelectOrDelete(nodeKey, DELETE_CONTEXT_BLOCK_COMMAND)
@@ -44,52 +46,55 @@ const ContextBlockComponent: FC<ContextBlockComponentProps> = ({
`} ref={ref}>
<File05 className='mr-1 w-[14px] h-[14px]' />
<div className='mr-1 text-xs font-medium'>{t('common.promptEditor.context.item.title')}</div>
<PortalToFollowElem
open={open}
onOpenChange={setOpen}
placement='bottom-end'
offset={{
mainAxis: 3,
alignmentAxis: -147,
}}
>
<PortalToFollowElemTrigger ref={triggerRef}>
<div className={`
{!canNotAddContext && (
<PortalToFollowElem
open={open}
onOpenChange={setOpen}
placement='bottom-end'
offset={{
mainAxis: 3,
alignmentAxis: -147,
}}
>
<PortalToFollowElemTrigger ref={triggerRef}>
<div className={`
flex items-center justify-center w-[18px] h-[18px] text-[11px] font-semibold rounded cursor-pointer
${open ? 'bg-[#6938EF] text-white' : 'bg-white/50 group-hover:bg-white group-hover:shadow-xs'}
`}>{localDatasets.length}</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent style={{ zIndex: 100 }}>
<div className='w-[360px] bg-white rounded-xl shadow-lg'>
<div className='p-4'>
<div className='mb-2 text-xs font-medium text-gray-500'>
{t('common.promptEditor.context.modal.title', { num: localDatasets.length })}
</div>
<div className='max-h-[270px] overflow-y-auto'>
{
localDatasets.map(dataset => (
<div key={dataset.id} className='flex items-center h-8'>
<div className='flex items-center justify-center shrink-0 mr-2 w-6 h-6 bg-[#F5F8FF] rounded-md border-[0.5px] border-[#EAECF5]'>
<Folder className='w-4 h-4 text-[#444CE7]' />
</div>
<div className='text-sm text-gray-800 truncate' title=''>{dataset.name}</div>
</div>
))
}
</div>
<div className='flex items-center h-8 text-[#155EEF] cursor-pointer' onClick={onAddContext}>
<div className='shrink-0 flex justify-center items-center mr-2 w-6 h-6 rounded-md border-[0.5px] border-gray-100'>
<Plus className='w-[14px] h-[14px]' />
</PortalToFollowElemTrigger>
<PortalToFollowElemContent style={{ zIndex: 100 }}>
<div className='w-[360px] bg-white rounded-xl shadow-lg'>
<div className='p-4'>
<div className='mb-2 text-xs font-medium text-gray-500'>
{t('common.promptEditor.context.modal.title', { num: localDatasets.length })}
</div>
<div className='text-[13px] font-medium' title=''>{t('common.promptEditor.context.modal.add')}</div>
<div className='max-h-[270px] overflow-y-auto'>
{
localDatasets.map(dataset => (
<div key={dataset.id} className='flex items-center h-8'>
<div className='flex items-center justify-center shrink-0 mr-2 w-6 h-6 bg-[#F5F8FF] rounded-md border-[0.5px] border-[#EAECF5]'>
<Folder className='w-4 h-4 text-[#444CE7]' />
</div>
<div className='text-sm text-gray-800 truncate' title=''>{dataset.name}</div>
</div>
))
}
</div>
<div className='flex items-center h-8 text-[#155EEF] cursor-pointer' onClick={onAddContext}>
<div className='shrink-0 flex justify-center items-center mr-2 w-6 h-6 rounded-md border-[0.5px] border-gray-100'>
<Plus className='w-[14px] h-[14px]' />
</div>
<div className='text-[13px] font-medium' title=''>{t('common.promptEditor.context.modal.add')}</div>
</div>
</div>
<div className='px-4 py-3 text-xs text-gray-500 bg-gray-50 border-t-[0.5px] border-gray-50 rounded-b-xl'>
{t('common.promptEditor.context.modal.footer')}
</div>
</div>
<div className='px-4 py-3 text-xs text-gray-500 bg-gray-50 border-t-[0.5px] border-gray-50 rounded-b-xl'>
{t('common.promptEditor.context.modal.footer')}
</div>
</div>
</PortalToFollowElemContent>
</PortalToFollowElem>
</PortalToFollowElemContent>
</PortalToFollowElem>
)}
</div>
)
}