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>
2024-04-08 18:51:46 +08:00
parent 2fb9850af5
commit 7753ba2d37
1161 changed files with 103836 additions and 10327 deletions
--- a/web/app/components/app/configuration/dataset-config/params-config/config-content.tsx
+++ b/web/app/components/app/configuration/dataset-config/params-config/config-content.tsx
@@ -0,0 +1,181 @@
+'use client'
+import React from 'react'
+import type { FC } from 'react'
+import { useTranslation } from 'react-i18next'
+import TopKItem from '@/app/components/base/param-item/top-k-item'
+import ScoreThresholdItem from '@/app/components/base/param-item/score-threshold-item'
+import RadioCard from '@/app/components/base/radio-card/simple'
+import { RETRIEVE_TYPE } from '@/types/app'
+import {
+  MultiPathRetrieval,
+  NTo1Retrieval,
+} from '@/app/components/base/icons/src/public/common'
+import type {
+  DatasetConfigs,
+} from '@/models/debug'
+
+import ModelSelector from '@/app/components/header/account-setting/model-provider-page/model-selector'
+import { useModelListAndDefaultModelAndCurrentProviderAndModel } from '@/app/components/header/account-setting/model-provider-page/hooks'
+import type { ModelConfig } from '@/app/components/workflow/types'
+import ModelParameterModal from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal'
+import TooltipPlus from '@/app/components/base/tooltip-plus'
+import { HelpCircle } from '@/app/components/base/icons/src/vender/line/general'
+import { ModelTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
+
+type Props = {
+  datasetConfigs: DatasetConfigs
+  onChange: (configs: DatasetConfigs, isRetrievalModeChange?: boolean) => void
+  isInWorkflow?: boolean
+  singleRetrievalModelConfig?: ModelConfig
+  onSingleRetrievalModelChange?: (config: ModelConfig) => void
+  onSingleRetrievalModelParamsChange?: (config: ModelConfig) => void
+}
+
+const ConfigContent: FC<Props> = ({
+  datasetConfigs,
+  onChange,
+  isInWorkflow,
+  singleRetrievalModelConfig: singleRetrievalConfig = {} as ModelConfig,
+  onSingleRetrievalModelChange = () => { },
+  onSingleRetrievalModelParamsChange = () => { },
+}) => {
+  const { t } = useTranslation()
+  const type = datasetConfigs.retrieval_model
+  const setType = (value: RETRIEVE_TYPE) => {
+    onChange({
+      ...datasetConfigs,
+      retrieval_model: value,
+    }, true)
+  }
+  const {
+    modelList: rerankModelList,
+    defaultModel: rerankDefaultModel,
+  } = useModelListAndDefaultModelAndCurrentProviderAndModel(ModelTypeEnum.rerank)
+  const rerankModel = (() => {
+    if (datasetConfigs.reranking_model) {
+      return {
+        provider_name: datasetConfigs.reranking_model.reranking_provider_name,
+        model_name: datasetConfigs.reranking_model.reranking_model_name,
+      }
+    }
+    else if (rerankDefaultModel) {
+      return {
+        provider_name: rerankDefaultModel.provider.provider,
+        model_name: rerankDefaultModel.model,
+      }
+    }
+  })()
+
+  const handleParamChange = (key: string, value: number) => {
+    if (key === 'top_k') {
+      onChange({
+        ...datasetConfigs,
+        top_k: value,
+      })
+    }
+    else if (key === 'score_threshold') {
+      onChange({
+        ...datasetConfigs,
+        score_threshold: value,
+      })
+    }
+  }
+
+  const handleSwitch = (key: string, enable: boolean) => {
+    if (key === 'top_k')
+      return
+
+    onChange({
+      ...datasetConfigs,
+      score_threshold_enabled: enable,
+    })
+  }
+
+  const model = singleRetrievalConfig
+
+  return (
+    <div>
+      <div className='mt-2 space-y-3'>
+        <RadioCard
+          icon={<NTo1Retrieval className='shrink-0 mr-3 w-9 h-9 rounded-lg' />}
+          title={t('appDebug.datasetConfig.retrieveOneWay.title')}
+          description={t('appDebug.datasetConfig.retrieveOneWay.description')}
+          isChosen={type === RETRIEVE_TYPE.oneWay}
+          onChosen={() => { setType(RETRIEVE_TYPE.oneWay) }}
+        />
+        <RadioCard
+          icon={<MultiPathRetrieval className='shrink-0 mr-3 w-9 h-9 rounded-lg' />}
+          title={t('appDebug.datasetConfig.retrieveMultiWay.title')}
+          description={t('appDebug.datasetConfig.retrieveMultiWay.description')}
+          isChosen={type === RETRIEVE_TYPE.multiWay}
+          onChosen={() => { setType(RETRIEVE_TYPE.multiWay) }}
+        />
+      </div>
+      {type === RETRIEVE_TYPE.multiWay && (
+        <>
+          <div className='mt-6'>
+            <div className='leading-[32px] text-[13px] font-medium text-gray-900'>{t('common.modelProvider.rerankModel.key')}</div>
+            <div>
+              <ModelSelector
+                defaultModel={rerankModel && { provider: rerankModel?.provider_name, model: rerankModel?.model_name }}
+                onSelect={(v) => {
+                  onChange({
+                    ...datasetConfigs,
+                    reranking_model: {
+                      reranking_provider_name: v.provider,
+                      reranking_model_name: v.model,
+                    },
+                  })
+                }}
+                modelList={rerankModelList}
+              />
+            </div>
+          </div>
+          <div className='mt-4 space-y-4'>
+            <TopKItem
+              value={datasetConfigs.top_k}
+              onChange={handleParamChange}
+              enable={true}
+            />
+            <ScoreThresholdItem
+              value={datasetConfigs.score_threshold as number}
+              onChange={handleParamChange}
+              enable={datasetConfigs.score_threshold_enabled}
+              hasSwitch={true}
+              onSwitchChange={handleSwitch}
+            />
+          </div>
+        </>
+      )}
+
+      {isInWorkflow && type === RETRIEVE_TYPE.oneWay && (
+        <div className='mt-6'>
+          <div className='flex items-center space-x-0.5'>
+            <div className='leading-[32px] text-[13px] font-medium text-gray-900'>{t('common.modelProvider.systemReasoningModel.key')}</div>
+            <TooltipPlus
+              popupContent={t('common.modelProvider.systemReasoningModel.tip')}
+            >
+              <HelpCircle className='w-3.5 h-4.5 text-gray-400' />
+            </TooltipPlus>
+          </div>
+          <ModelParameterModal
+            isInWorkflow={isInWorkflow}
+            popupClassName='!w-[387px]'
+            portalToFollowElemContentClassName='!z-[1002]'
+            isAdvancedMode={true}
+            mode={model?.mode}
+            provider={model?.provider}
+            completionParams={model?.completion_params}
+            modelId={model?.name}
+            setModel={onSingleRetrievalModelChange as any}
+            onCompletionParamsChange={onSingleRetrievalModelParamsChange as any}
+            hideDebugWithMultipleModel
+            debugWithMultipleModel={false}
+          />
+        </div>
+      )
+      }
+    </div >
+  )
+}
+export default React.memo(ConfigContent)
--- a/web/app/components/app/configuration/dataset-config/params-config/index.tsx
+++ b/web/app/components/app/configuration/dataset-config/params-config/index.tsx
@@ -4,21 +4,14 @@ import { memo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
 import cn from 'classnames'
+import ConfigContent from './config-content'
 import { Settings04 } from '@/app/components/base/icons/src/vender/line/general'
 import ConfigContext from '@/context/debug-configuration'
-import TopKItem from '@/app/components/base/param-item/top-k-item'
-import ScoreThresholdItem from '@/app/components/base/param-item/score-threshold-item'
 import Modal from '@/app/components/base/modal'
 import Button from '@/app/components/base/button'
-import RadioCard from '@/app/components/base/radio-card/simple'
 import { RETRIEVE_TYPE } from '@/types/app'
 import Toast from '@/app/components/base/toast'
 import { DATASET_DEFAULT } from '@/config'
-import {
-  MultiPathRetrieval,
-  NTo1Retrieval,
-} from '@/app/components/base/icons/src/public/common'
-import ModelSelector from '@/app/components/header/account-setting/model-provider-page/model-selector'
 import { useModelListAndDefaultModelAndCurrentProviderAndModel } from '@/app/components/header/account-setting/model-provider-page/hooks'
 import { ModelTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'

@@ -31,58 +24,11 @@ const ParamsConfig: FC = () => {
  } = useContext(ConfigContext)
  const [tempDataSetConfigs, setTempDataSetConfigs] = useState(datasetConfigs)

-  const type = tempDataSetConfigs.retrieval_model
-  const setType = (value: RETRIEVE_TYPE) => {
-    setTempDataSetConfigs({
-      ...tempDataSetConfigs,
-      retrieval_model: value,
-    })
-  }
  const {
-    modelList: rerankModelList,
    defaultModel: rerankDefaultModel,
    currentModel: isRerankDefaultModelVaild,
  } = useModelListAndDefaultModelAndCurrentProviderAndModel(ModelTypeEnum.rerank)

-  const rerankModel = (() => {
-    if (tempDataSetConfigs.reranking_model) {
-      return {
-        provider_name: tempDataSetConfigs.reranking_model.reranking_provider_name,
-        model_name: tempDataSetConfigs.reranking_model.reranking_model_name,
-      }
-    }
-    else if (rerankDefaultModel) {
-      return {
-        provider_name: rerankDefaultModel.provider.provider,
-        model_name: rerankDefaultModel.model,
-      }
-    }
-  })()
-
-  const handleParamChange = (key: string, value: number) => {
-    if (key === 'top_k') {
-      setTempDataSetConfigs({
-        ...tempDataSetConfigs,
-        top_k: value,
-      })
-    }
-    else if (key === 'score_threshold') {
-      setTempDataSetConfigs({
-        ...tempDataSetConfigs,
-        score_threshold: value,
-      })
-    }
-  }
-
-  const handleSwitch = (key: string, enable: boolean) => {
-    if (key === 'top_k')
-      return
-
-    setTempDataSetConfigs({
-      ...tempDataSetConfigs,
-      score_threshold_enabled: enable,
-    })
-  }
  const isValid = () => {
    let errMsg = ''
    if (tempDataSetConfigs.retrieval_model === RETRIEVE_TYPE.multiWay) {
@@ -141,58 +87,11 @@ const ParamsConfig: FC = () => {
            wrapperClassName='z-50'
            title={t('appDebug.datasetConfig.settingTitle')}
          >
-            <div className='mt-2 space-y-3'>
-              <RadioCard
-                icon={<NTo1Retrieval className='shrink-0 mr-3 w-9 h-9 rounded-lg' />}
-                title={t('appDebug.datasetConfig.retrieveOneWay.title')}
-                description={t('appDebug.datasetConfig.retrieveOneWay.description')}
-                isChosen={type === RETRIEVE_TYPE.oneWay}
-                onChosen={() => { setType(RETRIEVE_TYPE.oneWay) }}
-              />
-              <RadioCard
-                icon={<MultiPathRetrieval className='shrink-0 mr-3 w-9 h-9 rounded-lg' />}
-                title={t('appDebug.datasetConfig.retrieveMultiWay.title')}
-                description={t('appDebug.datasetConfig.retrieveMultiWay.description')}
-                isChosen={type === RETRIEVE_TYPE.multiWay}
-                onChosen={() => { setType(RETRIEVE_TYPE.multiWay) }}
-              />
-            </div>
-            {type === RETRIEVE_TYPE.multiWay && (
-              <>
-                <div className='mt-6'>
-                  <div className='leading-[32px] text-[13px] font-medium text-gray-900'>{t('common.modelProvider.rerankModel.key')}</div>
-                  <div>
-                    <ModelSelector
-                      defaultModel={rerankModel && { provider: rerankModel?.provider_name, model: rerankModel?.model_name }}
-                      onSelect={(v) => {
-                        setTempDataSetConfigs({
-                          ...tempDataSetConfigs,
-                          reranking_model: {
-                            reranking_provider_name: v.provider,
-                            reranking_model_name: v.model,
-                          },
-                        })
-                      }}
-                      modelList={rerankModelList}
-                    />
-                  </div>
-                </div>
-                <div className='mt-4 space-y-4'>
-                  <TopKItem
-                    value={tempDataSetConfigs.top_k}
-                    onChange={handleParamChange}
-                    enable={true}
-                  />
-                  <ScoreThresholdItem
-                    value={tempDataSetConfigs.score_threshold}
-                    onChange={handleParamChange}
-                    enable={tempDataSetConfigs.score_threshold_enabled}
-                    hasSwitch={true}
-                    onSwitchChange={handleSwitch}
-                  />
-                </div>
-              </>
-            )}
+            <ConfigContent
+              datasetConfigs={tempDataSetConfigs}
+              onChange={setTempDataSetConfigs}
+            />
+
            <div className='mt-6 flex justify-end'>
              <Button className='mr-2 flex-shrink-0' onClick={() => {
                setOpen(false)