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/block-selector/index.tsx

@@ -1,173 +1,49 @@
-import type {
-  FC,
-  MouseEventHandler,
-} from 'react'
 import {
-  memo,
-  useCallback,
   useMemo,
-  useState,
 } from 'react'
-import { useTranslation } from 'react-i18next'
-import type {
-  OffsetOptions,
-  Placement,
-} from '@floating-ui/react'
-import type { BlockEnum, OnSelectBlock } from '../types'
-import Tabs from './tabs'
-import { TabsEnum } from './types'
-import {
-  PortalToFollowElem,
-  PortalToFollowElemContent,
-  PortalToFollowElemTrigger,
-} from '@/app/components/base/portal-to-follow-elem'
-import Input from '@/app/components/base/input'
-import SearchBox from '@/app/components/plugins/marketplace/search-box'
+import type { NodeSelectorProps } from './main'
+import NodeSelector from './main'
+import { useHooksStore } from '@/app/components/workflow/hooks-store/store'
+import { BlockEnum } from '@/app/components/workflow/types'
+import { useStore } from '../store'
 
-import {
-  Plus02,
-} from '@/app/components/base/icons/src/vender/line/general'
+const NodeSelectorWrapper = (props: NodeSelectorProps) => {
+  const availableNodesMetaData = useHooksStore(s => s.availableNodesMetaData)
+  const dataSourceList = useStore(s => s.dataSourceList)
 
-type NodeSelectorProps = {
-  open?: boolean
-  onOpenChange?: (open: boolean) => void
-  onSelect: OnSelectBlock
-  trigger?: (open: boolean) => React.ReactNode
-  placement?: Placement
-  offset?: OffsetOptions
-  triggerStyle?: React.CSSProperties
-  triggerClassName?: (open: boolean) => string
-  triggerInnerClassName?: string
-  popupClassName?: string
-  asChild?: boolean
-  availableBlocksTypes?: BlockEnum[]
-  disabled?: boolean
-  noBlocks?: boolean
-}
-const NodeSelector: FC<NodeSelectorProps> = ({
-  open: openFromProps,
-  onOpenChange,
-  onSelect,
-  trigger,
-  placement = 'right',
-  offset = 6,
-  triggerClassName,
-  triggerInnerClassName,
-  triggerStyle,
-  popupClassName,
-  asChild,
-  availableBlocksTypes,
-  disabled,
-  noBlocks = false,
-}) => {
-  const { t } = useTranslation()
-  const [searchText, setSearchText] = useState('')
-  const [tags, setTags] = useState<string[]>([])
-  const [localOpen, setLocalOpen] = useState(false)
-  const open = openFromProps === undefined ? localOpen : openFromProps
-  const handleOpenChange = useCallback((newOpen: boolean) => {
-    setLocalOpen(newOpen)
+  const blocks = useMemo(() => {
+    const result = availableNodesMetaData?.nodes || []
 
-    if (!newOpen)
-      setSearchText('')
+    return result.filter((block) => {
+      if (block.metaData.type === BlockEnum.Start)
+        return false
 
-    if (onOpenChange)
-      onOpenChange(newOpen)
-  }, [onOpenChange])
-  const handleTrigger = useCallback<MouseEventHandler<HTMLDivElement>>((e) => {
-    if (disabled)
-      return
-    e.stopPropagation()
-    handleOpenChange(!open)
-  }, [handleOpenChange, open, disabled])
-  const handleSelect = useCallback<OnSelectBlock>((type, toolDefaultValue) => {
-    handleOpenChange(false)
-    onSelect(type, toolDefaultValue)
-  }, [handleOpenChange, onSelect])
+      if (block.metaData.type === BlockEnum.DataSource)
+        return false
 
-  const [activeTab, setActiveTab] = useState(noBlocks ? TabsEnum.Tools : TabsEnum.Blocks)
-  const handleActiveTabChange = useCallback((newActiveTab: TabsEnum) => {
-    setActiveTab(newActiveTab)
-  }, [])
-  const searchPlaceholder = useMemo(() => {
-    if (activeTab === TabsEnum.Blocks)
-      return t('workflow.tabs.searchBlock')
+      if (block.metaData.type === BlockEnum.Tool)
+        return false
 
-    if (activeTab === TabsEnum.Tools)
-      return t('workflow.tabs.searchTool')
-    return ''
-  }, [activeTab, t])
+      if (block.metaData.type === BlockEnum.IterationStart)
+        return false
+
+      if (block.metaData.type === BlockEnum.LoopStart)
+        return false
+
+      if (block.metaData.type === BlockEnum.DataSourceEmpty)
+        return false
+
+      return true
+    })
+  }, [availableNodesMetaData?.nodes])
 
   return (
-    <PortalToFollowElem
-      placement={placement}
-      offset={offset}
-      open={open}
-      onOpenChange={handleOpenChange}
-    >
-      <PortalToFollowElemTrigger
-        asChild={asChild}
-        onClick={handleTrigger}
-        className={triggerInnerClassName}
-      >
-        {
-          trigger
-            ? trigger(open)
-            : (
-              <div
-                className={`
-                  z-10 flex h-4
-                  w-4 cursor-pointer items-center justify-center rounded-full bg-components-button-primary-bg text-text-primary-on-surface hover:bg-components-button-primary-bg-hover
-                  ${triggerClassName?.(open)}
-                `}
-                style={triggerStyle}
-              >
-                <Plus02 className='h-2.5 w-2.5' />
-              </div>
-            )
-        }
-      </PortalToFollowElemTrigger>
-      <PortalToFollowElemContent className='z-[1000]'>
-        <div className={`rounded-lg border-[0.5px] border-components-panel-border bg-components-panel-bg shadow-lg ${popupClassName}`}>
-          <Tabs
-            activeTab={activeTab}
-            onActiveTabChange={handleActiveTabChange}
-            filterElem={
-              <div className='relative m-2' onClick={e => e.stopPropagation()}>
-                {activeTab === TabsEnum.Blocks && (
-                  <Input
-                    showLeftIcon
-                    showClearIcon
-                    autoFocus
-                    value={searchText}
-                    placeholder={searchPlaceholder}
-                    onChange={e => setSearchText(e.target.value)}
-                    onClear={() => setSearchText('')}
-                  />
-                )}
-                {activeTab === TabsEnum.Tools && (
-                  <SearchBox
-                    search={searchText}
-                    onSearchChange={setSearchText}
-                    tags={tags}
-                    onTagsChange={setTags}
-                    size='small'
-                    placeholder={t('plugin.searchTools')!}
-                    inputClassName='grow'
-                  />
-                )}
-              </div>
-            }
-            onSelect={handleSelect}
-            searchText={searchText}
-            tags={tags}
-            availableBlocksTypes={availableBlocksTypes}
-            noBlocks={noBlocks}
-          />
-        </div>
-      </PortalToFollowElemContent>
-    </PortalToFollowElem>
+    <NodeSelector
+      {...props}
+      blocks={blocks}
+      dataSources={dataSourceList || []}
+    />
   )
 }
 
-export default memo(NodeSelector)
+export default NodeSelectorWrapper