multiple edge

web/app/components/workflow/nodes/question-classifier/node.tsx

@@ -1,13 +1,15 @@
 import type { FC } from 'react'
 import { useState } from 'react'
+import type { NodeProps } from 'reactflow'
 import InfoPanel from '../_base/components/info-panel'
+import { NodeSourceHandle } from '../_base/components/node-handle'
 import { mockData } from './mock'
 import {
   useTextGenerationCurrentProviderAndModelAndModelList,
 } from '@/app/components/header/account-setting/model-provider-page/hooks'
 import ModelSelector from '@/app/components/header/account-setting/model-provider-page/model-selector'
 
-const Node: FC = () => {
+const Node: FC<Pick<NodeProps, 'id' | 'data'>> = (props) => {
   const { provider, name: modelId } = mockData.model
   const tempTopics = mockData.topics
   const [topics, setTopics] = useState(tempTopics)
@@ -23,11 +25,20 @@ const Node: FC = () => {
       />
       <div className='mt-2 space-y-0.5'>
         {topics.map(topic => (
-          <InfoPanel
+          <div
             key={topic.id}
-            title={topic.name}
-            content={topic.topic}
-          />
+            className='relative'
+          >
+            <InfoPanel
+              title={topic.name}
+              content={topic.topic}
+            />
+            <NodeSourceHandle
+              {...props}
+              handleId={topic.name}
+              handleClassName='!top-[11px] !-right-[21px]'
+            />
+          </div>
         ))}
         {/* For test */}
         <div