feat: knowledge pipeline (#25360)

Signed-off-by: -LAN- <laipz8200@outlook.com>
Co-authored-by: twwu <twwu@dify.ai>
Co-authored-by: crazywoola <100913391+crazywoola@users.noreply.github.com>
Co-authored-by: jyong <718720800@qq.com>
Co-authored-by: Wu Tianwei <30284043+WTW0313@users.noreply.github.com>
Co-authored-by: QuantumGhost <obelisk.reg+git@gmail.com>
Co-authored-by: lyzno1 <yuanyouhuilyz@gmail.com>
Co-authored-by: quicksand <quicksandzn@gmail.com>
Co-authored-by: Jyong <76649700+JohnJyong@users.noreply.github.com>
Co-authored-by: lyzno1 <92089059+lyzno1@users.noreply.github.com>
Co-authored-by: zxhlyh <jasonapring2015@outlook.com>
Co-authored-by: Yongtao Huang <yongtaoh2022@gmail.com>
Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: Joel <iamjoel007@gmail.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: nite-knite <nkCoding@gmail.com>
Co-authored-by: Hanqing Zhao <sherry9277@gmail.com>
Co-authored-by: gemini-code-assist[bot] <176961590+gemini-code-assist[bot]@users.noreply.github.com>
Co-authored-by: Harry <xh001x@hotmail.com>

web/app/components/workflow-app/components/workflow-children.tsx

@@ -5,7 +5,7 @@ import {
 import type { EnvironmentVariable } from '@/app/components/workflow/types'
 import { DSL_EXPORT_CHECK } from '@/app/components/workflow/constants'
 import { useStore } from '@/app/components/workflow/store'
-import PluginDependency from '@/app/components/workflow/plugin-dependency'
+import PluginDependency from '../../workflow/plugin-dependency'
 import {
   useDSL,
   usePanelInteractions,
@@ -54,7 +54,7 @@ const WorkflowChildren = () => {
         showImportDSLModal && (
           <UpdateDSLModal
             onCancel={() => setShowImportDSLModal(false)}
-            onBackup={exportCheck}
+            onBackup={exportCheck!}
             onImport={handlePaneContextmenuCancel}
           />
         )
@@ -63,7 +63,7 @@ const WorkflowChildren = () => {
         secretEnvList.length > 0 && (
           <DSLExportConfirmModal
             envList={secretEnvList}
-            onConfirm={handleExportDSL}
+            onConfirm={handleExportDSL!}
             onClose={() => setSecretEnvList([])}
           />
         )

web/app/components/workflow-app/components/workflow-header/features-trigger.tsx

@@ -85,7 +85,7 @@ const FeaturesTrigger = () => {
     setShowFeaturesPanel(!showFeaturesPanel)
   }, [workflowStore, getNodesReadOnly])
 
-  const resetWorkflowVersionHistory = useResetWorkflowVersionHistory(appDetail!.id)
+  const resetWorkflowVersionHistory = useResetWorkflowVersionHistory()
 
   const updateAppDetail = useCallback(async () => {
     try {
@@ -96,7 +96,7 @@ const FeaturesTrigger = () => {
       console.error(error)
     }
   }, [appID, setAppDetail])
-  const { mutateAsync: publishWorkflow } = usePublishWorkflow(appID!)
+  const { mutateAsync: publishWorkflow } = usePublishWorkflow()
   const nodes = useNodes<CommonNodeType>()
   const edges = useEdges<CommonEdgeType>()
   const needWarningNodes = useChecklist(nodes, edges)
@@ -112,6 +112,7 @@ const FeaturesTrigger = () => {
     // Then perform the detailed validation
     if (await handleCheckBeforePublish()) {
       const res = await publishWorkflow({
+        url: `/apps/${appID}/workflows/publish`,
         title: params?.title || '',
         releaseNotes: params?.releaseNotes || '',
       })
@@ -127,7 +128,7 @@ const FeaturesTrigger = () => {
     else {
       throw new Error('Checklist failed')
     }
-  }, [needWarningNodes, handleCheckBeforePublish, publishWorkflow, notify, t, updatePublishedWorkflow, appID, updateAppDetail, workflowStore, resetWorkflowVersionHistory])
+  }, [needWarningNodes, handleCheckBeforePublish, publishWorkflow, notify, appID, t, updatePublishedWorkflow, updateAppDetail, workflowStore, resetWorkflowVersionHistory])
 
   const onPublisherToggle = useCallback((state: boolean) => {
     if (state)

web/app/components/workflow-app/components/workflow-header/index.tsx

@@ -1,14 +1,41 @@
-import { useMemo } from 'react'
+import {
+  memo,
+  useCallback,
+  useMemo,
+} from 'react'
+import { useShallow } from 'zustand/react/shallow'
 import type { HeaderProps } from '@/app/components/workflow/header'
 import Header from '@/app/components/workflow/header'
 import { useStore as useAppStore } from '@/app/components/app/store'
+import {
+  fetchWorkflowRunHistory,
+} from '@/service/workflow'
 import ChatVariableTrigger from './chat-variable-trigger'
 import FeaturesTrigger from './features-trigger'
 import { useResetWorkflowVersionHistory } from '@/service/use-workflow'
+import { useIsChatMode } from '../../hooks'
 
 const WorkflowHeader = () => {
-  const appDetail = useAppStore(s => s.appDetail)
-  const resetWorkflowVersionHistory = useResetWorkflowVersionHistory(appDetail!.id)
+  const { appDetail, setCurrentLogItem, setShowMessageLogModal } = useAppStore(useShallow(state => ({
+    appDetail: state.appDetail,
+    setCurrentLogItem: state.setCurrentLogItem,
+    setShowMessageLogModal: state.setShowMessageLogModal,
+  })))
+  const resetWorkflowVersionHistory = useResetWorkflowVersionHistory()
+  const isChatMode = useIsChatMode()
+
+  const handleClearLogAndMessageModal = useCallback(() => {
+    setCurrentLogItem()
+    setShowMessageLogModal(false)
+  }, [setCurrentLogItem, setShowMessageLogModal])
+
+  const viewHistoryProps = useMemo(() => {
+    return {
+      onClearLogAndMessageModal: handleClearLogAndMessageModal,
+      historyUrl: isChatMode ? `/apps/${appDetail!.id}/advanced-chat/workflow-runs` : `/apps/${appDetail!.id}/workflow-runs`,
+      historyFetcher: fetchWorkflowRunHistory,
+    }
+  }, [appDetail, isChatMode, handleClearLogAndMessageModal])
 
   const headerProps: HeaderProps = useMemo(() => {
     return {
@@ -17,15 +44,23 @@ const WorkflowHeader = () => {
           left: <ChatVariableTrigger />,
           middle: <FeaturesTrigger />,
         },
+        runAndHistoryProps: {
+          showRunButton: !isChatMode,
+          showPreviewButton: isChatMode,
+          viewHistoryProps,
+        },
+      },
+      viewHistory: {
+        viewHistoryProps,
       },
       restoring: {
         onRestoreSettled: resetWorkflowVersionHistory,
       },
     }
-  }, [resetWorkflowVersionHistory])
+  }, [resetWorkflowVersionHistory, isChatMode, viewHistoryProps])
   return (
     <Header {...headerProps} />
   )
 }
 
-export default WorkflowHeader
+export default memo(WorkflowHeader)

web/app/components/workflow-app/components/workflow-main.tsx

@@ -7,7 +7,10 @@ import { WorkflowWithInnerContext } from '@/app/components/workflow'
 import type { WorkflowProps } from '@/app/components/workflow'
 import WorkflowChildren from './workflow-children'
 import {
+  useAvailableNodesMetaData,
   useConfigsMap,
+  useDSL,
+  useGetRunAndTraceUrl,
   useInspectVarsCrud,
   useNodesSyncDraft,
   useSetWorkflowVarsWithValue,
@@ -15,7 +18,7 @@ import {
   useWorkflowRun,
   useWorkflowStartRun,
 } from '../hooks'
-import { useStore, useWorkflowStore } from '@/app/components/workflow/store'
+import { useWorkflowStore } from '@/app/components/workflow/store'
 
 type WorkflowMainProps = Pick<WorkflowProps, 'nodes' | 'edges' | 'viewport'>
 const WorkflowMain = ({
@@ -64,10 +67,16 @@ const WorkflowMain = ({
     handleWorkflowStartRunInChatflow,
     handleWorkflowStartRunInWorkflow,
   } = useWorkflowStartRun()
-  const appId = useStore(s => s.appId)
+  const availableNodesMetaData = useAvailableNodesMetaData()
+  const { getWorkflowRunAndTraceUrl } = useGetRunAndTraceUrl()
+  const {
+    exportCheck,
+    handleExportDSL,
+  } = useDSL()
+
+  const configsMap = useConfigsMap()
   const { fetchInspectVars } = useSetWorkflowVarsWithValue({
-    flowId: appId,
-    ...useConfigsMap(),
+    ...configsMap,
   })
   const {
     hasNodeInspectVars,
@@ -85,7 +94,6 @@ const WorkflowMain = ({
     resetConversationVar,
     invalidateConversationVarValues,
   } = useInspectVarsCrud()
-  const configsMap = useConfigsMap()
 
   const hooksStore = useMemo(() => {
     return {
@@ -100,6 +108,10 @@ const WorkflowMain = ({
       handleStartWorkflowRun,
       handleWorkflowStartRunInChatflow,
       handleWorkflowStartRunInWorkflow,
+      availableNodesMetaData,
+      getWorkflowRunAndTraceUrl,
+      exportCheck,
+      handleExportDSL,
       fetchInspectVars,
       hasNodeInspectVars,
       hasSetInspectVar,
@@ -129,6 +141,10 @@ const WorkflowMain = ({
     handleStartWorkflowRun,
     handleWorkflowStartRunInChatflow,
     handleWorkflowStartRunInWorkflow,
+    availableNodesMetaData,
+    getWorkflowRunAndTraceUrl,
+    exportCheck,
+    handleExportDSL,
     fetchInspectVars,
     hasNodeInspectVars,
     hasSetInspectVar,
@@ -153,7 +169,7 @@ const WorkflowMain = ({
       edges={edges}
       viewport={viewport}
       onWorkflowDataUpdate={handleWorkflowDataUpdate}
-      hooksStore={hooksStore}
+      hooksStore={hooksStore as any}
     >
       <WorkflowChildren />
     </WorkflowWithInnerContext>

web/app/components/workflow-app/components/workflow-panel.tsx

@@ -1,4 +1,7 @@
-import { useMemo } from 'react'
+import {
+  memo,
+  useMemo,
+} from 'react'
 import { useShallow } from 'zustand/react/shallow'
 import { useStore } from '@/app/components/workflow/store'
 import {
@@ -30,9 +33,6 @@ const ChatVariablePanel = dynamic(() => import('@/app/components/workflow/panel/
 const GlobalVariablePanel = dynamic(() => import('@/app/components/workflow/panel/global-variable-panel'), {
   ssr: false,
 })
-const VersionHistoryPanel = dynamic(() => import('@/app/components/workflow/panel/version-history-panel'), {
-  ssr: false,
-})
 
 const WorkflowPanelOnLeft = () => {
   const { currentLogItem, setCurrentLogItem, showMessageLogModal, setShowMessageLogModal, currentLogModalActiveTab } = useAppStore(useShallow(state => ({
@@ -67,7 +67,6 @@ const WorkflowPanelOnRight = () => {
   const showDebugAndPreviewPanel = useStore(s => s.showDebugAndPreviewPanel)
   const showChatVariablePanel = useStore(s => s.showChatVariablePanel)
   const showGlobalVariablePanel = useStore(s => s.showGlobalVariablePanel)
-  const showWorkflowVersionHistoryPanel = useStore(s => s.showWorkflowVersionHistoryPanel)
 
   return (
     <>
@@ -101,27 +100,34 @@ const WorkflowPanelOnRight = () => {
           <GlobalVariablePanel />
         )
       }
-      {
-        showWorkflowVersionHistoryPanel && (
-          <VersionHistoryPanel/>
-        )
-      }
     </>
   )
 }
 const WorkflowPanel = () => {
+  const appDetail = useAppStore(s => s.appDetail)
+  const versionHistoryPanelProps = useMemo(() => {
+    const appId = appDetail?.id
+    return {
+      getVersionListUrl: `/apps/${appId}/workflows`,
+      deleteVersionUrl: (versionId: string) => `/apps/${appId}/workflows/${versionId}`,
+      updateVersionUrl: (versionId: string) => `/apps/${appId}/workflows/${versionId}`,
+      latestVersionId: appDetail?.workflow?.id,
+    }
+  }, [appDetail?.id, appDetail?.workflow?.id])
+
   const panelProps: PanelProps = useMemo(() => {
     return {
       components: {
         left: <WorkflowPanelOnLeft />,
         right: <WorkflowPanelOnRight />,
       },
+      versionHistoryPanelProps,
     }
-  }, [])
+  }, [versionHistoryPanelProps])
 
   return (
     <Panel {...panelProps} />
   )
 }
 
-export default WorkflowPanel
+export default memo(WorkflowPanel)

web/app/components/workflow-app/hooks/index.ts

@@ -4,7 +4,10 @@ export * from './use-nodes-sync-draft'
 export * from './use-workflow-run'
 export * from './use-workflow-start-run'
 export * from './use-is-chat-mode'
+export * from './use-available-nodes-meta-data'
 export * from './use-workflow-refresh-draft'
+export * from './use-get-run-and-trace-url'
+export * from './use-DSL'
 export * from '../../workflow/hooks/use-fetch-workflow-inspect-vars'
 export * from './use-inspect-vars-crud'
 export * from './use-configs-map'

web/app/components/workflow-app/hooks/use-DSL.ts

@@ -0,0 +1,82 @@
+import {
+  useCallback,
+  useState,
+} from 'react'
+import { useTranslation } from 'react-i18next'
+import {
+  DSL_EXPORT_CHECK,
+} from '@/app/components/workflow/constants'
+import { useNodesSyncDraft } from './use-nodes-sync-draft'
+import { useEventEmitterContextContext } from '@/context/event-emitter'
+import { fetchWorkflowDraft } from '@/service/workflow'
+import { exportAppConfig } from '@/service/apps'
+import { useToastContext } from '@/app/components/base/toast'
+import { useStore as useAppStore } from '@/app/components/app/store'
+
+export const useDSL = () => {
+  const { t } = useTranslation()
+  const { notify } = useToastContext()
+  const { eventEmitter } = useEventEmitterContextContext()
+  const [exporting, setExporting] = useState(false)
+  const { doSyncWorkflowDraft } = useNodesSyncDraft()
+
+  const appDetail = useAppStore(s => s.appDetail)
+
+  const handleExportDSL = useCallback(async (include = false, workflowId?: string) => {
+    if (!appDetail)
+      return
+
+    if (exporting)
+      return
+
+    try {
+      setExporting(true)
+      await doSyncWorkflowDraft()
+      const { data } = await exportAppConfig({
+        appID: appDetail.id,
+        include,
+        workflowID: workflowId,
+      })
+      const a = document.createElement('a')
+      const file = new Blob([data], { type: 'application/yaml' })
+      const url = URL.createObjectURL(file)
+      a.href = url
+      a.download = `${appDetail.name}.yml`
+      a.click()
+      URL.revokeObjectURL(url)
+    }
+    catch {
+      notify({ type: 'error', message: t('app.exportFailed') })
+    }
+    finally {
+      setExporting(false)
+    }
+  }, [appDetail, notify, t, doSyncWorkflowDraft, exporting])
+
+  const exportCheck = useCallback(async () => {
+    if (!appDetail)
+      return
+    try {
+      const workflowDraft = await fetchWorkflowDraft(`/apps/${appDetail?.id}/workflows/draft`)
+      const list = (workflowDraft.environment_variables || []).filter(env => env.value_type === 'secret')
+      if (list.length === 0) {
+        handleExportDSL()
+        return
+      }
+      eventEmitter?.emit({
+        type: DSL_EXPORT_CHECK,
+        payload: {
+          data: list,
+        },
+      } as any)
+    }
+    catch {
+      notify({ type: 'error', message: t('app.exportFailed') })
+    }
+  }, [appDetail, eventEmitter, handleExportDSL, notify, t])
+
+  return {
+    exportCheck,
+    handleExportDSL,
+  }
+}

web/app/components/workflow-app/hooks/use-available-nodes-meta-data.ts

@@ -0,0 +1,68 @@
+import { useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
+import { useGetLanguage } from '@/context/i18n'
+import StartDefault from '@/app/components/workflow/nodes/start/default'
+import EndDefault from '@/app/components/workflow/nodes/end/default'
+import AnswerDefault from '@/app/components/workflow/nodes/answer/default'
+import { WORKFLOW_COMMON_NODES } from '@/app/components/workflow/constants/node'
+import type { AvailableNodesMetaData } from '@/app/components/workflow/hooks-store/store'
+import { useIsChatMode } from './use-is-chat-mode'
+import { BlockEnum } from '@/app/components/workflow/types'
+
+export const useAvailableNodesMetaData = () => {
+  const { t } = useTranslation()
+  const isChatMode = useIsChatMode()
+  const language = useGetLanguage()
+
+  const mergedNodesMetaData = useMemo(() => [
+    ...WORKFLOW_COMMON_NODES,
+    StartDefault,
+    ...(
+      isChatMode
+        ? [AnswerDefault]
+        : [EndDefault]
+    ),
+  ], [isChatMode])
+
+  const prefixLink = useMemo(() => {
+    if (language === 'zh_Hans')
+      return 'https://docs.dify.ai/zh-hans/guides/workflow/node/'
+
+    return 'https://docs.dify.ai/guides/workflow/node/'
+  }, [language])
+
+  const availableNodesMetaData = useMemo(() => mergedNodesMetaData.map((node) => {
+    const { metaData } = node
+    const title = t(`workflow.blocks.${metaData.type}`)
+    const description = t(`workflow.blocksAbout.${metaData.type}`)
+    return {
+      ...node,
+      metaData: {
+        ...metaData,
+        title,
+        description,
+        helpLinkUri: `${prefixLink}${metaData.helpLinkUri}`,
+      },
+      defaultValue: {
+        ...node.defaultValue,
+        type: metaData.type,
+        title,
+      },
+    }
+  }), [mergedNodesMetaData, t, prefixLink])
+
+  const availableNodesMetaDataMap = useMemo(() => availableNodesMetaData.reduce((acc, node) => {
+    acc![node.metaData.type] = node
+    return acc
+  }, {} as AvailableNodesMetaData['nodesMap']), [availableNodesMetaData])
+
+  return useMemo(() => {
+    return {
+      nodes: availableNodesMetaData,
+      nodesMap: {
+        ...availableNodesMetaDataMap,
+        [BlockEnum.VariableAssigner]: availableNodesMetaDataMap?.[BlockEnum.VariableAggregator],
+      },
+    }
+  }, [availableNodesMetaData, availableNodesMetaDataMap])
+}

web/app/components/workflow-app/hooks/use-configs-map.ts

@@ -1,13 +1,16 @@
 import { useMemo } from 'react'
 import { useStore } from '@/app/components/workflow/store'
+import { FlowType } from '@/types/common'
+import { useFeatures } from '@/app/components/base/features/hooks'
 
 export const useConfigsMap = () => {
   const appId = useStore(s => s.appId)
+  const fileSettings = useFeatures(s => s.features.file)
   return useMemo(() => {
     return {
-      flowId: appId,
-      conversationVarsUrl: `apps/${appId}/workflows/draft/conversation-variables`,
-      systemVarsUrl: `apps/${appId}/workflows/draft/system-variables`,
+      flowId: appId!,
+      flowType: FlowType.appFlow,
+      fileSettings,
     }
   }, [appId])
 }

web/app/components/workflow-app/hooks/use-get-run-and-trace-url.ts

@@ -0,0 +1,18 @@
+import { useCallback } from 'react'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+
+export const useGetRunAndTraceUrl = () => {
+  const workflowStore = useWorkflowStore()
+  const getWorkflowRunAndTraceUrl = useCallback((runId: string) => {
+    const { appId } = workflowStore.getState()
+
+    return {
+      runUrl: `/apps/${appId}/workflow-runs/${runId}`,
+      traceUrl: `/apps/${appId}/workflow-runs/${runId}/node-executions`,
+    }
+  }, [workflowStore])
+
+  return {
+    getWorkflowRunAndTraceUrl,
+  }
+}

web/app/components/workflow-app/hooks/use-inspect-vars-crud.ts

@@ -1,12 +1,9 @@
-import { useStore } from '@/app/components/workflow/store'
 import { useInspectVarsCrudCommon } from '../../workflow/hooks/use-inspect-vars-crud-common'
 import { useConfigsMap } from './use-configs-map'
 
 export const useInspectVarsCrud = () => {
-  const appId = useStore(s => s.appId)
   const configsMap = useConfigsMap()
   const apis = useInspectVarsCrudCommon({
-    flowId: appId,
     ...configsMap,
   })
 

web/app/components/workflow-app/hooks/use-nodes-sync-draft.ts

@@ -28,6 +28,7 @@ export const useNodesSyncDraft = () => {
       edges,
       transform,
     } = store.getState()
+    const nodes = getNodes()
     const [x, y, zoom] = transform
     const {
       appId,
@@ -36,8 +37,7 @@ export const useNodesSyncDraft = () => {
       syncWorkflowDraftHash,
     } = workflowStore.getState()
 
-    if (appId) {
-      const nodes = getNodes()
+    if (appId && !!nodes.length) {
       const hasStartNode = nodes.find(node => node.data.type === BlockEnum.Start)
 
       if (!hasStartNode)

web/app/components/workflow-app/hooks/use-workflow-init.ts

@@ -17,6 +17,8 @@ import {
 } from '@/service/workflow'
 import type { FetchWorkflowDraftResponse } from '@/types/workflow'
 import { useWorkflowConfig } from '@/service/use-workflow'
+import type { FileUploadConfigResponse } from '@/models/common'
+
 export const useWorkflowInit = () => {
   const workflowStore = useWorkflowStore()
   const {
@@ -28,7 +30,7 @@ export const useWorkflowInit = () => {
   const [data, setData] = useState<FetchWorkflowDraftResponse>()
   const [isLoading, setIsLoading] = useState(true)
   useEffect(() => {
-    workflowStore.setState({ appId: appDetail.id })
+    workflowStore.setState({ appId: appDetail.id, appName: appDetail.name })
   }, [appDetail.id, workflowStore])
 
   const handleUpdateWorkflowConfig = useCallback((config: Record<string, any>) => {
@@ -36,7 +38,16 @@ export const useWorkflowInit = () => {
 
     setWorkflowConfig(config)
   }, [workflowStore])
-  useWorkflowConfig(appDetail.id, handleUpdateWorkflowConfig)
+  useWorkflowConfig(`/apps/${appDetail.id}/workflows/draft/config`, handleUpdateWorkflowConfig)
+
+  const handleUpdateWorkflowFileUploadConfig = useCallback((config: FileUploadConfigResponse) => {
+    const { setFileUploadConfig } = workflowStore.getState()
+    setFileUploadConfig(config)
+  }, [workflowStore])
+  const {
+    data: fileUploadConfigResponse,
+    isLoading: isFileUploadConfigLoading,
+  } = useWorkflowConfig('/files/upload', handleUpdateWorkflowFileUploadConfig)
 
   const handleGetInitialWorkflowData = useCallback(async () => {
     try {
@@ -116,6 +127,7 @@ export const useWorkflowInit = () => {
 
   return {
     data,
-    isLoading,
+    isLoading: isLoading || isFileUploadConfigLoading,
+    fileUploadConfigResponse,
   }
 }

web/app/components/workflow-app/hooks/use-workflow-run.ts

@@ -31,9 +31,10 @@ export const useWorkflowRun = () => {
   const { doSyncWorkflowDraft } = useNodesSyncDraft()
   const { handleUpdateWorkflowCanvas } = useWorkflowUpdate()
   const pathname = usePathname()
-  const appId = useAppStore.getState().appDetail?.id
-  const invalidAllLastRun = useInvalidAllLastRun(appId as string)
   const configsMap = useConfigsMap()
+  const { flowId, flowType } = configsMap
+  const invalidAllLastRun = useInvalidAllLastRun(flowType, flowId)
+
   const { fetchInspectVars } = useSetWorkflowVarsWithValue({
     ...configsMap,
   })
@@ -201,7 +202,7 @@ export const useWorkflowRun = () => {
           if (onWorkflowFinished)
             onWorkflowFinished(params)
           if (isInWorkflowDebug) {
-            fetchInspectVars()
+            fetchInspectVars({})
             invalidAllLastRun()
           }
         },

web/app/components/workflow-app/hooks/use-workflow-template.ts

@@ -1,17 +1,25 @@
+import { useTranslation } from 'react-i18next'
 import { generateNewNode } from '@/app/components/workflow/utils'
 import {
   NODE_WIDTH_X_OFFSET,
   START_INITIAL_POSITION,
 } from '@/app/components/workflow/constants'
-import { useNodesInitialData } from '@/app/components/workflow/hooks'
 import { useIsChatMode } from './use-is-chat-mode'
+import type { StartNodeType } from '@/app/components/workflow/nodes/start/types'
+import startDefault from '@/app/components/workflow/nodes/start/default'
+import llmDefault from '@/app/components/workflow/nodes/llm/default'
+import answerDefault from '@/app/components/workflow/nodes/answer/default'
 
 export const useWorkflowTemplate = () => {
   const isChatMode = useIsChatMode()
-  const nodesInitialData = useNodesInitialData()
+  const { t } = useTranslation()
 
   const { newNode: startNode } = generateNewNode({
-    data: nodesInitialData.start,
+    data: {
+      ...startDefault.defaultValue as StartNodeType,
+      type: startDefault.metaData.type,
+      title: t(`workflow.blocks.${startDefault.metaData.type}`),
+    },
     position: START_INITIAL_POSITION,
   })
 
@@ -19,12 +27,14 @@ export const useWorkflowTemplate = () => {
     const { newNode: llmNode } = generateNewNode({
       id: 'llm',
       data: {
-        ...nodesInitialData.llm,
+        ...llmDefault.defaultValue,
         memory: {
           window: { enabled: false, size: 10 },
           query_prompt_template: '{{#sys.query#}}\n\n{{#sys.files#}}',
         },
         selected: true,
+        type: llmDefault.metaData.type,
+        title: t(`workflow.blocks.${llmDefault.metaData.type}`),
       },
       position: {
         x: START_INITIAL_POSITION.x + NODE_WIDTH_X_OFFSET,
@@ -35,8 +45,10 @@ export const useWorkflowTemplate = () => {
     const { newNode: answerNode } = generateNewNode({
       id: 'answer',
       data: {
-        ...nodesInitialData.answer,
+        ...answerDefault.defaultValue,
         answer: `{{#${llmNode.id}.text#}}`,
+        type: answerDefault.metaData.type,
+        title: t(`workflow.blocks.${answerDefault.metaData.type}`),
       },
       position: {
         x: START_INITIAL_POSITION.x + NODE_WIDTH_X_OFFSET * 2,

web/app/components/workflow-app/index.tsx

@@ -3,7 +3,6 @@
 import {
   useMemo,
 } from 'react'
-import useSWR from 'swr'
 import {
   SupportUploadFileTypes,
 } from '@/app/components/workflow/types'
@@ -18,12 +17,12 @@ import Loading from '@/app/components/base/loading'
 import { FeaturesProvider } from '@/app/components/base/features'
 import type { Features as FeaturesData } from '@/app/components/base/features/types'
 import { FILE_EXTS } from '@/app/components/base/prompt-editor/constants'
-import { fetchFileUploadConfig } from '@/service/common'
 import { useAppContext } from '@/context/app-context'
 import WorkflowWithDefaultContext from '@/app/components/workflow'
 import {
   WorkflowContextProvider,
 } from '@/app/components/workflow/context'
+import type { InjectWorkflowStoreSliceFn } from '@/app/components/workflow/store'
 import { createWorkflowSlice } from './store/workflow/workflow-slice'
 import WorkflowAppMain from './components/workflow-main'
 
@@ -31,9 +30,9 @@ const WorkflowAppWithAdditionalContext = () => {
   const {
     data,
     isLoading,
+    fileUploadConfigResponse,
   } = useWorkflowInit()
   const { isLoadingCurrentWorkspace, currentWorkspace } = useAppContext()
-  const { data: fileUploadConfigResponse } = useSWR({ url: '/files/upload' }, fetchFileUploadConfig)
 
   const nodesData = useMemo(() => {
     if (data)
@@ -102,7 +101,7 @@ const WorkflowAppWithAdditionalContext = () => {
 const WorkflowAppWrapper = () => {
   return (
     <WorkflowContextProvider
-      injectWorkflowStoreSliceFn={createWorkflowSlice}
+      injectWorkflowStoreSliceFn={createWorkflowSlice as InjectWorkflowStoreSliceFn}
     >
       <WorkflowAppWithAdditionalContext />
     </WorkflowContextProvider>

web/app/components/workflow-app/store/workflow/workflow-slice.ts

@@ -2,6 +2,7 @@ import type { StateCreator } from 'zustand'
 
 export type WorkflowSliceShape = {
   appId: string
+  appName: string
   notInitialWorkflow: boolean
   setNotInitialWorkflow: (notInitialWorkflow: boolean) => void
   nodesDefaultConfigs: Record<string, any>
@@ -11,6 +12,7 @@ export type WorkflowSliceShape = {
 export type CreateWorkflowSlice = StateCreator<WorkflowSliceShape>
 export const createWorkflowSlice: StateCreator<WorkflowSliceShape> = set => ({
   appId: '',
+  appName: '',
   notInitialWorkflow: false,
   setNotInitialWorkflow: notInitialWorkflow => set(() => ({ notInitialWorkflow })),
   nodesDefaultConfigs: {},